In your favorite code editor (I recommend Notepad++) edit your currently empty style.css and add a comment header. This is one of the required files for a valid WordPress theme. So my folder structure now looks like this:įor the purpose of this template, we are doing the bare minimum required to get our theme up and running using Bootstrap. Create these six files in your theme folder: I have used the latter option: I created a folder called “bootstrap” and then extracted the bootstrap-3.3.6-dist.zip file into it. You can either extract them directly into your theme folder or create a folder called “bootstrap” and extract the files into that. When extracted, the Bootstrap files are organized into three folders: css, js, and fonts. Give it a relevant name – this is going to be your main theme folder. For the purposes of this tutorial, lets call it “bootstrapstarter”.ĭownload the latest Bootstrap (currently version 3.3.6) framework by going to this link. The first thing to do is to create a new folder inside wp-content/themes. For now, leave this folder empty.
If you’d rather download the source code for this tutorial right away, here you go: Download Source Step 1: Create Your Theme Folder Hope you find this helpful and if you have any questions, please go ahead and ask away in the comments section and I’d be happy to help! In the third installment, we discuss adding a slider to the theme. The navigation and sidebar, along with other items such as widgets and some customization will be handled in the next part of the tutorial. In this part, we will create all the basic files required for the Bootstrap WordPress theme and write code to list the latest posts ( The Loop). This is part 1 of the tutorial, which will have future installations that I will continue to list here as soon as they are written and complete. Create Bootstrap WordPress Theme From Scratch So head on over to and take a good look at what we would end up incorporating into our very own theme.
We will use one of the starter example templates from the Bootstrap website for this tutorial: the blog template which is a simple two-column blog layout with custom navigation, header, and type. I am assuming you have WordPress installed and running. If you have basic PHP skills, and are looking to develop a responsive Bootstrap WordPress theme using the popular CSS framework Bootstrap, then this step by step tutorial is for you. I will cover the basics of building a WordPress theme using a starter Bootstrap template and create a basic blog feed (latest posts) page.
0 kommentar(er)
