Stepping Into Template Tags
wordpress.org.cn
If you take a peek into the ttheader.php/tt template file that came with your WordPress Theme, you will notice that where it says My Blog Name, whatever it is, when you view your WordPress site, it doesn't say My Blog Name in the template file. In fact, it has a bunch of strange arrows and parentheses and words that don't make much sense.
This is an example of a Template Tag.
Let's take a few steps toward learning more about what these are and how they work.
目录 |
What is a Template Tag
A template tag is code that instructs WordPress to do or get something. In the case of the ttheader.php/tt template tag for your WordPress site's name, it looks like this:
preh1?php bloginfo('name'); ?/h1/pre
The template tag is tt?php bloginfo(); ?/tt wrapped in an H1 heading tag. The bloginfo() tag gets information from your User Profile and Options General in the Administration Panels. In the example here, the word ttname/tt inside of the quote marks in the tag instructs the tag to get the blog's site name. This is called a parameter.
Template Tag Parameters
In addition to the name parameter in the tt?php bloginfo(); ?/tt template tag, there is other information that can be displayed. Let's look at a few of these parameters - and you can find more information and examples on the ttbloginfo()/tt Codex page.
- name code?php bloginfo('name'); ?/code
- As mentioned, this displays the name of the site and is set by the administrator in the Options General SubPanel by default.
- description code?php bloginfo('description'); ?/code
- This is called the Tagline for your blog which is usually some kind of descriptive sentence that says My blog is about..... It is set by the administrator in the Options General SubPanel.
- url code?php bloginfo('url'); ?/code
- When you want to display the URL or website address for your WordPress site, you can use URL and it will show up. This also comes from the Options General SubPanel.
- admin_email code?php bloginfo('admin_email'); ?/code
- If you want to display the email of the administrator, you don't have to type it into the template files. By doing so, it may be open to email harvesters who use sophisticated software to come in and grab email addresses to use for spam. By using ttbloginfo('admin_email')/tt, the email is displayed on the page for the viewers, but the actual email address is disguised from the harvesters. Nice, huh? The administrator's email address is set in the Options General SubPanel.
- version code?php bloginfo('version'); ?/code
- Sometimes you'd like to show off which version of WordPress you are using. The Themes that come with WordPress by default include this information in the footer template. It simply displays the version of WordPress your blog uses.
To show the WordPress version, the template tag would look like this:
prepPowered by WordPress version ?php bloginfo('version'); ?/p/pre
div style=border:1px solid blue; width:50%; margin: 10px; padding:20pxPowered By WordPress version 3.0/div
Notice that only the version number is generated by the version parameter, not the words Powered by WordPress version. Those were written in before the tag so they would be visible on the web page.
To learn more about template tag parameters, see Anatomy of a Template Tag and How to Pass Tag Parameters.
How Do You Use Template Tags?
Going through the various template tags in the Template Tags menu on the Codex, you will see that many of them are very simple, like the ttbloginfo()/tt template tag, but many look very complicated to use. Let's look at some examples of how they are used to help you understand the language of the template tag codes.
As we saw in the ttbloginfo()/tt template tag, all it took was one word to change the output of the tag. This word is called a parameter and it instructs the template tag to do or get something. In this case, the instruction is to get name which displays the site's name.
The template tag ttthe_title()/tt displays the title of the post, usually at the top of your post article. This tag gets the post title and displays it, by default, but it also has a do in the parameters which will help you change the look and presentation of the post title.
By default, the tag looks like this:
pre?php the_title(); ?/pre
And the results look something like this:
div style=border:1px solid blue; width:70%; margin: 10px; padding:20px; font-size: 120%; color: navyUsing WordPress Makes Me Smile/div
Let's say you want to put some kind of reference that highlights the title in some way, like a graphic or character entity like an arrow or bullet. Let's put a yen sign, yen; ,the sign for Japanese money, in front of our title.
If you look carefully at the instructions for the tag ttthe_title()/tt, you will see that the parameters are:
pre?php the_title('before', 'after', display); ? /pre
We want the yen sign to be before the title, with a space after the yen sign and before the title, so let's add it to the parameters:
pre?php the_title('amp;yen; '); ? /pre
Which, when the page is generated, would look like this:
div style=border:1px solid blue; width:70%; margin:10px; padding:20px; font-size: 120%; color: navyyen; Using WordPress Makes Me Smile/div
Now, let's take this a little further and put something after the post title. Let's say you want to encourage people to read so we'll add a little incentive arrow ( raquo; ) to motivate them.
pre?php the_title('amp;yen; ', ' amp;raquo;'); ? /pre
Notice, we added another space before the arrow to separate it from the post title when the page is generated for viewing.
div style=border:1px solid blue; width:70%; margin:10x; padding:20px; font-size: 120%; color: navyyen; Using WordPress Makes Me Smile raquo;/div
You can also style your title heading in many different ways. Here is another example using heading tags.
preh2?php the_title('Post Title: '); ?/h2 /pre
We've put the entire post title into an H2 heading and added the phrase Post Title to the beginning of the post title.
div style=border:1px solid blue; width:70%; margin:10px; padding:20px; font-size: 130%; font-weight:bold; color: navyPost Title: Using WordPress Makes Me Smile/div
Note: Not all template tags take before and after arguments, though the_title does. Check the codex page for the specific tag you're using to see what arguments it accepts.
Boolean Template Tags
The above template tag example uses simple parameters separated from each other with quote marks and commas. Now consider examples of Boolean Template Tags that connect more than one parameter together using boolean math techniques. One common boolean expression uses the and () logic to connect the parameters.
The template tag wp_list_cats() is commonly found in the WordPress sidebar or menu template file. It lists the site's Categories.
pre?php wp_list_cats(); ?/pre
By default, some of the template tags' parameters are:
- all - Displays all of the Categories
- sort_column - Sorts by Category ID
- sort_order - Sorts in ascending order
- list - Sets the Categories in an unordered list (ttlt;ulgt;lt;ligt;/tt)
- optioncount - Does not display the count of posts within each Category
- hide_empty - Based upon the first two parameters (optionall and all), does not display Categories without posts
- use_desc_for_title - Uses the Category description as the link title
- children - Shows the children (sub-Categories) of every Category listed
An example of this category list might be:
div style=border:1px solid blue; width:70%; margin:10px; padding:20px; font-size: 110%; font-weight:bold; color: navy
- Stories About My Life
- Stories About My Family
- Things I Want To Share
- About WordPress
- About Writing
- About Story Telling
- Facts and Fiction About Life/div
The indented list with About WordPress, About Writing, and About Story Telling are the children or sub-Categories of the parent Category Things I Want To Share. These titles, by default, are not the actual titles of the Categories, they are the descriptions of the Category you set in the Administration Manage Categories panel.
If you would like to show the actual title of the Category, instead of the Category description, change the template tag to:
pre?php wp_list_cats('use_desc_for_title=0'); ?/pre
The zero sets the parameter to false, turning off the use of the description as the title. Now the Category titles would appear:
div style=border:1px solid blue; width:70%; margin:10px; padding:20px; font-size: 110%; font-weight:bold; color: navy
- My Life Stories
- My Family
- Sharing
- WordPress
- Writing
- Story Telling
- Facts and Fiction/div
Let's say that you don't want the sub-Categories for Sharing to appear on your list. You would then add the parameter to not show the children, along with the parameter for showing only titles and not descriptions, with the boolean and using the ampersand ( ttamp;/tt ).
pre?php wp_list_cats('use_desc_for_title=0children=0'); ?/pre
Notice there are no spaces around the ampersand. All the parameters run together without any spaces or quote marks in between, just around the whole parameter. Now the Category titles would appear as:
div style=border:1px solid blue; width:70%; margin:10px; padding:20px; font-size: 110%; font-weight:bold; color: navy
- My Life Stories
- My Family
- Sharing
- Facts and Fiction/div
As another example, if you want to display the Category links as the Category title, sort the list alphabetically by name, show the number of posts within each Category, and only show the children (sub-Categories) of Category ID number 3 (Sharing), the template tag would look like this:
pre?php wp_list_cats('sort_column=namesort_order=ascoptioncount=1use_desc_for_title=0child_of=3'); ?/pre
div style=border:1px solid blue; width:70%; margin:10px; padding:20px; font-size: 110%; font-weight:bold; color: navy
- Story Telling (21)
- WordPress (23)
- Writing (10)/div
Template Tags and The Loop
Many of WordPress' template tags work within the WordPress Loop. This means that they are included in the template files as part of the php loop that generates the pages the viewer sees based upon the instructions inside of the Loop.
The WordPress Loop begins with:
pre?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?/pre
Template tags that work within the loop must be in the middle area here, before the ending section of the Loop below:
pre?php endwhile; else: ? p?php _e('Sorry, no posts matched your criteria.'); ?/p ?php endif; ?/pre
Template tags that need to be inside of the loop include ttthe_content()/tt, ttthe_excerpt(), next_post(), and previous_post()/tt. If the template tag you want to use doesn't have to be within the Loop, like ttwp_list_cats()/tt and ttwp_list_pages()/tt, then you can put it anywhere you like, for instance in the sidebar, header, or footer template files.
Learning More About Template Tags
This is just a tiny step into learning about the various powerful template tags WordPress uses to generate your website. You can learn more about the different template tags WordPress uses in the following articles and resources.
- WordPress Template Tags Catalog
- Templates
- Stepping Into Template Tags
- Anatomy of a Template Tag
- How to Pass Tag Parameters
- The Loop
- Include Tags
- Conditional Tags
Styling Your Template Tags
- Styling Lists with CSS
- Lessons: Next and Previous Links
- Lessons: Separating Categories
- Lessons: Styling Page-Links
- Lessons: Good Navigation Links
- Formatting Date and Time
