Wordpress Theme setup & structure - how theme files are organized
Themes are probably the most exciting feature of your blog. In case you are new to Blogging or WordPress, a Theme is the layout of your blog site. They also go by the names of Skin, Styles, Template or Layout. All of them mean the same.
Wordpress community and forums offer a large number of free themes that you could use. The best part is you could modify & tweak most of these themes to suit your own needs.
A typical Wordpress theme will have 2 or 3 components. The components are universal - meaning that the structure is defined by Wordpress and anyone creating a new Theme has to follow the same structure for the Theme to work.
- The theme files - usually the PHP files in the root directory of the theme folder. The important files within are the header.php, the sidebar.php, index.php, single.php, page.php, search.php, style.css, archive.php & footer.php. I will explain these files below.
- The image directory - the theme may be using some images, like the Feed image (rss.png) or any other buttons or icons. All these images are stored in the images folder within the themes main folder. If you either add new images that have to work as a part of a particular theme, you have to upload those image files in the images folder.
- The script js or scripts directory - some of the themes will use special scripts. An example is when you use template that has tabbed content. The scripts that make the tabs work are all stored in the js directory. Sometimes, this directory is also named as scripts. The naming depends on the creator.
When you modify and alter your theme, you have to maintain the structure for your creation to work. I will explain the different files that you see in the base or root folder so that you would know which one to modify.
Explaining The Wordpress Theme Files.
Wordpress does not store website or blog pages separately. The content, including the data, pictures, videos and other media are all stored in either a database (SQL database) or in specific folders. For example, in the Settings tab, you have specified where to store the media files that you upload for your posts.
When a visitor looks up your blog, a page is created on the fly by quickly pulling in a header, a content body, a navigation or menu, sidebars and a footer. The blog program then pulls up the content (what you call as posts or entries) and media from the databases and specific folders. This is the reason you see separate files like header.php, the sidebar.php, index.php, single.php, page.php, search.php, style.css, archive.php & footer.php. A combination of all of many of them is the final page.
1. header.php - this is the top part of the blog. It usually contains all the basic information for the page. Examples are all the Meta tags, like who is this author, what software is running, what are all the various links etc. You will find that none of the information is hard coded. That makes the header reusable. The modifications that you may like to add are:
- Meta Tags like Keywords, Author, Revision
- Tags like Copyright & Licensing information
- Any Robot tags for Search Engine Robots
- If you would like to add any specific content that comes up any time a header is displayed - like an advertisement, or a small profile about the author, or a content on your company
2. sidebar.php - You will see Themes classified as 2 Column, 3 Column and others. They all refer to the fact that these blogs are created to be viewed “vertically”. So one column would be where all your contents (that is posts, entires & comments are displayed), others could be having navigation information like Categories, Pages etc.
To make blogs very flexible, the sidebar term indicates all the columns except for the main column which contains your posts. You may have more than one sidebar column. You will find individual files for each of the sidebars - like a lsidebar.php (for left sidebar), rsidebar.php (for right sidebar) etc. You will add or remove information from these left or right sidebars through your widgets (in the Design panel of your blog).
- You will modify your individual sidebars for contents that you would like to appear in one of them only.
- You should attempt to use the sidebar widgets as much as possible
- You need to modify the sidebar.php file only when you want to place something that spans across the entire sidebar.
3. index.php - this is the main body of your blog and appears when someone comes over to your domain for the first time. So when someone types in http://yourdomain.com/, the visitor sees your blog which is created with a header.php file, the index.php file, the sidebar.php file and the footer.php file. There could be more but I am trying to give you a simplistic idea. The index.php file is not shown when the visitor clicks on any page other than your domain.
The Setting tab allows you to define where your visitor will land when they type in your URL. You could change it to any specific page or it could just point to the last post in your blog (this is the default setting).
4. single.php - this file is used to display one single post of your blog. Your blog will show a list of your posts on the index.php file. When the visitor clicks on any particular post, they are taken to that particular page that contains only that post and no other posts.
- If you want to have specific content that you want to appear only when one post is displayed, you have to edit the single.php page. Like you want to show some specif ads or promotions only when single posts are displayed, you have to add that content to the single.php file
Note that even though one single post is displayed, the entire page is created by pulling in and tying up the header.php file, the sidebar.php file, the single.php file and the footer.php file all together. There could be a few more depending on what your theme looks like.
5. page.php - this file helps you to display a page. When you create a new page from the Write –> Page tab on your Wordpress dashboard, a page.php file is used to display the content of the page. The page.php file is not used in any places other than this.
- Many times you need to specify a different format for your pages. For example, you may like to have pictures and videos and other media files on individual pages and you may want to have a layout which is different from the post or index layout.
- You may have to add specific advertisements relevant to your page’s content. In that case you modify the page.php file only
6. search.php - this page displays the search results from your blog. Say for example, a visitor is reading a post (the single.php file) and decides to search your blog on a topic. Upon hitting the Search button, the search results will be shown by the search.php file.
- Google has got advertising specifically designed for Searches. You may want yo add the Google Search advertisements in the search.php file so that Google could put in relevant, content based advertising links.
7. style.css - this is the most important file within the theme. It is the Cascading Style Sheet file. It contains all the information on how your blog site will look. It defines what color would the headers have, what the bullets would look like, how much the indent would be, what fonts to be used, what would be the line spacings, how the border of your images would look like and everything else that has to do with the look and feel of your web blog.
- You have to know CSS to edit this file
- You should keep a back up of the original style.css file just in case something goes wrong and you could copy the original file and save your day
- You should follow the CSS standards when you edit the file. Not that it will break your site if you dont, but it is just a good practice
- Your CSS file could slow down the page load if you write complicated formats or jumble up your formatting
8. archive.php - this is the page that comes up when a visitor wants to see the content archive. Archives are grouped in various ways - by years, by months, by categories etc. The archive.php file will determine how that information is displayed.
9. footer.php - this is the last part of the page and contains, as the name suggests, all the contents that go into your footer. The usual contents are the copyright information and any credits that you need to share.
- You would need to modify this file, much like the header.php file, if you want some specific content to appear in your footer. The content will appear on all the pages at a location where the footer is displayed.
- A good place to show ads is the footer, and you would have to add your advertising code in footer.php for that
- You may also add links, comments, posts in your footer so that you could free up your sidebars and yet allow readers to see these informations.
There could be a few other files in the Themes folder but the most relevant ones are all covered here. The Wordpress documentation site is also a great place to look up each of these pages and how to modify the code in them.
Find more Internet Money Making Tips in: PHP, Wordpress, Wordpress Themes
Sponsors
More Free Software & Internet Services
- 25 Part Time Business Ideas - Excellent Home & Small Business Ideas
- 3 Great Options of Free Advertising - Advertise Your Website Blogs for Free to Millions of Internet Users
- Free Trial Offer for Online Webstore - Sales Solution for Small Business
- 7 Small Business Tips - Tools for Sharing Pictures & Videos Effectively
- Setting up Online Survey for Small Home Business - Free Trial Online Custome Web-based Survey Forms
More on Small Business, Media, Free Software & Photography Business:










Leave your response!