Build Cool Bootstrap Websites that you can Sell (no coding)
4.4 (53 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
2,934 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Build Cool Bootstrap Websites that you can Sell (no coding) to your Wishlist.

Add to Wishlist

Build Cool Bootstrap Websites that you can Sell (no coding)

Start your web design career, work from home building awesome, fast loading, responsive websites with bootstrap.
4.4 (53 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
2,934 students enrolled
Created by Jamie Henry
Last updated 9/2017
Current price: $10 Original price: $125 Discount: 92% off
30-Day Money-Back Guarantee
  • 5.5 hours on-demand video
  • 2 Articles
  • 7 Supplemental Resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion

Training 5 or more people?

Get your team access to Udemy's top 2,000 courses anytime, anywhere.

Try Udemy for Business
What Will I Learn?
  • Build and customize, fast loading, awesome looking websites for themselves or their clients
  • Understandof how the basic bootstrap structure works
  • Source and use great stock photos with no cost.
  • Utilize awesome free software resources from the web
  • Upload a completed website to a live hosting provider
  • Inspect and live-edit the HTML and CSS of a page using the Chrome DevTools Elements panel.
  • Take on a web design project for many different types of business
  • Take the first steps to becoming a full time web designer
View Curriculum
  • Need to have a desire to work from home and create awesome websites
  • Need to have a computer with Windows 7 or newer or Mac with recent OS
  • Need to be willing to learn some great new skills
  • Needs to have an interest in contributing to the online digital world

Take your first steps into the ever expanding, exciting, well paid world of web development. Learn how to build fast loading, responsive websites on your computer with no coding skills required. This course will take you a step by step guide of where to find, download and use free software resources that will enable you to build some awesome websites. We also cover how to upload the finished websites to a live hosting provider. Web design is a high demand skill and is still growing. This isn't a HTML5 or CSS3 coding course, but we will be demonstrating some easy code tweaks. The sites that you build after taking this course should sell to potential customers for a minimum of $1000 each. Start today and earn income by building awesome websites.

Who is the target audience?
  • Anyone that wants to work from home or start a home business
  • Creative people that are interested in starting to develop good looking websites for themselves or their customers
  • Poeple wanting to break into the well paid, exiting and ever growing world of web development
  • Anyone that has wanted to become a web designer but is put off by needing to learn to code
  • This course is not for people that want to build eCommerce websites
Curriculum For This Course
30 Lectures
Course Introduction
2 Lectures 08:30

Introduction to the course - Explaining a little about the instructor, what you will learn and what you will need to complete this course.

Preview 05:16

Here is a introduction to the instructor and information about the resources and goals of this course

Preview 03:14
Resources Section
3 Lectures 18:27

Downloadable files to help you get what you need to follow along with this course, including links to source websites, easily insert-able code snippets and image resources

Download the resources we will be using in this course

This video covers the many resources that we will be downloading for this course, including stock photo sites, free graphic software resources, bootstrap resource sites, and how we will go about using them

4 - Take a look at the resources we have downloaded

How to search for and find some awesome bootstrap templates and download the files needed to build our complete website

Downloading our core Bootstrap files
Free Stock images and Free Text editor
2 Lectures 12:29

Navigate to some great stock photo sites, where we can get great free stock photos for our website. Learn how to download them and what sort of license we need to check for to use them for free

Let's get some free stock Images

In this video we download an awesome free graphics program for editing our images, and a free text editor needed to edit our website HTML and CSS files.

Let's get some free graphics and text editing software

Answer some Image quiz questions

Test your stock images knowledge with this quiz
3 questions
Menu Logo and Hero section
3 Lectures 25:47

Here we start digging into our website, we will be showing how to create, edit and customize our downloaded images, then insert them into our website slideshow

Preview 10:22

In this video we create a new logo with our graphics software, then cover how to insert the new logo into our website header.

Get your own logo in the game

Here we start to work on the hero section, learning how to edit and change the slide show captions to our customers needs, and how to edit the slide show call to action button.

Customize our new slide show captions and buttons
Main Body Content
6 Lectures 02:02:27

In this video we work on the about section with our text editor. Adding the text, font awesome icons, and images that we want to use for our new website. We also cover how to edit and customize the animated progress bars.

Getting creative with the about section

Working on the services section, we add and edit icons, insert our custom text into information boxes.We also show how to change the section background image to one that we select.

Create an engaging services section with background images

Moving on to the team or staff section, we add the team photos to our website, insert custom text information and titles. We then go over how to add and delete social media icons, and how to add the linls needed to direct them to the required social media sites.

Build a team section with linking social media icons

Here we work on the portfolio section, adding custom images and image overlays. We show how to add and remove image overlay external links and pop out light box links. We also show how to edit the image picker to enable selection of different photo groups .

Adding images overlays to our portfolio section

In this video we learn how to edit the rotating client carousel section, covering adding custom customer images and testimonial text. We also cover adding external links and highlighted text below the images.

Let's add some custom testimonials to our client section

In this video we work on the blog section, we add our own images, insert our custom text to 'read more' information boxes. We then cover how to edit and customize the pop out full blog entry, showing also how to troubleshoot image size issues.

Adding information and pop out boxes to our blog
Get Connected
2 Lectures 25:50

Here we start working on the contact form. Learn how to edit the contact form input fields and placeholder text, add our address and contact details. We also show how to change the text on the submit button.

Get connected with our working contact form

In this video we go over how to edit the contact php file. This file needed to enable the sending of our contact form to our email address once the website is uploaded to a live hosting server. We also add a custom background image to the contact section.

Enable our contact form to work with a PHP file

A quick contact for quiz
1 question
Finishing Touches
2 Lectures 20:04

In this video we show how to give our site a browser identity by adding a favicon icon. We also cover where to insert keywords, and where to enter description text to enable site discovery and information when the site is crawled by a search engine.

Preview 10:23

Here we add some custom code that will add a back to the top icon to our site. Adding this great feature will really enhance the user experience for any people that come to the site on a mobile device.

Preview 09:41
Let's go live!
1 Lecture 14:41

Here we have reached the point where we are happy with the design of our new website. In this video we learn how to upload our finished website to a live server at our hosting provider. After uploading we check the site and test that we can send and receive emails from our contact email form .

Time to make our site live with an FTP upload
What if?
9 Lectures 01:16:28

Welcome to the "What if?" section. We have covered a lot by this point in the course. Here is a bonus section that covers a few scenarios that may arise when customizing a site for a customer, and how to tackle them. Warning for the faint hearted, we are going to do some coding in this section. Don't worry I have made it very easy to follow. I know you can do it!

Introduction to the What if? section

What if your customer wants a custom size logo? If you change the size of the logo, suddenly things can look out of alignment. In this video we learn how to correct this issue if it happens.

Preview 12:01

What if out website colors don't match our logo? If your customer sends you their company logo, and you find that the colors don't match the highlight colors you have used on your site. We show how to check the exact color, and then how to easily implement that color into your website.

What if my site colors need to change?

What if we need to turn a one page scrolling website into a multi page website? So you have the perfect site that you want to use for a customer, but it is a one page scrolling site. your customer wants a multi page site with separate pages for each section. No problem, here we start working on converting a singe page to a multi page site. It's easier than you may think!

What if I want to turn this into a multi-page site?

More about editing our multi page website. In this video we continue working on our multi page site conversion, turning our single page scrolling website into a five page website with updates menu and links.

What if Multi-page continued?

Download these files to help follow along with the next video - They contain a css file and an columns.html file. These files will enable you to add extra multiple columns of text and images to your site with ease.

Here are some extra files to download for multi column sections

What if I want to add extra columns of text and images to my site? Here we show how to add additional columns of text and images to our website, using the provided file downloads in the previous lecture.

What if I need to add extra columns and text to my site

In this video we go through the steps needed to add a full width google map to your Bootstrap website. We show you how to get the map code, create your api key and insert it into your site.

What if I want to add a full width Google Map to my site

Thank you for taking this course, I hope you have enjoyed it as well as learning some valuable new skills. I wish you all possible success with your new website building. Please look out for more courses about taking it to the next level from me, I will look forward to working with you in the future!

Conclusion and final site files download
About the Instructor
Jamie Henry
4.5 Average rating
120 Reviews
8,325 Students
3 Courses
Web Developer

With over 25 years experience in the I.T. industry, Jamie has huge experience in many different fields. Originally from England, Jamie moved to the US in 2007 working for an I.T. company in Tennessee. Now a free lance web developer specializing in Wordpress, HTML5, CSS3, Joomla and Bootstrap, Jamie also has his own I.T. company near Knoxville in Tennessee, and is keen to pass his skills on to the ever growing web development world.