The six month of 2008 is now complete and this blog is celebrating the completion of its ninth month of existence. Hack WordPress has continued to show excellent growth each month, so I like to wrap up each month with our popular posts for that month and also to thank everyone for supporting us through reading, comments, guest posts, and any inbound links you’ve sent mentioning the stuff you find here. It really is appreciated!
Here are some of last month’s most popular posts:
- Turn Your WordPress Blog Into an E-Commerce Site
- What Do You Think of Premium WordPress Themes?
- Maximize SEO with the SEO Sniper WordPress Plugin
- How To: Creating a Print Stylesheet for Your WordPress Blog
- How To: Resetting Your WordPress Password
I would also like to take this opportunity to thank this month’s sponsors:
- SkinPress - SkinPress provides a large variety of website templates, including over 60 free WordPress templates.
- PressBox - Pressbox is a new quality premium WordPress theme that is available with 3 different licenses to choose from. You can see a demo here.
If you have WordPress themes, WordPress plugins, or other WordPress related products and services that you’d like to promote, we currently have a couple advertising spots available. Advertising rates may be going up soon, but all existing advertisers are grandfathered in at their existing rate for a few months, so now is a good time to sign up! Please check out our advertising page, then contact us if you are interested.
This sliding doors CSS hack allows you to create sophisticated tabs for your navigation bar. Sadly, Wordpress core functions wp_list_pages() and wp_list_categories() don’t allow you to add the required span tag to use this technique.
We are going to see how to proceed in order to use sliding doors in our Wordpress theme.
Sliding doors, why?
There’s many articles available on the web about the sliding doors technique, so I’m not going to talk a lot about it. For people who don’t already know this famous hack, here’s a quick example.
Let’s build a typical navigation list:
<ul id="nav">
<li><a href="#">link n°1</a></li>
<li><a href="#">link n°2</a></li>
<li><a href="#">link n°3</a></li>
</ul>
If we apply, via CSS, background images to our links in order to make this menu prettier, we’ll quickly see a big problem: We must add a fixed width to the links, otherwise the image will be truncated if the link is too short, or the link will overflow the image if its width is too long.
That’s why sliding doors are very useful: We just have to add a span element inside the link, and then, in our CSS, assign a different background image to both the span element and the link.
<ul id="nav">
<li><a href="#"><span>link n°1</span></a></li>
<li><a href="#"><span>link n°2</span></a></li>
<li><a href="#"><span>link n°3</span></a></li>
</ul>
Our CSS should look like this:
#nav a, #nav a:visited {
display:block;
}
#nav a:hover, #nav a:active {
background:url(images/tab-right.jpg) no-repeat 100% 1px;
float:left;
}
#nav a span {
float:left;
display:block;
}
#nav a:hover span {
float:left;
display:block;
background: url(images/tab-left.jpg) no-repeat 0 1px;
}
Please note, as this is only an example, the CSS above isn’t complete and only shows how to apply the sliding doors hack.
You can see a live demo of a navigation menu which uses this technique on my blog here.

Using the sliding doors hack within Wordpress
I saw many blog posts where some users told you to modify Wordpress core in order to apply this technique. Personally, I never really liked this idea: First, the Wordpress core wasn’t made for being modified. And secondly, if you do, when you’ll upgrade your WP version, you’ll have to re-modify the core. Not user friendly at all!
Instead of this, let’s use a regular expression, by using the php preg_replace() function. We are going to get our pages (or categories) without displaying it, and passing it as a parameter to preg_replace(). The two remaining parameters will be, of course, our regular expression: The pattern we’re looking for, and this pattern’s replacement.
To create this menu, paste the following code instead of the wp_list_pages() (or wp_list_categories()) function in the header.php of your Wordpress theme.
To list your pages:
<ul id="nav">
<li><a href="<?php echo get_option('home'); ?>/"><span>Home</span></a></li>
<?php echo preg_replace('@\<li([^>]*)>\<a([^>]*)>(.*?)\<\/a>@i’, ‘<li$1><a$2><span>$3</span></a>’, wp_list_pages(’echo=0&orderby=name&exlude=181&title_li=&depth=1′)); ?>
</ul>
To list your categories:
<ul id="nav">
<li><a href="<?php echo get_option('home'); ?>/"><span>Home</span></a></li>
<?php echo preg_replace('@\<li([^>]*)>\<a([^>]*)>(.*?)\<\/a>@i’, ‘<li$1><a$2><span>$3</span></a>’, wp_list_categories(’echo=0&orderby=name&exlude=181&title_li=&depth=1′)); ?>
</ul>
Right now, your new menu is ready. You just have to make it sexy with CSS. Have fun! ![]()
About two weeks ago, we covered a story about the All-in-One SEO Pack and the fact that it was no longer being supported. To the relief of thousands of WordPress users, about a week later, we found out that someone else had resurrected the plugin. The lesson learned was obviously that too many people had come to rely heavily on a single WordPress plugin.
Thanks to a heads up from my friend Leland at Themelab, it looks like someone has attempted to put a fork into the All-in-One SEO Pack plugin, with the release of a new plugin called Platinum SEO Pack. Here are a few of the features that you will get on top of what AiO SEO Pack included:
- Ability to add follow or nofollow and noindex meta tags to any post or page.
- Automatic 301 redirect for permalink changes.
- Nofollow links to your archives, categories, and tags pages.
To read more, or to download the Platinum SEO Pack, check out the authors page.
Yesterday I wrote a post explaining how to move your WordPress install within your website/server. Today I wanted to cover how to move your WordPress install to a completely different server.
Again, the flexibility of WordPress shines, making this not overly difficult to accomplish. If you aren’t changing your domain name, all you need to do is update your wp-config.php file and upload all of your files to their new server.
If you are changing your domain name with your move, here is the information you’ll need:
- Backup your WordPress database.
- Download the complete WordPress install to your hard drive and identify the folder as your OLD installation.
- Login into your old blogs dashboard and update the Settings to reflect the website and blogs new location (both fields should be the same).
- Now, download the complete WordPress install to your hard drive, but this time identify the folder as your NEW installation. This will include the settings change you just made.
- Download a copy of your WordPress database (keeping the old one) and then upload it to the new server. You’ll want to keep the same database name and recreate the user login information (you can use your same user name and password). If you change the database name, you’ll need to update your wp-config.php file to reflect the change.
- Upload your NEW installation folder so that your blog is now working in its new location!
If you want to keep your old blog, you’ll need to upload the OLD folder to the OLD location of your blog and readjust the General Settings tab.
Another way to accomplish all of this is to simply make a fresh WordPress install and export/import your posts to the new location. This isn’t the most ideal method, but it is much easier and will get the job done.
For additional information, you’ll want to consult the WordPress Codex.
Search engine algorithms are always changing, so even for the top experts in Search Engine Optimization, there is a constant need for studying the newest SEO techniques in order to compete in todays online world.
WordPress has always been very search engine friendly by default, and when you add things like the All-in-One SEO Pack plugin or the SEO Sniper plugin to the mix, you have the potential for a very well optimized website without any real work.
With that said, there are a variety of SEO techniques that you can apply to your sites setup that aren’t covered with a simple plugin, and Joost de Valk has taken the time to cover WordPress SEO in great detail.
I have made it a habit to stay very current on the latest SEO techniques and I found this post extremely useful, well organized, and Joost did a great job of explaining things in a way that pretty much anyone can understand. And hey, if you don’t like to read about SEO, you can at least click over to check out his new website design (and improved domain name). Great work Joost!
I have added this post to our WordPress resources page.
Here are some great WordPress-related posts I’ve enjoyed over the past week:
- Track WordPress 2.6 Progress - Quick Online Tips gives some suggestions on how to keep up with the progress of WordPress 2.6.
- How to Create a Dynamic Sidebar - This is something we’ve covered on a couple different occasions here on this site, but I wanted to point out this post because I think Richard does a great job of explaining how to tell WordPress what to display on each page.
- Project M Finally Announced - Justin Tadlock finally announced the details of his Project M. It appears it is a theme club of sorts, but with a twist. Click over to get the details.
- Do It Yourself WordPress Theme - Hayes Potter has come up with an interesting idea by releasing a WordPress theme. Simply build your stylesheet and you are done.
- WordPress Tricks - Stylized Web offers some useful PHP code snippets for WordPress.
- Making Authors Template Page - Also from Justin Tadlock, this post does a great job detailing how to make a WordPress authors template page.
- Displaying Related Categories and Content in WordPress - Darren Hoyt shares the code he used to make this feature in his popular Mimbo Pro theme.











