Senin, 23 Maret 2009

link title value

This lesson covers three extra options that you can add to each post. Else, post ID, and link title value. Although they’re optional, you can find all three of them within every one of my free themes because you never know what people will use your themes for.

First, don’t forget to start Xampp Control.

Step 1:
Type the following codes under .



Like this: (Notice the indents or tabs for organization.)

else.gif

Save it, but you won’t notice any difference. We have to go back to lesson #5, The Loop, to explain what you just typed above.

Here is The Loop:

First, if(have_posts()) checks to see if you have any post on your blog. Second, while(have_posts()) executes the_post() to call for your posts. The Else is what to do when you don’t have any post at all. Imagine while() and endwhile; nesting between if() and else :. That’s why has to come after .

Now that you know what else is, what did you tell WordPress to do when you don’t have any post or when it can’t find any post? You told WordPress to display the error message Not Found. That message can be anything you want. You can download one of my themes. Take a look at its index.php file for an example.

In the example above, the Not Found message sits inside . Like I told you yesterday, that’s not necessary.

The whole message and code of Not Found is surrounded by the

and

tags. That’s also not necessary. You can simply use:


Not Found

But, using the

(sub-heading) tag for the error message makes it more obvious to your visitor that there’s nothing on that page.

What are the

and
for? Well, you don’t want your error message to get stranded in the middle of nowhere right? You wrapped each entry within the
and
tags. So same thing, although the error message isn’t actual content, it is text just like the entries.

Step 2:
Add id=”post-” to

post-id.gif

Save your notepad and refresh your browser. Now go to View > Page Source or Source. You’ll see that each post, now, has a number or post ID attached to it. the_ID() simply calls for the id of each post; that’s it.

Why use it? It’s for customizing the look of posts, individually. Later on, when you use the style.css file to tell your theme how the posts will look like, every post will look the same. With a unique ID attached to each post, you can target a single post and make it look different from the rest of the posts. Without the IDs, you have no way of differentiating the posts within the style.css file.

How can you assign both class and id to the same DIV or invisible box? DIV is a tag, class is an attribute. id is an attribute. Each tag can have multiple attributes just like each DIV can have both class and id. (Note: id is an xhtml attribute. the_ID() is a PHP function. They’re different.)

Step 3:
Add title=”” to the post title link.

the-title1.gif

The screen-shot above is a partial screen-shot to point out where you should place the code. Save it and refresh your browser. Go to view source again. While viewing its source, look for any post title link. If the post title link is Hello World, then to the left of it should be title=”Hello World”.

title=”" is another xhtml attribute for the (link) tag. Whatever’s within the quotes is the description of your link. In this case, the title of each post is also the link description. That’s why you used the PHP function the_title() again.

If you don’t use the_title() as a value for title=”", then every post title link will have the same description. For example, instead of the_title(), you use title=”Click me”, every post title link will have Click me as its description.

Now, go back to your web page. Place the cursor over a post title link, a description will pop up. That’s what you just added. Adding descriptions to your links is also useful when other sites have to scan your blog. Technorati.com for example, each time you publish, WordPress notify Technorati and other sites that your blog has been updated. Technorati then comes to your blog, scans it, and indexes a summary of your post, which includes the link title description.

Tomorrow’s lesson will cover the Next and Previous page links.

Follow this WordPress Theme Tutorial Series from the beginning.

Tidak ada komentar:

Posting Komentar