Archive for April, 2006

Title Attributes for WordPress Post Navigation

Posted on April 23, 2006 in Accessibility, WordPress by Jeff Starr

Improve accessibility by adding title attributes to your WordPress userspace.

Note: This article applies specifically to WordPress 2.0.2, but may be generalized to any WP 2.0+ version.

By default, WordPress navigation links omit the title attributes for both page and post views. Title attributes for links provide additional information that can improve the accessibility of your website. This is especially true when images or text symbols exclusively are used for navigation.

To add title attributes to WordPress page-view links (e.g., links for index, archive, and category views), open the file wp-includes/template-functions-links.php and find the functions previous_posts_link (line #494) and next_posts_link (line #459).

Within each function, replace the following line:

echo '">'. preg_replace('/&([^#])(?![a-z]{1,8};)/', '&#038;$1', $label) .'</a>';

..with this:

echo '" title="EDIT THIS">'. preg_replace('/&([^#])(?![a-z]{1,8};)/', '&#038;$1', $label) .'</a>';

Next, replace the EDIT THIS text in each function with “Previous Posts” and “Next Posts”. Keep in mind the reverse chronological order by which these links navigate. Remember to check a few page views and then you are done.

Now, to add the title attribute to navigation links within individual post views. Open the same file as above, wp-includes/template-functions-links.php and find the functions previous_post (line #336) and next_post (line #357).

Within each function, replace the following line:

$string = '<a href="'.get_permalink($post->ID).'">'.$next;

..with this:

$string = '<a href="'.get_permalink($post->ID).'" title="EDIT THIS">'.$next;

Next, replace the EDIT THIS text in each function with “Previous Post” and “Next Post” respectively. Remember to check a few post views and then you are done.

Upgrading Tag Functionality

Posted on April 18, 2006 in WordPress by Jeff Starr

Before today, the extent of my concern with tags involved local post tags via UTW and meta keywords via Autometa. Wanting to dive deeper into tagging, I added metadata Technorati tag links as icons appearing after each local tag link, generally located within post meta information. Adding the icon links is easy. Go to the UTW Options panel and in the “Global Formatting Settings” section, select the Technorati Tag. Then simply add the following (or something similar 1) to your index.php WP loop:

<?php UTW_ShowTagsForCurrentPost("iconlist") ?>

More display options include:

<?php UTW_ShowTagsForCurrentPost("commalist") ?>
<?php UTW_ShowTagsForCurrentPost("technoraticommalist") ?>
<?php UTW_ShowRelatedTagsForCurrentTagSet("commalist") ?>

References

Permalink Enlightenment

Posted on April 10, 2006 in Websites, WordPress by Jeff Starr

I recently enabled the permalinks feature for a fresh WordPress 2.0.2 upgrade. The process required several hours of research and approximately 90 minutes to fully implement. This brief article summarizes the process and applies to at least the following setup:

  1. WordPress 2.0.2
  2. Apache Server with mod_rewrite enabled
  3. The ability to access/modify your .htaccess file(s)
  4. You have decided to use the /%year%/%monthnum%/%day%/%postname%/ permalink format (actually, any format will work; simply swap your preferred format for the one mentioned here)
  5. You may also be using any of the plugins listed in the dungeon (actually, most plugins are compatible — only a few cause problems)

Permalinks are important for several reasons: search engines love them, people can understand them, and links (theoretically) become permanent because of them. Plus, all of the cool kids are using them, so you should too. They really add the finishing touches to your site and provide a sense of unity and sophistication that the “http://ugly-domain.com/blog/index.php?page_id=66” format just can’t match.

Before you begin any changes it is highly recommended to backup everything: WordPress files, database(s), notes, edited files, image files, htaccess file(s), etcetera. Just a friendly reminder.

Then, if you are seriously considering jumping into permalinks, do some research. Search Google, Ask, WordPress, and dig through a few blogs for terms such as “WordPress permalinks”, “permalink tips”, “permalink guide”, etc. As you learn, copy and paste any important notes, code, or links that seem important and may be useful later on. You may also wish to anticipate certain scenarios by searching for “permalink nightmare” or “permalink success”, for example.

Now that you have studied the process, you realize that certain conditions produce errors or other problems. For example, if you are planning on using the %postname% in your permalinks, very long post titles may cause problems in emails, posts, and chats. Although such an issue may be fixed after the fact, it is wise to scan through your posts and edit the post slug of any posts with excessively long titles. Regardless of the post title name, it is the post slug that is used when implementing the %postname% in permalinks. If possible, I recommend manually checking every post title and slug and editing (if needed) with permalinks %postname% in mind. Don’t forget to check your pages as well.

Now for the fun stuff. Well, almost. WordPress 2.0.2 has a problem writing to .htaccess files even when their CHMOD is set to 666 or 777. To fix this, open wp-includes/vars.php and replace the following line of code:

$is_apache = ( strstr($_SERVER['SERVER_SOFTWARE'], 'Apache') || strstr($_SERVER['SERVER_SOFTWARE'], 'LiteSpeed') ) ? 1 : 0;

..with this one:

$is_apache = 1;

This is a change that should be needed only during the establishment of permalinks. After you have permalinks flying high, you should revert the previous replacement and restore order to the galaxy.

Now create your htaccess file(s). Open a text editor and save a blank document as “htaccess” in the root of your site. Then rename it to “.htaccess” (i.e., put a dot before the name). Upload this file and change its CHMOD setting to 666. Again, this change should only endure until permalinks are functioning. So remember to change it back to its default setting (typically 644).

Okay, get ready to party. First restart your computer (for good measure). Then, open your WordPress Admin and navigate to the Permalinks submenu (under Options). Read everything carefully and then select the “Date and name based” option under the “Common options” menu. Make sure that WordPress automatically added /%year%/%monthnum%/%day%/%postname%/ (or that of your preferred format) to the “Custom structure” field. Now click the “Update Permalink Structure” button and wait for the “success” message to appear. At this point, permalinks should work throughout your WordPress-powered website.

Almost done. Check everything. First download your htaccess file and check that WordPress automatically added the htaccess directives required to create permalinks:

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /press/
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /press/index.php [L]
</IfModule>
# END WordPress

If you don’t see it, then copy and paste it into your htaccess file manually. If your htaccess file is blank, permalinks will not work. Once your htaccess file is good to go, clear your browser cache and surf your entire site — pages, posts — everything. Check internal links and external links. If possible, check links pointing to your site from elsewhere online. Every page or post should now be addressed by its corresponding and unique permalink, as displayed in your browser’s address field. If all is looking smooth, great. Remember to check the functionality of everything: commenting, posting, tagging, and editing posts. Also check your calendar, archives, search function, different themes, and plugin features (if any).

One problem I encountered (besides those inherently addressed in this article) involved an unwanted index.php statement included before the date in all permalinks. To fix this, you must access the wp_options table in your WordPress database. Once there, find the index field called option_name and search for the record rewrite_rules and clear the contents of the option_value. This will force WordPress to generate new permalink values based on current user settings. Read more via this thread at the WordPress Support Forums.

Don’t forget to reverse any changes made during the permalink conversion process.

References & Resources

Obscure XHTML Tags

Posted on April 3, 2006 in Structure by Jeff Starr

Well, maybe not that obscure..

  • <pre> — Preformatted character data
  • <em> — Renders as emphasized text
  • <strong> — Renders as strong emphasized text
  • <tt> — Renders font as teletype or monospace
  • <dfn> — Defines a definition term
  • <code> — Defines computer code text
  • <samp> — Defines sample computer code
  • <kbd> — Defines keyboard text
  • <var> — Defines a variable
  • <cite> — Defines a citation
  • <strike> — XHTML Transitional only
  • <del> — Indicates deleted text
  • <ins> — Indicates inserted text
  • <dl> — Defines a definition list
  • <dt> — Defines a definition term
  • <dd> — Defines a definition definition
  • <abbr> — Defines an abbreviation
  • <acronym> — Defines an acronym
  • <address> — Specifies an address
  • <q> — Indicates inline quoted text
  • <bdo dir="rtl"> — Override the bidirectional algorithm
  • <wbr> — Word break, applied by IE and Fx if needed
  • <optgroup> — Labels groups of options in select boxes

Robots Notes Plus

Posted on April 3, 2006 in Function by Jeff Starr

About the Robots Exclusion Standard 1:

The robots exclusion standard or robots.txt protocol is a convention to prevent cooperating web spiders and other web robots from accessing all or part of a website. The information specifying the parts that should not be accessed is specified in a file called robots.txt in the top-level directory of the website.

Notes on the robots.txt Rules:

Rules of specificity apply, not inheritance. Always include a blank line between rules. Note also that not all robots obey the robots rules — even Google has been reported to ignore certain robots rules. Also, comments are allowed (and recommended) within any robots.txt file when written on a per-line basis. Simply begin each line of comments with a pound sign “#”.

Prevent Robots from Indexing the Entire Site:

User-agent: *
Disallow: /

Prevent a Specific Robot from Indexing the Entire Site:

User-agent: Googlebot-Image
Disallow: /

Prevent all Robots from Indexing Specific Pages/Directories:

User-agent: *
Disallow: /cgi-bin/
Disallow: /privatedir/
Disallow: /tutorials/blank.html

A Specific Example:

In this example, no robots are allowed to index anything except for Google, which is allowed to index everything except the specified pages/directories. Note the required blank line between the rules.

User-agent: *
Disallow: /

User-agent: Googlebot
Disallow: /cgi-bin/
Disallow: /privatedir/

Another Specific Example:

In this example, no agents are allowed to index anything except for Alexa, which is allowed to index anything. Note that there is a blank space after the colon, which enables this rule to work.

User-agent: *
Disallow: /

User-agent: ia_archiver
Disallow:

Prevent all Agents Except for Google:

Here is Google’s preferred way to disallow all agents anything except Google, which is allowed everything. Note that “Allow” is not a standard parameter and therefore is not recommended.

User-agent: *
Disallow: /

User-agent: Googlebot
Allow: /

Notes on the “meta robots” Tag:

Certain robots rules may also be included in the head section of a web document. Examine the following examples:

<meta name="robots" content="noindex,nofollow,noarchive" />
<meta name="robots" content="noindex,nofollow" />
<meta name="googlebot" content="none" />
<meta name="alexa" content="all" />

Here is a general list of values available for the “content” attribute of the “meta robots” tag:

noindex, index — Determines indexing of site/pages.
nofollow, follow — Determines following of links.
nosnippet — Do not display excerpts or cached content.
noarchive — Do not display or collect cached content.

Additionally, Altavista supports:

noimageindex — Index text but not images.
noimageclick — Link to pages but not images.

References

HTTP Error Codes

Posted on April 3, 2006 in Function by Jeff Starr

A list of HTTP Error codes and corresponding definitions:

Informational Codes

  • 100 — Continue
  • 101 — Switching Protocols

Successful Client Requests

  • 200 — OK
  • 201 — Created
  • 202 — Accepted
  • 203 — Non-Authorative Information
  • 204 — No Content
  • 205 — Reset Content
  • 206 — Partial Content

Client Request Redirected

  • 300 — Multiple Choices
  • 301 — Moved Permanently
  • 302 — Moved Temporarily
  • 303 — See Other
  • 304 — Not Modified
  • 305 — Use Proxy
  • 307 — Temporary Redirect

Client Request Errors

  • 400 — Bad Request
  • 401 — Authorization Required
  • 402 — Payment Required (not used yet)
  • 403 — Forbidden
  • 404 — Not Found
  • 405 — Method Not Allowed
  • 406 — Not Acceptable (encoding)
  • 407 — Proxy Authentication Required
  • 408 — Request Timed Out
  • 409 — Conflicting Request
  • 410 — Gone
  • 411 — Content Length Required
  • 412 — Precondition Failed
  • 413 — Request Entity Too Long
  • 414 — Request URI Too Long
  • 415 — Unsupported Media Type
  • 416 — Requested Range Not Satisfiable
  • 417 — Expectation Failed

Server Errors

  • 500 — Internal Server Error
  • 501 — Not Implemented
  • 502 — Bad Gateway
  • 503 — Service Unavailable
  • 504 — Gateway Timeout
  • 505 — HTTP Version Not Supported

PayPal Sucks

Posted on April 3, 2006 in Business by m0n

PayPal is too automated. The phone service is automated, slow, and worthless. Plus, the number for help is not toll-free — I had to pay for PayPal’s auto-garbage phone system. Plus, the email support is automated, slow, unresponsive, and also worthless. I received a worthless auto-reply to several very specific questions regarding my account security. Security is too important to be so disregarded by PayPal, especially with one’s financial integrity at stake. PayPal is losing the technology race with its poor record-keeping and customer-service performance. I will go elsewhere for the service once provided by PayPal. PayPal is no longer relevant, responsive, or worthwhile.

Lightbox Notes

Posted on April 2, 2006 in Websites by Jeff Starr

To add Lightbox functionality to any single image:

  1. Add rel="lightbox" to the anchor tag.
  2. Add a title="" attribute to the anchor tag.
  3. Add an alt="" attribute to the image tag.

To add Lightbox functionality to any series of images:

  1. Add rel="lightbox[value]" to the anchor tag of each image.
  2. Add a title="" attribute to the anchor tag of each image.
  3. Add an alt="" attribute to the image tag of each image.
  4. Any set of pictures with the same rel="lightbox[value]" will display with nav buttons.