Snippets

Styling Placeholder Text

Sometimes the light grey placeholder text needs to be styled to fit with your needs. All in all it is pretty easy with a couple of pseudo-elements and pseudo-classes.

Checkbox Checked in YUI

If you happen to need to trigger an event when a checkbox is checked or unchecked with YUI then this little snippet should help you out.

Text input non-editable

If you ever need to make an input field or textarea non-editable the readonly attribute comes in very handy.

When the readonly attribute is present in the markup, it specifies that the user will not be able to modify the value. However the user will still be able to tab to it and copy the text.

Sass Clearfix Mixin

There are a few ways to implement the clearfix hack but the following Sass mixin has been in my toolbox for the last year thanks to this article on Nicolas Gallaghers blog.

Group Posts by Date

If you publish posts multiple times per day sometimes there is a need to wrap posts by date. This is common amongst lots of link bloggers.

If you run a WordPress driven site thankfully this is super easy with one slight addition inside your loop.

Converts pixels to EMs with Sass

If you like using pixel values but understand that having your fonts set in EMs works better, especially when tackling responsive web design then this little Sass function will become super handy.

This function automatically converts pixels to EMs so that you don’t have to manually calculate them.

URL as a Sass Variable

Do you ever find yourself trying to remember the URL path of you images directory? Well with Sass you can quickly add the path to the desired location and just use the variable throughout your code. Sass to the rescue.

All you need to do is declare the variable and then use the interpolation syntax when you reference it.

Remove Trackbacks from Comment Count in WordPress

Are you finding that your comment count is not the correct number? Adjusting the settings in the discussions screen still doesn’t fix it. Well, this little snippet of PHP added to your functions.php file should fix that.

Focus on Input with JQuery

This is very simple and can also be done with HTML5 ‘autofocus’ which I would recommend if you can. If for some reason you need to control it with JavaScript, utalising jQuery’s ‘.focus()’ event handler will get you out of trouble.