One of the biggest problems with non-custom themes is that when a new update for the theme comes out (ie – pre to post sidebar widgets), you have to re-do all of the CSS code modifications that you changed before.

Or, if you’re lazy like me, you might even just say screw it and use the defaults from then on, if you even chose to upgrade in the first place.

Not any more.

I just stumbled across this: (Yes, I know it’s a year old, but I just found it today, so here you go!) How To Protect CSS Mods For Any WordPress Theme

Nothing groundbreaking, but it’s a simple, yet effective, way to customize a distributed theme to your liking, and not have to worry about your mods when the author makes any changes.

I’ve wondered for awhile what the Link Relationship tab in the Blogroll area was for, but thanks to Marketing Pilgrim, I know now. Apparently, Matt Mullenweg is one of the creators of XFN relationship meta data, and he included it in WordPress because he can :)

Now, Google has announced that they’re going to start using that data, when available, in their search algorithms. My guess is that right away, it will be used to return the social links when you click “Similar Results” for a site that has this meta data. Chances are, if you like Matt Mullenweg’s blog, you’ll like the blogs by the rest of the wordpress team. And Google will weight those blogs higher because they’re linked to Matt’s.

But that leads me to this problem – as of 2/4/08, Matt has 8 links in his sidebar. 4 aren’t WordPress related (though a couple are business-esque and one is Joyent’s blog) and the other 4 are matt.wordpress.com (Matt on Not-Wordpress – his personal blog, though he does talk a bit about WordPress on it), wordpress.com, wordpress.org, and bbPress. If I search for “WordPress” in Google, the chances of Google finding a relevant page on one of the first four are slim – I checked the front page of all of the links, and found nothing, there could be older posts, though.  And the last 4 aren’t really blogs – but I suppose depending on what I was searching for, I could find it in one of those.

And then there’s this: None of the sidebar links on Matt’s blog have XFN Relationship Meta Data! (again, as of 2/4/08) So, am I to believe that this is such a good idea that is big enough to get Google to take advantage of it, but not good enough that one of the creators isn’t even using it? Good luck getting much of anything out of this, Google…

(Note: I’m not bashing Matt for putting what he wants to put in his sidebar. He could have the dancing baby from Ally McBeal there for all I care But it just seems strange to me that Google is so interested in this meta data, and one of the creators isn’t even using it on his blog… Something is missing here)

I’ve been trying to perfect a CSS-only hover menu system for a few months now, and I’m very close, but IE6 is being a pain in the butt. I think it’s IE6-ready, but I’m not making any promises

I was going to wait until I had perfected it, but Small Potato’s DIY Hover Menu post got me off my butt – so here’s my CSS-Only Hover Menu Tutorial:

First, I want to thank Wolfgang from 1234.info for putting his CSS-only menu code in the public domain. I used that as the basis for my menus, and I then separated the design and layout sections as best I could, and added a 3rd-nth level ability for added functionality.

Instructions

Step 1:

Copy this CSS code and paste it into your .css file, or <style></style> section of your site

Ok, now that you have the CSS in place, it’s time to create your menu.

Step 2: The dropnav class element. Create a div with the dropnav class where you want the menu to show up.

Step 3: The Navigation Items. Inside the dropnav div, you can add menu items like this:

Step 4: Submenus. When you want to give one of your menu items a submenu, all you have to do is add another menu item inside the list item of the parent item. But since IE6 is pure evil, we have to do some IE6-specific coding, too. So, the menu item in step 3 becomes this:

If you notice, before the </a> of the parent menu item (Page Name) we pasted in the sub-menu code, from <!–[if IE 7]> to the final <![endif]–>

And actually, we pasted that code OVER the </a>, since the submenu code already has the necessary </a> in it because of IE6/IE7 differences.

Step 5: You can also do 3rd-nth level menus the exact same way we did the 2nd level menus in step 3, with a few changes to the CSS. The CSS code in step 1 is actually set up for 3 levels, but 4th-nth levels need some changes:

To add new levels, you just need to add another chunk of CSS to your CSS code need to add the following to your CSS:

Non-IE6 Hovering CSS
For each level you want to add, just add another “ul li:hover” after the .dropnav

For example:

IE6 Hovering CSS
For each level you want to add, you need another chunk of positioning code under *IE6 Hovering* and copy/paste another “ul li a:hover” after the .dropnav

For Example:

Step 6: Changing the width of the submenus:

First:
Do a find/replace for 10em, and set it to whatever you want (make sure it’s in em for this to work)

Second:
Do a find/replace for 12em, and set it to whatever you set above, plus 2

Third:
Do a find/replace for 12.1 em, and set it to whatever you set above with .1 on the end

Example:
To changing the width to 8, you would replace 10em with 8em, 12em with 10em, and 12.1em with 10.1em

Step 7: Changing the height of the submenus

First:
Do a find/replace for 2em, and set it to what you want (make sure it’s in em for this to work)

Second:
Do a find/replace for 2.1em, and set it to whatever you set above with .1 on the end

Example:
If you want your menu to be 3em, you would replace 2em with 3em, and 2.1em with 3.1em

Example Source Code:

Download the source code for an example 4 tier menu system