Alright I left off with having you download my theme Wooden Default. I am going to be referencing this theme so if you download it you will understand what I am doing much easier. Today I am going to talk about the first steps in developing a theme, this is considering that you already have a design.
The first thing that I do when creating a theme is worry about the header.php page. This header page is used on every page on your site so what ever you would like to appear at the top of every page will go in here. Later I will teach you how to put stuff specific to a certain page in the header. Some of the thing you have to know at the start WordPress has some code that you must have in some of the pages.
Well to start the header it is just like you would start any other page.
This tells the browser which type of markup language the page is written in: <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
This is your HTML tag with a WordPress language attribute: <html xmlns=”http://www.w3.org/1999/xhtml” <?php language_attributes(); ?>>
This is your HEAD tag: <head>
This is your TITLE tag which looks a lot different than the normal TITLE tag: <title><?php bloginfo(‘name’); ?><?php wp_title(‘-‘); ?></title>.
This is because WordPress has a function called bloginfo which can do quite a bit of different things and I will leave you to find these out. But in this instance we are using blog info NAME, this is just the name to which you gave your site. Also the wp_title is just the title of the page you are on so if you are on your about page it would look like this(Your Blog Name – About). The wp_title function you can also do quite a bit with. This is not everything that you can do for your TITLE and if you are using my Wooden Default theme you will see some other things that you can do and dont stop there you can find much more at wordpress.org.
This is to connect to your STYLE Sheet which we will talk more about in another session:<link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>” type=”text/css” media=”screen” />
This is your RSS FEED: <link rel=”alternate” type=”application/rss+xml” title=”<?php bloginfo(‘name’); ?> RSS Feed” href=”<?php bloginfo(‘rss2_url’); ?>” />
There is quite a few different things that you can do with this and you can check them out at wordpress.org.
This is your PINGBACK so people and servers can ping you: <link rel=”pingback” href=”<?php bloginfo(‘pingback_url’); ?>” />.
As you can see with this we are using another WordPress bloginfo function.
This is a WordPress function to denote the end of the HEAD section: <?php wp_head(); ?>
This is the Closing tag for the HEAD section: </head>
With just these you can start your header section but you can add more depending on what you want the site to do. If you would like to have more stuff on every page I would start your BODY tag: <body>. After that I would make a class wrapper that way you can make sure everything in your site stays inside the wrapper class. With my Wooden Default theme that I hope everyone is using you can see that I have added quite a few different things to the header. These include a header section and a nav section. These are most of the time standard for WordPress themes. Inside the header section you can create your LOGO, your RSS link, your site description, your register and admin functions.
Wooden Default Theme
I am going to go into some of the thing that are in the Wooden Default theme so if you have not downloaded it I would so you understand. If you look at the DIV PAGE section you will see some more bloginfo functions one being url which just echos out the site url. So if you need to put this anywhere on your site you can use this. Or if you want to call a specific page you can use this so that you do not have to use your actual url. The bloginfo name just echos out your blog/site name. The bloginfo description echos out your description that can be set up in the admin section. The bloginfo rss2_url if your RSS2 url. These all can be used to make your site much easier to read and there are quite a few other bloginfo functions on the wordpress.org site. Some of the other things that are found in the Wooden Default header are wp_list_pages, wp_register, wp_loginout, is_home, and get_option all of these can be used through out the development of your WordPress theme.
Well that wraps up the header section of a WordPress theme, there is alot of different thing that you can do with the header section and in one post I am not able to tell you them all and I dont know them all. One thing I would ask of you is to go out and experiment with all the different things that you can do with your header section. Go to the themes section of wordpress.org and download a simple theme and see what they have used in the header. Research the bloginfo function it is used quite a bit in your theme development. Well next time I am going to talk about the index page which can be really easy or really confusing depending on how much you research.