Tag Archives: Code

Breadcrumb NavXT 3.3.0

Posted by in WordPress > Plugins

Holy consolidated plugins Batman! With Breadcrumb NavXT 3.3.0, only one plugin is shipped, the old and separate “core” and “administrative interface” plugins have been superseded with just one Breadcrumb NavXT plugin. Direct access to the bcn_breadcrumb and bcn_breadcrumb_trail classes is still possible for those who need more flexibility than the administrative interface offers. Under the hood, the bcn_breadcrumb class has expanded to include some code that should have been in it rather than bcn_breadcrumb_trail. At the same time the code in the bcn_breadcrumb_trail class has been refactored to reduce duplicate code and reduce execution time.

Minor changes were made to the XML importer/exporter so that the XML output is well formed XML. With Breadcrumb NavXT 3.3.0, two new translation sets have been added, Swedish and Russian thanks to Patrik Spathon and Yuri Gribov. There are now five up to date translations distributed with Breadcrumb NavXT along with the default English strings. These are:

  • Spanish by Karin Sequen
  • German by Tom Klingenberg
  • Dutch by Stan Lenssen
  • Russian by Yuri Gribov
  • Swedish by Patrik Spathon

Again, the French translation has not been updated for this release since the former translator did not respond to the release notice a week ago. If you know French and can update the translation, please leave a comment to this post. Also, if you do not see your language in the list and wish to provide a translation, please leave a comment to this post stating so.

You can grab the latest version of Breadcrumb NavXT from the Breadcrumb NavXT page.

-John Havlik

[end of transmission, stay tuned]

Prepairing for Breadcrumb NavXT 3.3.0

Posted by in WordPress > Plugins

Next week, Breadcrumb NavXT 3.3.0 will be released. This release contains several under-the-hood changes, and a few general changes that will affect everyone.

First off, there will only be one plugin distributed with Breadcrumb NavXT 3.3.0. The core plugin was removed, and the administrative interface plugin was renamed to just “Breadcrumb NavXT”. For most users, this change will only require that the user verifies the WordPress plugin updater reactivates the correct plugin. For those manually accessing the bcn_breadcrumb_trail class, you may continue to do so, just keep in mind that you just activate the “Breadcrumb NavXT” plugin rather than the core plugin. The other notable change that affects everyone is the “Breadcrumb Max Title Length” setting now affects the length of all breadcrumb titles, not just the current post’s title.

Those who are manually accessing the bcn_breadcrumb_trail class there are several changes to the bcn_breadcrumb_trail and bcn_breadcrumb classes. These changes are part of a code refactoring effort that reduced much of the duplicate code within the plugin and standardize the code style within the plugin. Previously, the core classes did not explicitly need PHP5, however, beginning with Breadcrumb NavXT 3.3.0 they require PHP5.

In the next week, the documentation for Breadcrumb NavXT will be updated to reflect the changes in 3.3.0, and a new set of tutorials will be written during August.

-John Havlik

[end of transmission, stay tuned]

Quick and Easy Apple.com Style Breadcrumb Trail for WordPress

Posted by in Guides

Almost a year ago, Janko Jovanovic posted a guide on how a little xHTML and CSS can duplicate the Apple.com store breadcrumb trail. Today, I’m going to show you how to apply Janko’s code to WordPress using Breadcrumb NavXT.

Ok, now with the requirements. You’ll need a WordPress blog (everyone should be running 2.8.1 by now), and Breadcrumb NavXT 3.2.1 (or newer).

First up, the xHTML. We are going to use the function bcn_display_list(), which was introduced in Breadcrumb NavXT 3.2.0. This will output a breadcrumb trail in list form. It is worth noting that bcn_display_list() does not output a <ul> or <ol> tag, those must be added around the calling function. We want to wrap the code with <ul> tags.

<ul class="breadcrumb_trail"> <?php if(function_exists('bcn_display_list')) { bcn_display_list(); } ?> </ul>

Place this code where you want the breadcrumb trail to show up, I recommend placing it in your theme’s header.php file. That is all the xHTML work that we need to do. Now, on to the CSS. Open up your theme’s style.css file. We’ll start with styling the <ul>.

.breadcrumb_trail { font: 11px Arial, Helvetica, sans-serif; background: url('images/bc_bg.png') repeat-x; height:30px; line-height:30px; color:#9b9b9b; border:solid 1px #cacaca; width:100%; overflow:hidden; margin:0px; padding:0px; }

Line by line this is setting the font to the Arial/Helvetica family at the 11px size for the breadcrumb trail. Then, we set the background to an image and will repeat it horizontally across the screen. We set the height to 30 pixels for the unordered list and all text within it. This is because the background image is 30 pixels high, and the second will allow the text to be centered vertically without extra work. We set the text color to a shade of grey, this ends up being just the color of the current item breadcrumb text. We set the boarder to be 1 pixel high and a dark shade of grey in color. Next, the width of the unordered list element is set to be 100% of its containing element. We don’t want the trail to ever go outside of the preallocated area for the list, so we tell the browser to hide any overflowing content. Finally, we zero out the margin and padding.

Next we should get rid of those ugly bullet points next to each breadcrumb. Add the following code in below the code we just placed in the style.css file.

.breadcrumb_trail li { list-style:none; float:left; padding-left:10px; }

This code will remove the bullet points next to each breadcrumb, cause the breadcrumbs to line in order from left to right and to keep 10 pixels of padding between each of them. Next, let’s style up those anchors (links).

.breadcrumb_trail a { height:30px; display:block; background:url('images/bc_separator.png') right no-repeat; padding-right: 15px; text-decoration: none; color:#454545; }

Line by line this code will set the anchor height to 30 pixels. The anchors will be treated as block elements rather than inline elements. A background image will be used as our breadcrumb separator, we’ll set it to show up to the right of the anchor. We’ll allow 15 pixels to the right of each anchor so that the separator image displays properly. The normal anchor underline is removed, and finally we set the text color to a darkish gray.

Now we have a few, very short blocks of CSS styling for the hover condition on the anchor and the home breadcrumb icon.

.breadcrumb_trail a:hover { color:#0088ff; }

When the anchors are hovered over this code will set the color of the anchor to a color similar to teal.

.breadcrumb_trail .home img { border: none; margin: 9px 0px; }

This centers the home icon vertically within the home breadcrumb. Now, save your style.css file.

Time to change a few settings in the Breadcrumb NavXT page. If Breadcrumb NavXT is not already activated, activate it at this time. The next step is different depending on the version of Breadcrumb NavXT you are using.

  • For Breadcrumb NavXT versions prior to 4.0: Under the General tab in the Breadcrumb NavXT settings page, change the Home Title from “Home” to <img src="YOUR_BLOG_URL/wp-content/themes/YOUR_ACTIVE_THEME/images/home.png" alt="Home" />.
  • For Breadcrumb NavXT 4.x: Under the General tab in the Breadcrumb NavXT settings page, change the Home Template to <a class="%type%" title="Go to %title%." href="%link%"><img src="YOUR_BLOG_URL/wp-content/themes/YOUR_ACTIVE_THEME/images/home.png" alt="%title%" /></a> and the Home Template (Unlinked) to <img src="YOUR_BLOG_URL/wp-content/themes/YOUR_ACTIVE_THEME/images/home.png" alt="%title%" />.

Remember to replace YOUR_BLOG_URL with the URL for your blog, and YOUR_ACTIVE_THEME with the folder name for your currently active theme. Save the settings. Note: this will have to be changed every time you change themes. If you feel adventurous, you can directly access the bcn_breadcrumb_trail class, which will allow you to assign a dynamic Home Title.

Finally, download this archive with the three images, home.png, bc_seperator.png, and bc_bg.png (The home.png was replaced from Janko’s originals as I didn’t like it). Upload it to your current theme’s images directory. If this directory does not exist, make one and place the images in it. Now, you should have a breadcrumb trail that looks like that on Apple.com.

-John Havlik

[end of transmission, stay tuned]

goto code_hell;

Posted by in General

code_hell: echo 'Yes, PHP 5.3 has the goto operator';

In one’s opinion, the only people that should be allowed to use the goto operator are expert assembly language programmers (and you are not one). Besides, most things written in PHP are not “low level” enough to warrant the use of goto. However, if you must use the goto operator, please do so responsibly. Use it as if it costs $10,000 per use, and properly document what’s going on.

-John Havlik

[end of transmission, stay tuned]

Let’s Play a Game

Posted by in WordPress

Question: What causes the following error in Apache’s error logs?

[IP_address] Undeclared entity warning at line 226, column 1

Answer: A fairly popular, yet, poorly written WordPress plugin.

The first time this error hit the Weblogs.us error_log, one had no clue what was causing it. Unfortunately, the error does not indicate what file triggers the error. However, it will include the referring URI, if applicable. That’s how one found the specific virtual host on the Weblogs.us server that was triggering the error. Next, was finding the infringing code. To do this, one added define('WP_DEBUG', true); to the wp-config.php file for the virtual host. Now, there will be an avalanche of errors and warnings for most sites, all that needs to be done is sift through them and look for ones like “undeclared variable” and “undeclared index”.

Now, what was the actual culprit? The Twitter-for-Wordpress plugin. Specifically, lines 100, and 158. Line 100 tries to increment a non-initialized variable. To fix the issue on line 100, add a new line between line 66 and 67 and place in it $i = 0;. The error on line 158 is it tries to use the undeclared variable $username. What probably happened was author copied the line directly from line 53, while not properly modified for its location. Line 158 should read:
$messages = fetch_rss('http://twitter.com/statuses/user_timeline/'.$item['username'].'.rss');

After these two changes everything should be good to go. Yes, the plugin author was notified of these problems. We’ll see when they officially get fixed in the plugin.

-John Havlik

[end of transmission, stay tuned]