WordPress Themes

   WordPress Themes

This page contains info about using Themes to change the look and feel of a WordPress website.

See also the Best WordPress Themes page.

About WordPress Themes
WordPress Themes are made up of a series of PHP Templates.
 * wpdesigner.com — excellent and in-depth themes tutorial.
 * bothack.wordpress.com — quick overview.
 * Templates IS Functions — useful functions to display date, etc.

WordPress and YUI

 * YUI-Mainstream 750 — 750px wide YUI grids theme.

WP-PagesNav

 * WP-PagesNav — creates page list with unique css classes. Nice, but dumps the sub-pages at the bottom of the list and not embedded as it should be.

STS Dropdown
display pages: display links: display categories: display archives: display all:
 * STS Dropdown — creates a dropdown menu for static pages and subpages, links, categories and archive.

CSS Drop-down Menu

 * Suckerfish Plugin — Ryan Hellyer's CSS dropdown plugin. Just seems to work. To use, just install the plugin and add the following code to your theme's header.php (see Suckerfish Demo to see the menus in action):
 * — Home Page button plus Pages, Archives, Categories and Blogroll dropdowns.
 * — Pages only menu (sub-pages dropdowns).
 * — Home Page button added to the Pages only menu (not needed for static home page).
 * — Pages, Archives, Categories and Blogroll dropdowns.
 * — first level Pages (with sub-pages dropdowns), followed by Archives and Categories dropdowns.
 * — first level Pages (with sub-pages dropdowns), followed by Archives and Categories dropdowns plus Home page button.


 * See also Displaying WordPress categories in a horizontal dropdown menu.
 * See also dynamicdrive.com Drop Tab menu — nice single level dropdown javascript / css menu.

Also rans

 * invokemedia.com Tutorial — CSS dropdwon menu for WordPress tutorial with code.
 * WordPress Page Link Manager — plugin to allow you to include/exclude pages from the site's menu.
 * jillij.com — CSS dropdown theme. Moves the sidebar functions into the header.
 * projectseven.com — css dropdown.
 * buzzdroid.com YUI Theme — very nice free YUI theme, but advanced features cost extra.
 * guihackrz.com — WordPress theme based on YUI. Bit shakey round the edges.

WordPress K2 Advanced Template

 * Advanced template for the Wordpress blogging engine.
 * http://getk2.com
 * Features:
 * Semantic XHTML, CSS and JS structure.
 * Supports custom CSS files, the so-called 'styles'.
 * Smart layout adapts to needs.
 * Fully configureable from options page.
 * Upload and manage custom headers.
 * Sidebar Modules comes bundled (with special K2 modules) and support WordPress Widgets.
 * Live comment posting.
 * Livesearch.
 * Rolling Archives.
 * Dozens of plugins supported out-of-the-box.
 * Fam fam fam icons
 * See also code.google.com/p/kaytwo/wiki/WhatisK2 overview article.

Required Template Files
Every theme has at least two files: The file  also contains the HTML layout for the page and the WP Loop function.
 * — controls the look of the site.
 * — controls all the other files.

Optional Template Files
You can also breakdown the HTML layout into separate template files:
 * — header info
 * 


 * — footer info
 * 


 * — sidebar info
 * 


 * — search box
 * 

See codex.wordpress.org Stepping into Templates
 * — calls for your blog's entries. This can also be done in index.php
 * — generate comments

Optional Sub-Template Files
You can also have separate template files for various auto-generated pages:
 * — display archive page using the code:
 * 
 * — display category page
 * — display search results
 * — single post view to display single post
 * — multi-post view to display posts summary list
 * — customise look of pages.
 * 
 * — customise look of comments.

Typical Template Files
See codex.wordpress.org Template Hierarchy

Primary Template Variables

 * the loop

  
 * blog title
 * blog description
 * blog url

  
 * post title
 * post link
 * post content

 <?php the_category(', ') ?> <?php _e('by'); ?> <?php the_author; ?>
 * insert text Filed under:
 * post category
 * insert text by
 * post author

<?php comments_popup_link('No Comments &#187;', '1 Comment &#187;', '% Comments &#187;'); ?> <?php edit_post_link('Edit', ' &#124; ', ''); ?>
 * insert comments popup
 * insert edit link (only visible to logged in Admin user)

<?php the_ID; ?> <?php posts_nav_link; ?> <?php posts_nav_link('in between','before','after'); ?>
 * id number for each post
 * posts previous next navigation links

<?php bloginfo('stylesheet_directory'); ?>
 * insert theme relative url

Sidebar Template Variables

 * display pages li list


 * display categories li list


 * display archives li list

<?php get_links_list; ?>
 * links li list


 * search form — must have  defined first.


 * calendar


 * meta for login/logout, register and admin

Sidebar Widget Variables
You must first enable widgets in

Theme Screenshot
To add a screenshot to your theme:
 * 1) Create screenshot image 300x225 px.
 * 2) Save it as   (PNG file).
 * 3) Place your image file in the theme’s folder.