now/Secrets of WP Theming: Part 1
Today I am beginning a series on some of the lesser known features of the Theme System in WordPress 1.5 , I am not sure how many parts there will be, might be just this one. But don’t count on it. Here are Part 2 and Part 3.
So lets talk about Custom Templates, and more importantly how we can bend them to our will. Now I am assuming that by now everyone has at least a passing familiarity with Templates in WP 1.5, for those who are not up-to-speed, lets cover some back-story.
Templates are the foundation of the WP theme system, and one of the most powerful features, in my opinion, in 1.5. A template defines the layout and “feel” of different aspects of your WP powered site.
There are a number of templates that are strictly defined in WP, they are as follows (list taken from the codex):
For instance, I have a template that defines the look of my index, one that defines viewing single posts and one for category listings. Each one has different structure, CSS and WP function calls based on its purpose. The one thing they all have in common is the_loop, or the bit of code that tells WP to spit out the appropriate posts for a specific area of my site.
So class, are we all caught up on templates? Good, well what happens when we want to add a page to our site that doesn’t have anything to do with our posts or categories?
Say we want to add an archives page like the one here at Sillyness to our sites?
Again we turn to Templates, more specifically Custom Templates.
Now we have already stated that there are a number of strictly defined templates in WP. But there is also another category of templates, ones that can be anything, can be called anything and can be applied to any “Page” you create in WP. It is here with Custom Templates that the fun begins.
It is a little known fact that you can apply custom templates to blank “Pages” in WP. What I mean is that you can create a completely blank page in WordPress and then apply a custom theme laden with code to it. As an example lets look at the archives page here at Sillyness.
If you were to look at the page I created in WP named Silly Archives, the “Page Content” area would be completely blank. If you then opened my custom template you would see a whole mess o’ code, and interestingly enough the_loop is no where to be found. In fact the only WP core code that you would find would be get_header(); and get_footer();
The rest is either embedded code, or plugin calls.
So back to our hypothetical example. Our first step would be to create the custom template that will be applied to our Archives page. Because we do not re-invent the wheel, we will be making use of Shawn Grimes Clean Archives plugin, and my Commenter Heat Map plugin.
So first things first, every custom template must start with the following code:
<?php /* Template Name: Archives Template Description: A template for my archives pages. */ ?>
In addition for this particular page we need to add a call to wp-blog-header.php so our opening code will actually look like this:
<?php
require('./wp-blog-header.php');
/*
Template Name: Archives Template
Description: A template for my archives pages.
*/
?>
Next we call for our header.php file and start adding our content:
<?php get_header(); ?>
<div class="main">
<h2>
Here are the archives for <?php bloginfo('name'); ?>.
</h2>
<p>
Search the archives.
</p>
<div class="search">
<form method="get" id="searchform" action="/index.php">
<input type="search" value="Search" name="search" id="s" />
<input type="submit" id="submit" name="Submit" value="Go!" />
</form>
</div>
Now you could have put some of this in the “Page Content” area of the ‘Create Page’ screen, but for this demo we want to have everything in the template, so on we go.
<?php echo srg_clean_archives(); ?> <h2> Commenter Heat Map </h2> <p> Below is a heat map of the commenters here. </p> <?php cjd_comment_heat(); ?> </div>
And finally we close with the footer call:
<?php get_footer(); ?>
And that is the entire template, now we save it as new_archive.php and upload it to our /wp-content/themes/ourtheme/ folder, then log into our WP admin area to create a new Page.
So let’s go to Write > Write Page and get to business. First off we need to give our page a title, let’s say My Archives, once that is done we can skip down past the “Page Content” area to “Page Options”.
The first field should be Page Template, and in the drop down box we should find Archives Template, select that and click Create New Page. That’s it, if you have installed and activated the plugins, when you load http://my.site/my-archives/ you should see your lovely new Archives page.
Well that’s it for the first of this series. I hope you have had as much fun as I have. If you have any questions, leave them here in the comments and I will do my best to answer them.
comment/Content
comment/Information
Just one of Chris’ many gifts, a good amount of people are experienced and know alot, but only a handful of them can relate it with clear understanding so that the unlearned can grasp it, and better yet impliment it.
I’m quite anxious to learn from this series, and do my best to pass it on…
Yeah sorry about that. I am going to be publishing a revised version of each of these articles on the codex when I am done.
Wish I’d had this before I went slogging through codex.wordpress.com. This makes a little more sense than what I found there.
Great work, Chris. Thanks for sharing.
I for one am very appreciative of the time and effort people such as yourself take to document these basic, yet somewhat confusing topics. Thanks :)
Secrets of WP Theming: Part 1
Nice tutorial about custom templates in WP by Chris J. Davis
Oh this is going to be great Chris. Thank you so much for providing the information!
Nicely done Chris. You’ve taken something that has been trivial to quite a few people and turned it into an easy process. Thanks for the pimpage too.
If there is one thing missing in the WP package right now, this is this kind of greatly understandable explanations and documentation ! Well done Chris !
Thank you for the great post. Couldn’t come at a sweeter time :)
Fantastic, Chris. Thanks for taking the time to outline this!
This is great, thanks, now I can start making my own and not relying on editing default templates.
Nice work Chris. I’ve been meaning to do a tutorial like this for a while, but you beat me to it. Well done.
Secrets of WP Theming: Part 1
Chris Davis has a good article on WP Themes
Check it out
…
There is something about templates in WP that is deeply unfathomable when you get started - and so simple once you understand it - this is a really great tutorial bridging that gap, explaining the mysteries and hopefully helping folk step over their apprehension. :)
Oh for peets sake I went through Codex too and I got a little lost so I resulted to reading books on CSS and whatnot and I’m sure this will definately help shed some light ;)
[…] stumbled across two other things that I should look at later: A potentially interesting piece on WordPress themes An interesting looking anti-spam tool But they& […]
I found the best way was to deconstruct a template that looked the most like what I was going to end up with when I was done, but this series will probably be way better… Good stuff.
Great write up! This information will definitely get beginners started.
Well done, Chris! Another feather in your cap, to be sure.
[…] Following up on this WordPress theme howto and this one also, now comes Secrets of WP Theming: Part 1 […]
Excellent. I love it when people think outside the box.
Chris,
Nice work. You explain the basics well - which I can never do right. Very cool article. :)
Nice! Thank you so much for explaining in a straight-forward, clear manner. I look forward to future articles as well.
[…] WP-theming”> Secrets of WP-theming V
[…] jokin tietoturva-aukko. WordPress-ulkoasuista puheenollen, Chris J. Davis on kirjoittanut johd […]
[…] in the arse to maintain. Well, not for much longer… I’ve just discovered, via this article, that WordPress 1.5, and later has the ability to create “ […]
links for 2005-05-28
Powerdraw Apparently this was done using MSPaint! Incredible. (tags: via:b3ta mspaint paint computer art deviantart cool design drawing windows…
[…] @ 1:30 pm · Filed under Coding, Software, Tutorials, CSS Here’s a great article on getting to know how WordPress works with […]
Flawless article, great job. I was trying to figure this out only yesterday. Although, I’m wondering if the
srg_nice_archives()function could be pulled off without ~50 queries. My query total on my archives is 81…Thanks in any case![…] Sunday May 29, 2005 Secrets of Wordpress Theming Secrets of Wordpress Theming. Written by Scott at […]
Great tutorial. How do you get that slick OS X style form box on your archives?
Thanks for the tips in creating a wordpress theme from scratch.
Way Cool. That was really straight forward and easy to understand. Looking forward to the other articles in the series.
Cheers!
hey, this was great. I’m not a code-kid myself, so I found the article very useful. and thanks to Problogger’s Darren for pointing it out.
Very good.
When I did my first theme, I had a hard time figuring out how to make a template. Took me a week to learn it. I wish your post has come earlier. You explained very well. Better than the codex had.
Thank you for these very clearn and timesaving instructions.
Great write up. Thanks.
[…] heming Those of you who are WordPress users might be interested in Secrets of WP Theming: Part 1 and article by Chris J. Davis. […]
I dont use Wordpress but non-the-less a really great post.
Secrets of WP Theming: Part 1
Chris J. Davis, of chrisjdavis.org, has recently put together his first article in a series of Secrets of Theming for WordPress articles.
I’ve decided to make this the first 9rules Network featured article since WordPress development is so near and…
[…] chten. Je nach Template kann man eine Odyssee erleben, bevor man im gelobten Land ankommt. Nine Rules will die Odysse ein wenig erleichtern. Na dann. Mal sehen, wie we […]
What a read, this is going to help me alot on my next wordpress theme! haha, thanks Chris!
[…] ins of the word “Geek” Secrets of WP Theming: Part 1 Pretty Pink Ponies Edition… » Secrets of WP Theming: Part 1 This is a pre […]
[…] gs: via:b3ta mspaint paint computer art deviantart cool design drawing windows pixel) Secrets of WP Theming I’m moving this site to Wordpress soon so this s […]
I had a little trouble following the example, and a simple clarification might be in order. My starting page was my original archives.php page, and the template name contained in the file is simply “Archives” The original page was still there, and the FIRST instance of the template named “Archives” was selected on on the write-page screen. The second one, in a file renamed new_archives.php, was ignored.
In the example, the name change is evidently from “Archives” to “Archives template ” which I didn’t recognize as a change.
All fixed now, but certainly wouldn’t be without the article, for which MANY THANKS!
Regards..
sg
Hi Mamnon misham Aghe ye sari be weblog man bezanid
[…] to an Artist 6 views Links and Power: The Political Economy of Linking on the Web 5 views Pretty Pink Ponies Edition… » Secrets of WP Theming: Part 1 5 views Po […]
[…] ess Theme WordPress Templates and the is functions Secrets of WordPress Themeing Secrets of WordPress Themeing […]
[…] Webmail| | Login| June 10, 2005 Pretty Pink Ponies Edition… » Secrets of WP Theming: Part 1 Filed unde […]
[…] ★ Latest 5 Posts CJD Notepad in BetaAlmost go timeSecrets of WP Theming: Part 2Secrets of WP Theming: Part 1The Proper use of Base HREF’s ❤ Highes […]
[…] =”0 comments on this post.”> { 0 comments } Wordpress theming » Secrets of WP Theming: Part 1 […]
[…] Chris J Davis’s Sillyness Spelled Wrong Intentionally - Secrets of a WordPress Th […]
[…] th Elvgren and Taft, by the way. To see Chris’s posts, visit the following links: Secrets of WP Theming - Part 1 Secrets of WP Theming - Part 2 Secrets of WP […]
[…] Holy Shit This dude rocks… Chris J. Davis Themes Tutorial 1 Chris J. Davis Themes Tutorial 2 Chris J. Davis Themes Tutorial 3 […]
[…] Part 1, Part 2, and Part 3. [ via ] Leave a Comment […]
[…] I have been enlightened a little thanks to Chris J Davis in his Secrets of WP Theming Part 1, 2, &3. […]
[…] Resource: Secrets of WP Theming Part 1 | Secrets of WP Theming Part 2 | Secrets of WP Theming Part 3 […]
If the file created resides in the themes/ourtheme/ folder as a Page Template it doesn’t really need the
require('./wp-blog-header.php');line at the top…[…] This more for my own memory more than anything that most sane folks would be interested in. As this blog is in dire need of a style overhaul, this excellent WordPress Theming Tutorial, Parts [1] [2] [3], should come in handy. […]
Hey Ron,
Apparently Shawn changed the function call when he released his update. I will make that change in the tutorial.
Hey Ron,
That is great to hear that you were able to sort things out. I apologize that I wasn’t able to respond faster to your questions though.
That is a very good point about Kubrick, I will take that into consideration. And I am overjoyed that you are able to find these little diddies helpful. I love what I do, and it makes it that much better when someone is helped by it.
Hi Chris,
I figured out the alignment issue involving Kubrick default. I had inserted the following thinking it would work;
But, It should be removed and replaced with;
What was vexing me so much - besides the fact I’m still novice in areas - is that Kubrick has widecolumns, and narrowcolumns etc.,etc..
Anyway, the intial
came from the suggested starting CSS over at Shawn’s site. I respectfully submit the suggestion of adding this little tidbit about Kubrick/Clean Archives installation into your already Most Excellent tutorial. It would help any future noobs like me, who haven’t complete mastery yet.Again, I would like to compliment your tutorials. Your writing and content presentation style are great!
Thank you,
Ron
I figured out what I did wrong. In your example above the function call says srg_nice, and it should be srg_clean. i didn’t know to change this - but, thats what I get for installing plug-ins and hacks at 3am.You might want to point this out to complete idiots like me.
Thanks Ron
Ok, now teach me why my div examples didn’t showup in the post???!!
Making WordPress 1.5.x themes
Weblog Tools Collections has a couple of nice links on how to create WordPress 1.5 themes:
1.5 theme cheat-sheet on Tech Wench
Secrets of WP Theming: Part 1, Secrets of WP Theming: Part 2, and Secrets of WP Theming: Part 3 on Sillyness Spelled Wro…
Hi chris,
I wondering if you could help me position eveything correctly. I’m using the Kubrick Default, and the month/year are hanging off the left side. I have looked at your CSS, as well as Shawns. You have yours positioned in a div called content, right? Do I need to create this in my CSS, I only have a div called main.
www.ronpemberton.com/archives/
Any help would be appreciated. Thanks Ron
thank’s alot for knowledge! learn more about wp theme!
First I would like to thank for your work. It is greatly appreciated by me. I followed your well written instructions and had no problem understanding anything - but, I now get just the top half of my page and the following error message across the bottom of my screen;
Fatal error: Call to undefined function: srg_nice_archives() in /home/ronpembe/public_html/wp-content/themes/default/clean_archives.php on line 29
What exactly did I do wrong? Everything looks exactly as in your tutorial.
[…] Secrets of Theming for WordPress […]
[…] Secrets of WP Theming: Part 1 […]
[…] WP Themers: 1.5 theme cheat-sheet A step by step, line by line of code on how to recreate a theme or build it from scratch. Also, consider reading Jesuit’s Secrets of WP Theming. (Visited 1 times) […]
[…] Chris Davis […]
[…] Once arrived at home I finally got around to reading some introductory stuff about PHP and the template system of WordPress. Thanks in part to the series called Secrets of WP Theming on the recently discovered weblog of Chris J Davis. […]
[…] Chris Davis has taken it upon himself to help out all of the Wordpress users out there by writing a series of tips that explain the secrets of using Themes in Wordpress. In his first topic, he covered the power of using Pages in Wordpress to display content that doesn’t necessarily require posts or categories. This was an extremely useful article, and I recommend it to anyone wanting to unleash the power of Wordpress. […]
[…] Acknowledgments: this post drew heavily on Secrets of WP Theming Part 1. […]
[…] Secrets of WP Theming Pt 1 […]
Have you ever noticed that WP sometimes has features in the Admin that go missing? well, here i was, completly woking on this awesome tutorial ( thank you! ) and now I seem to be missing the option to select a template. oddness.
ok,.. so either i didnt have things config’d correctly with my custom template - thus causing it not to give me the option to select one,.. or WP was just having a moment. Either way i have it working. :)
[…] Secrets of WP Theming […]
wow this is awesome tutorials I’ve really learned a lot from you Chris, thanks so much I really do apprecaite it…
[…] After having seen Chris J Davis’ guides to Wordpress theming, I thought that having found a cool little gubbin I ought to share it too. […]
hello chris thank you so much for your awesome tutorials
but I have a question… I created a new theme or index.php and I put it outside the wordpress and it works fine but I want to remove the sidebar I just don’t know how to do it…
maybe you could help me on this…
thank you so much
heres the link my blog www.kissofheaven.com/blog
heres the index.php that I want to remove the sidebar www.kissofheaven.com/index.php
appreciate your help….
[…] […]
Thanks Chris - I’m totally new to this game and have learnt a lot from this post of yours!!!
[…] Even though I’m yet to fully dive into this whole theming process, knowing how the WordPress templates work is something I’ve wanted to learn for quite some time. The Codex however doesn’t provide with the more easily understandable documents regarding this point, so I was thrilled when I finally found Secrets of WP Theming: Part 1 (followed closely by Secrets of WP Theming: Part 2 and Secrets of WP Theming: Part 3) on Sillyness Spelled Wrong Intentionally. […]
Secrets of WP Theming
Here’s a great multi-part series on WordPress theme creation Pretty Pink Ponies Edition… » Secrets of WP Theming: Part 1
Part 1: Using custom templates to add pages to WP that don’t necessarily call for posts or categories, etc.
Part 2: Creati…
Very good tutorial, been trying to figure this out for weeks now. Thanks!
Great tutorial, I’m looking forward to the next installment! My Wordpress install is in dire need of sprucing up and this tutorial will sure help.
A very nice tutorial. I had an old Kubrick with a ton of mods & am now trying to get it up on K2. It’s a bit complicated, but your instructions helped me to understand Michael a bit. ;-)
Gaia
[…] First and foremost, none of this would be possible without the ever flexible, super simplified publishing tool that is WordPress. Well, it might be possible on other platforms, but it sure as hell wouldn’t have been as easy. I’ve used Moveable Type for a couple projects and I can honestly say their template system is a total nightmare that I wouldn’t wish upon anyone. The template system introduced in WordPress 1.5 is the best thing since sliced bread. I won’t go into detail on the various templates as there are already several good resources on that topic - the WordPress Codex is a fine point of reference, but Chris J Davis does a great job of breaking it down in language anyone can understand. I will mention one template that a lot of people don’t seem to know about. That being the home page template - home.php. […]
[…] Chris J Davis wrote about the secrets of Wordpress theming. He divided it into three sections. Part 1 is about the custom templates which you can use to make your own static pages on Wordpress, like the archive page. Part 2 covers the *per category template*. Part 3 is about the use of home.php which after he pointed it out I feel it can be a powerful tools. In his example page, it can be used as a summary page (or the cool words *rss aggregation*) of your page which will be loaded before the index.php. Actually you can find all this piece of info at the codex but I think Chris has put it all together nicely. Now that he share it with us means this is not secrets anymore, right? :) # […]
Is there any chance this technique requires users to engage the Permalink feature in WP? I followed the tutorial verbatim, but may be missing some little step, as I don’t seem to be able to display the archives. Not real sure what URL to point the browser to for displaying the page…
Sorry for the stupid question…
Thanks,
Chris
[…] ChrisJDavis: Secrets of WP Theming […]
[…] Secrets of WP Theming Part 1 | Part 2 | Part 3. […]
[…] Chris J Davis’s Sillyness Spelled Wrong Intentionally - Secrets of a WordPress Theme […]
[…] Chris J Davis’s Sillyness Spelled Wrong Intentionally - Secrets of a WordPress Theme […]
[…] This amazing author of such awesome articles for WordPress users like Secrets of WordPress Theming and Podcasting With WordPress, among many others. […]
[…] For an amazing examination of building a WordPress Theme, dissecting every detail of the modular PHP building blocks and code that goes into a full, do-it-yourself WordPress Theme, check out the The Secrets of WordPress Theming by Chris J Davis from Sillyness Spelled Wrong Intentionally. […]
[…] Secrets of WordPress Themeing […]
[…] While I’m google around for WordPress plugins, I accidently found this article by Chris J. Davis. and worth reading it. Believe me, it’s easy to understand. […]
Thank you for sharing your knowledge with us. Brilliant!
[…] 10) 현재 Update되
Chris you are a genius!
thanks! mwah mwah mwah!
Really really thank you!
Do you hold a especial class?
I want to attend..:=)
XOXO :=)
[…] WP Themers: 1.5 theme cheat-sheet A step by step, line by line of code on how to recreate a theme or build it from scratch. Also, consider reading Jesuit’s Secrets of WP Theming. […]
[…] WP Themers: 1.5 theme cheat-sheet A step by step, line by line of code on how to recreate a theme or build it from scratch. Also, consider reading Jesuit’s Secrets of WP Theming. […]
[…] Links: Secrets of WP Theming: Part 1 Secrets of WP Theming: Part 2 Secrets of WP Theming: Part 3 […]
[…] Chris Davis has created an easy to read tutorial, in 3 parts, called Secrets of Wordpress Theming. It’s in 3 parts, which are: […]
[…] Secrets of WP Theming: Part 1 Secrets of WP Theming: Part 2 Secrets of WP Theming: Part 3 […]
[…] Secrets of WP Theming - part 1 Secrets of WP Theming - part 2 Secrets of WP Theming - part 3 […]
[…] I came across an article by Chris J. Davis called Sectets of WP Theming: Part 1 which described how to add an archive page to a blog powered by WordPress. I used a plug-in for archives called Clean Archives 2.0 from sporadicnonsense.com. […]
[…] The sights our eyes behold, Will open up our merging hearts, And feed our empty souls. » Secrets of WP Theming: Part 1 (tags: wordpress) […]
[…] Wordpress temaları hakkında ne zaman araştırma yaparsam, ya firefox favori linklerim uçuyor, yasa sakladığım dosyaların yerini unutuyoru. Bunun için bir başlık altında linkleri toplamaya karar verdim. HTML ve CSS ileri düzey bilgi sahibi olduğumuzu varsayarak yola çıkalım: UrbanGiraffe
…Blog Design 101: Creating Your Own WordPress Theme Secrets of WP Theming …
Blog Design 101: Creating Your Own WordPress Theme from cre8d design
Secrets of WP Theming from Chris J. Davis…
…com/blog/2006/01/27/blog-design-101-creating-your-own-wordpress-theme/”>Creating your own theme
Secrets of WP theming
Dissection of a theme
…
Thanks Chris, very thorough. I’ve followed through this and just wondered whether there are any differences now that Wordpress 2.5 is with us?
I am not sure how this will work with WP 2.5.
Chris man let me say I have been reading tutorials for years and let me say you have a gift for writing tutorials. I am always looking for theming tutorials cuz it is m=one of my biggest weak points and I hve ot say I love this tutorial. Bless you for taking the time and teaching us none theming folk how it is done.
Thank you so much!
Vic
…sign-101-creating-your-own-wordpress-theme/”>Blog Design 101: Creating Your Own WordPress Theme
Secrets of WP Theming - Part 1
How t…
…com/blog/2006/01/27/blog-design-101-creating-your-own-wordpress-theme/”>Creating your own theme
Secrets of WP theming
Dissection of a theme
…
Hello Chris!
Thank you for making these tutorials about how to code WordPress themes. There are many free WordPress themes on the Internet but it’s always very helpful to be able to edit and make small adjustments to the themes, to make them more personalized. I am kind of a beginner with WordPress editing, as I’ve been using one of the default themes for over two years. Now I am hacking and slicing a few things apart, it’s a good thing that I always make backups because most of the time I don’t get the desired effect. He he
Thank you for this tutorial in helping me understand the basics on WordPress themes.
I am attempting my first theme at the moment, I don’t usually comment however I have to thank you for the clearest explanation I’ve come across thus far. You are a life saver!
Chris,
Great write up.. I was looking for a way to implement my own template/pages into WP. I’ve been meaning to build my own template for a while now, this was just the motivation I needed.
Fabulous indeed! We are looking to have our own theme created based off of our current site design. I’m gonna forward this to my webmaster to see if he can pull his strings to get this done quicker for us. Thanks alot Chris!
Fantastic, Chris. Thanks for taking the time to outline this!
…te
Free Blank WordPress Themes
Secerts Of WordPress Theming - Part 1
Secerts Of WordPress Theming…
…sign-101-creating-your-own-wordpress-theme/">Blog Design 101: Creating Your Own WordPress Theme
Secrets of WP Theming - Part 1
How t…
media/Flickr
media/LastFM
old/Archives
Sillyness, Werd by Chris J. Davis is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 United States License, unless otherwise noted.
Based on a work at chrisjdavis.org.