Recently I was working on a child theme of Storefront, which by default changes the colour of whichever menu item you’re hovering over. If you hover over the example menu below you’ll see what I mean.

  • Home
  • Blog
  • Contact

Works fine, right? Then I decided I’d like the selected menu to show in a different colour to help users know where they are. So for example if you’re on the home page, the menu would look like this:

  • Home
  • Blog
  • Contact

But now when you hover over the menu items, there’s a problem. Move the cursor between Home and Blog and a small gap between the menu items is glaringly obvious. The same gap is between all the items actually, but it’s not noticeable in the first example.

Read More →

I’m using Fancybox as a lightbox on this site, which was working fine for individual images. But when I posted the gallery of three images in my previous post, I realised the images weren’t linked together in a gallery in a way Fancybox understood. What’s needed is the rel attribute, and a quick google showed loads of people suggesting the same snippet to add to the functions.php file:

/**
 * Give a rel attribute to all gallery images in a post
 */
function st_add_rel_attribute( $link ) {
    return str_replace( '<a href', '<a rel="st-gallery" href', $link );
}
add_filter( 'wp_get_attachment_link', 'st_add_rel_attribute' );
Read More →