Learn Bootstrap 4 The Most Popular HTML5 CSS3 & JS Framework

Learn Bootstrap 4 The Most Popular HTML5 CSS3 & JS Framework

English | MP4 | AVC 1280×720 | AAC 48KHz 2ch | 10.5 Hours | 2.46 GB

Bootstrap to WordPress just added! Create an amazing website with the new Bootstrap version, 100% practical course!

This Course contains the Basics of the new Bootstrap 4 Framework + Building a Complete Project from Scratch.

The new version of Bootstrap contains a lot of new classes, helper utilities, a Flexbox powered grid and new components which all will be covered in this new course.

We’re building a complete Website and i’m gonna show you how to integrate PHP / MySQL with Bootstrap 4.

You will also learn how to extend Bootstrap components with CSS to make them look the way that you need to.

6 Photoshop files (PSD) are included in this course that are going to be converted intro a Bootstrap 4 Website, so if you’re looking for a PSD to Bootstrap course, this is the course that you should take!

What You Will Learn

  • Build Websites with the New Bootstrap Version
  • Connect PHP / MySQL with a Bootstrap Website
  • Learn almost all the Components and Bootstrap Classes with a Hands On Training Course
  • Take your existing site into a fully dynamic WordPress site
  • Convert a Bootstrap site into a WordPress Theme!
Table of Contents

Course introduction
1 What we will build
2 The PSD Files for this Course
3 The Code for this Course
4 The Images for this Course

Basics of Bootstrap 4
5 First Steps with the Grid
6 More advanced grid options
7 Working with Typography
8 More Typography Classes
9 Working with Images
10 Working With Tables
11 Working with Buttons
12 Working with the Card Component
13 Carousel in Bootstrap 4
14 Adding Controls to the Carousel
15 Adding Captions to the Carousel
16 The Accordion Component
17 Working with Modals
18 Adding a Grid Inside Modal
19 Working with Menus and Navigations
20 ScrollSpy
21 Adding a Tooltip
22 Adding a Dropdown
23 The Jumbotron Cumponent

PROJECT_ Building the Home Page
24 Starting our Project
25 Working With The Header
26 Creating the Main Navigation
27 Styling the Main Navigation
28 Adding Google Fonts
29 Adding the Carousel
30 Styling the Carousel
31 Working with the New Website Section
32 Styling the New Website Section
33 Working With the Image Links Section
34 Styling the Image Links Section
35 Adding CSS3 Transitions
36 Working with the Business Hours Section
37 Adding a Table
38 Styling the Working Hours Section
39 Developing the Products Section
40 Styling the Products
41 Working With The Appointment Section
42 Styling the Appointments Section
43 Working with the Footer
44 Working with the Social Networks Menu
45 Printing the Social Icons
46 Moving the File to a Local Server
47 Splitting the Website into different PHP Files

PROJECT_ Building the About Us Page
48 Adding the Main HTML For this Section
49 Styling the Hero Image & adding the main content
50 Adding the Business Hours Table
51 Adding a Gallery

PROJECT_ Working with the Services Section
52 Creating the services page
53 Printing the Services into a Tab _ Collapse
54 Building the Coupon Sidebar
55 Styling the Services Section
56 Re using the Appointments Section from the home page

PROJECT_ Building the Shop _ Products Section
57 Creating the Main Products _ Shop Page
58 Adding the Single Page Product

PROJECT_ Building the Contact Section
59 Building the Contact Form
60 Styling the Contact Form

PROJECT_ PHP _ MySQL – Creating the Database to display the Products
61 Creating the Database
62 Populating the Database
63 Creating the Connection to the Database
64 Printing the Products in the Home Page
65 Printing the Products in the Products page from the Database
66 Working with the Single Product Page
67 Printing the Information from the database to the Single Product Page

PROJECT_ Building the Contact Form with jQuery_ AJAX and PHP
68 Adding Validation with jQuery
69 Refactoring our Code
70 Printing feedback in the Contact Form
71 Validating the other fields
72 Checking that there’re no errors in our contact form
73 Adding AJAX
74 Building the Send PHP File
75 Finishing the AJAX function
76 Testing our Project

Adding a Responsive Navigation (Hamburger Menu)
77 Adding the markup (HTML)
78 Styling our Hamburger Menu
79 Making the Menu Fixed when scrolling to the bottom of the page

How to Migrate your website into the latest version
80 Migrate to the new Beta Version

Converting our Website into a WordPress Theme – First Steps
81 Local by Flywheel
82 Installing WordPress locally with MAMP
83 Creating our theme
84 Adding the main Stylesheet

WordPress Theme_ Working with the Header
85 Working with the header
86 Adding the Main Social to the functions file
87 Printing the Menu in our header
88 Creating all the Pages and Adding the Main Navigation
89 Printing the Main Menu
90 Finishing the Main Menu

WordPress Theme_ Working with the Footer
91 First steps with the footer file
92 Adding a widget in the footer
93 Adding two more widgets in the footer
94 Finishing the footer
95 Adding the JavaScript Files in the footer

WordPress Theme_ Working with the About Us Page
96 Adding a Page Template for the About Us Page
97 Adding a Gallery for the About Us Page
98 Making the Gallery compatible with Bootstrap
99 Final Adjustments to our Gallery
100 Adding the Business Hours and the Sidebar
101 Printing the Business Hours in the Sidebar
102 Creating a Widget in the Sidebar for the Business Hours

WordPress Theme_ Working with the Services Page
103 Adding the Page Template and Registering the Fields
104 Printing the Information
105 Displaying the Coupon on the Sidebar

WordPress Theme_ Working with the Products Page
106 First Steps with the Products Page
107 Adding all the Products into WordPress
108 Adding a Shortcut to Display all the Products
109 Working with the Single Product Page

WordPress Theme_ Working with the Contact Us Page
110 Displaying the Contact Form with a Shortcut

WordPress Theme_ Working with the Home Page
111 Adding the Posts for the Carousel
112 Querying the Database to display the posts in the slider
113 Finishing the Slider
114 Printing the Slogan
115 Adding the Main Information for some Pages
116 Querying the Database to display the Main Information
117 Printing the Business hours in the front page
118 Displaying the Products in the Homepage
119 Working with the Make An Appointment Section
120 Adding Dynamic Titles to the pages for better SEO
121 Taking a Screenshot