Get access to an awe-inspiring collection Of 87 Beautiful Wordpress themes for the price of one Get it now Ad

Bootstrap templates

Bootstrap 3 & 4 Templates

We usually release one or two Free Bootstrap templates per month. At the moment there are 37 Free and Premium Bootstrap themes and templates carefully prepared for your personal or commercial use.

At the moment, many templates are in Bootstrap 3 and more and more templates are already in Bootstrap 4 supporting all its great new features.

All of the templates are coded with care, fully responsive and cross-browser compatible. Many of them come also with 5+ colour variants to choose from. Enjoy and have fun!

Info on how to modify the templates

Italiano - Restaurant or Café Template
B3 & B4

Italiano - Restaurant or Café Template

Italiano is my free Bootstrap 4 HTML responsive template. You can use it to build an elegant website for a restaurant, café or bistro. This template comes with a lot of useful elements that you might need. Features of this template: - Intro carousel with extraordinary CSS animation, - Well-chosen icon fonts, - Lightbox gallery, - Fancy About section, - Our menu section, - A section for upcoming events or courses, - Signature dishes and Special offers sections, …

View template

Foliou - Bootstrap Portfolio
B3 & B4
Premium

Foliou - Bootstrap Portfolio

Foliou is a responsive one-page Bootstrap 4 portfolio template. It presents your work in a clean and elegant manner and can be used by freelancers and agencies alike. As usual, it comes with 6 prepared colour variants. SASS source files are also included in the download so you can easily and quickly generate your own unique colour combination or make design changes effectively. (Bootstrap 3 version of this template is also included and comes with LESS files) Sections of this HTML portfolio…

View template

Ad

Ad

Bootstrap Blog
Bootstrap 4

Bootstrap Blog

Bootstrap Blog is a free Bootstrap 4 blog template. Minimalistic design, mostly grayscale elements. Included are 3 HTML page templates - Homepage, Category page and Blog post. Seven colour variants.

More than 10,000 users trusted this template.

View template

Hub - Bootstrap 4 E-Commerce Template
Bootstrap 4
Premium

Hub - Bootstrap 4 E-Commerce Template

Hub is a clean and fresh Bootstrap 4 e-commerce template. This template comes with 28 complete page templates, each of them in 6 colour variants - red, pink, violet, blue, sea blue and green. Your own colour variant of this template can be easily created by modifying template's SASS files that are included in the template package. Pages included - Homepage (3 variants - classic, parallax sections, video background), - Category listing (4 variants), - Product detail, -…

View template

University - Education template
Bootstrap 4
Premium

University - Education template

University is a modern Bootstrap 4 education template. It will be your great starting point when building a website for a college, high school or online course directory. This template comes with 6 colour variants and 10 useful HTML template pages. All templates are valid and contain well-commented HTML code. SASS files are included in the download too. Pages included: - Homepage, - Courses listing, - Courses listing - table, - Course detail, - Staff, - Staff detail, -…

View template

ShowTracker - Landing page
Bootstrap 4

ShowTracker - Landing page

ShowTracker is a Bootstrap 4 landing page. It was designed to present your app or product and to collect leads. This template's designed by our good friend Daniel Korpai and coded by Bootstrapious. Pages included in this template are Homepage, Text page and What's on - an alternative text page.

View template

Ad

Ad

Bubbly - Admin template
Bootstrap 4

Bubbly - Admin template

Bubbly is the newest member in Bootstrapious admin templates family. Its design language follows the current design trends - pastel colours, subtle shadows, rounded corners. This Bootstrap dashboard contains 5 responsive HTML pages, all of them in 6 colour variants. Pages included in this template: - Main dashboard with 10 different widget types, - Demo tables - 4 demo table styles, - Charts - Custom styled line charts, bar charts, doughnut, pie chart and more, - Forms screen -…

View template

Universal - Business & E-commerce Template
B3 & B4

Universal - Business & E-commerce Template

Universal is a clean and stylish universal website template, now updated to Bootstrap 4. It stands out with its clean design and elegant typography. It is one of the most complex free Bootstrap templates and with almost 100k downloads (as of December 2018), it is also my most popular Bootstrap freebie. This template includes 45 HTML pages so you should have everything you need to start developing new business, portfolio or e-commerce website. Along with the 45 pages, you will get also 11…

View template

Creative portfolio
Bootstrap 4

Creative portfolio

Creative portfolio is a clean and elegant template mainly made for designers and creatives but can be easily transformed into a generic website. It is fully responsive, based on the latest Bootstrap 4.3.1. This Bootstrap template is easy to modify and customise and is being shipped with 6 colour variants: blue, pink, red, violet, green and sea blue. Although being shipped for free, this template comes with many cool features including: - 6 colour variants, - 4 pages - home, about,…

View template

Photo - Bootstrap 4 E-commerce Template
Bootstrap 4
Premium

Photo - Bootstrap 4 E-commerce Template

Photo is a fully responsive Bootstrap 4 E-commerce template. It is built with the Bootstrap 4.3.1 and contains 11 HTML pages that cover all the major needs when building a new e-commerce website. Out of the box, there are 6 colour variants prepared for you and more can be easily created by modifying template's SASS files. Pages included: - Homepage - version 1, - Homepage - version 2, - Category listing (3 variants), - Product detail, - Shopping cart, - Blog listing, …

View template

Ad

Ad

Bootstrap 4 Dashboard Premium
Bootstrap 4
Premium

Bootstrap 4 Dashboard Premium

Bootstrap 4 Dashboard Premium is a premium version of my Bootstrap Dashboard template. This template contains all the UI elements that come with the free version and many premium components and plugins. SASS files are also included in the download. There are 26 HTML page templates, all of them in 6 colour variants. Pages included in this template: - Main dashboard with 14 different widget types, - Basic demo tables - 4 demo table styles, - Data Table - advanced data table with…

View template

Townville - Real estate template
Bootstrap 4
Premium

Townville - Real estate template

Townville is a professional Bootstrap 4 template for real estate businesses. You can use it to build a professional website to offer houses and apartments in the online space, provide rental services, or create property listings. Either way, Townville template is the right choice for you. It comes with a rich user interface kit that contains a wide variety of website elements carefully designed and coded. You can use this template for: - Real estate agency, - Rental agency, …

View template

Appton - Landing page
Bootstrap 4

Appton - Landing page

Appton is a truly variable landing page created in Bootstrap 4. The template comes with 6 colour variants to choose from. It also uses great SVG illustrations from Undraw and comes with a custom icon font. Page templates included: Frontpage, FAQs, Text page and contact page with a styled Google Map.

View template

Designer - Bootstrap 3 Portfolio Template
Bootstrap 3

Designer - Bootstrap 3 Portfolio Template

Designer is clean and elegant portfolio theme for web designers, programmers, creatives, etc. It is fully responsive, based on the latest Bootstrap 3.3.6. This portfolio template is easy to modify and customize and is being shipped with 6 colour versions: blue, pink, red, violet, green and sea blue. Although for free, this template comes with many cool features including: - Styled google map , - 6 colour variants, - Valid Html5, CSS3 markup, - Fully responsive, -…

View template

Multi - Multipurpose template
Bootstrap 3

Multi - Multipurpose template

Multi is clean and stylish multipurpose website template built with Bootstrap 3.3.7. You can use it to kickstart development of a business website, blog or portfolio. This theme includes 6 colour variants - blue, pink, green, red, sea blue, violet. Multi comes with many cool features including: - Homepage jumbotron, - Great icon fonts, - Gallery/portfolio section with lightbox, - Styled Google Map, - Section with features / services, - Prestyled signup form (no…

View template

Single product e-commerce template
B3 & B4
Premium

Single product e-commerce template

T-Shirt store is a single-product Bootstrap 4 e-commerce templateIt's great for selling a single product or small product range

It contains three most important pages that you might need: homepage (with a range of useful elements)text page and a shopping cart page with a payment form, including the JavaScript form validation. 

Built with Bootstrap 4.3.1.

View template

How to modify a Bootstrap Template

Almost everyone will be able to modify Bootstrapious templates but you will need a basic knowledge and understanding of HTML and CSS. My templates are coded with care and their code is easy to read. Many of Bootstrapious fans use my themes as a way to learn Bootstrap, so there is really nothing to worry about.

In the next few paragraphs, I will try to describe how to do the most basic edits and start using my templates quickly.

1. Download a text editor

You can use a basic text editor like Notepad but I would like to recommend one of these three: Sublime Text, Atom or VS Code. All of them are very fast, they will highlight your HTML and CSS syntax and can be extended with many additional plugins. I personally use VS Code on Windows 10.

2. Extract the template files

All Bootstrapious downloads come as .zip files. To start working with the template files, extract them to your hard drive. Now you are ready to start with the modifications to the template.

3. Content changes

3.1. Basic HTML editing

To change a homepage of your new website, open an index.html file in your text editor and edit it there. 

3.2. Navigation

Do not forget to change links in your navbar appropriately. If you are not creating a one-page website, an active page needs to have a .active class in the navbar to be properly highlighted. Unfortunately, there is no easy way to do this automatically in HTML, so you have to do it manually. 

4. Appearance changes

4.1. A file to save the CSS changes

To add new CSS declarations or to update the current stylesheets, you can a) edit the original source file (e.g. style.default.css) or store your changes in a custom.css file (recommended).

The reason I encourage overriding the CSS in a separate file is because of the template's future updates. When a new update for the template is released, you can just overwrite the original files but your changes will remain intact in a separate custom.css file. Bootstrapious templates also use this approach in relation to Bootstrap framework - everything is kept in a separate file.

4.2. Change template colour

Almost every Bootstrapious template, both free and premium, come with 5 or 6 colour variants out of the box. To change to a different colour variant find <link href="css/style.default.css"> in your template's <head> and replace it with e.g. <link href="css/style.green.css">. This simple change will not only style all template's elements but also all standard Bootstrap features like pagination, blockquote, buttons, tabs and more.  

4.3. {LESS} files compilation

Premium templates contain also {LESS} source files. These are great to make bigger changes to the CSS stylesheets or to create your own colour variants super easily. You will need a compiler to compile {LESS} files to CSS after your changes. I use WinLess (Windows only), another good choice is Koala (multiplatform).

5. JavaScript settings and changes

Each template uses a different set of plugins and you can have a look at the complete list of the JS plugins in the readme.txt in your download file. Plugins are initialised and set in the front.js file located in a js folder. If you would like to tweak the settings of some particular plugin, consult again the readme file and check out plugin's project URL.

6. Additional components

6.1. Contact forms

Some templates contain also a skeleton for a contact form but usually, no backend code is included.

If you would like to choose PHP for your form's backend, I created a step-by-step tutorial on this topic. Before implementing this solution, make sure that your hosting supports PHP 5.3+.

6.2. Google maps

Some templates also come with Google maps sections or pages. From 2017, the Google maps need an API key to work correctly on your website. In some templates, an API key is provided but it is limited to local development and Bootstrapious.com domain, so you will have to generate it for your production usage anyway. To get your Google maps API head here. When you have your API key ready, just paste it to your Google maps JS call as in the following example. 

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBu5nZKbeK-WHQ70oqOWo-_4VmwOwKP9YQ"></script>

You can find more info about Google maps and their integration to my templates in my Google maps tutorial.

6.3. Social icons

Would like to have Social icons on your page? Many of my Bootstrap templates have the icons already prepared, you just need to give them life.

There are two easy solutions. The first is to add links to social network sharing scripts, find out more about Social icons and share URLs in my tutorial. I recommend this solution as it will not add any additional data load to your website and everything will be nice and swift.

The second solutions are SumoMe's share buttons. Find out more about SumoMe Share installation.

6.4. Collecting emails

Many of my free Bootstrap themes also contain a form to collect email addresses. The form is not set for any email provider but its setup is very easy and straightforward. One of the most common emailing providers is MailChimp. More info on Bootstrap and MailChimp integration in my tutorial. 

6.5. Icon fonts

Almost every Bootstrap template you will find here uses Font Awesome icon font. This icon set contains almost 700 useful icons. To find out what these are, check out Font Awesome cheat sheet. I also use icon sets from Pixeden or Flat Icons. If you would want to add some more icons or change an icon style a bit, have a look at my curated list of free icon fonts.

Share on Facebook Share on Twitter Share on LinkedIn