1. Change the default gravatar
Something that ‘bigger’ blogs often do is have a customized avatar for users who don’t have an avatar themselves. How do they do it? Through the functions.php file of course!
First thing to do is to create your exciting new avatar, 100 by 100 pixels. Next, upload your avatar to /wp-content/themes/yourtheme/images/, having saved it as gravatar.jpg.
Now that you’ve created your avatar, open up your functions.php file and add the code below.
Next, to activate your shiny new avatar, in the WordPress backend, under ‘Settings’, click ‘Discussion’. Then scroll down to avatars, select your exciting new avatar and click ‘Save Changes’. Done.
2. Create an awesome options page
No doubt you’ve seen theme options pages in WordPress themes. The more inquisitive of you might have even wondered how they’re made. The answer is of course, in the functions.php page!
Creating an options page isn’t as hard as you might think, and it’s something that I’ve covered on my blog – if you want to create an options page, it’s best you take a look there. Here though, we’ll take a brief look at the very basics of options pages.
First thing to do is to open up your functions.php file and add the following code:
Let’s take a look at the code. $themename is the name of your theme, funnily enough. You’ll need to change that. You’ll also need to change the $shortname to a shortened name of your theme’s name. For example, in the code above, the theme is called ‘hexadecimal’. This is shortened to ‘hd’. Simple.
As we are editing the functions.php file, obviously the code we’re writing is php. What this means is that we don’t need to style each section of our options page individually; using php’s arrays, you can specify that you want an element to have certain properties, which the php will apply later. For example, the code below lets the user enter some text, perhaps changing the footer copyright or the like.
(to keep this tut from being stupidly long, I’ve missed out a couple of important bits of code you’ll need to make this work, but you can download the code here).
In the code above, first we’re telling the code to insert the code filed under open (more on that below), then give it a title and description. The $shortname is what you can use to implement the options page into your theme. Below that, we’re telling the code to insert the code filed under text, with a default (ie what is displayed when you haven’t changed anything) of ‘Frederick’. We’re then closing and submitting.
We’ve specified a number of elements – ‘close, submit’ etc. I’ll quickly run through how this would get styled – in the code below, we’ll style the text box we use above:
3. Add widgets to your theme
Widgets are just one of the things that you simply must have when building/releasing a theme these days. Adding widgets to your sidebar is really easy – add the code below to your functions.php.
Lets analyse the code – before the widget the CSS class ‘widget’ will open, and before the title the h3 class widget will open. Using these two, you can style your widgets, but not before you’ve implemented the widgets into your sidebar, with the following code:
It’s all very well having a single widgetized area, but why not have more? Just copy and paste the code above into your functions.php file, changing the name from ‘Sidebar’ to something that suits where you’re putting the widget, perhaps ‘Footer’.
This final way to add widgets to your theme was inspired by a post on Smashing Magazine on the subject of widgets. What is this final way to add widgets? In between posts. Again, add the code above to the functions.php file, changing the name to something more appropriate, perhaps ‘In-Between-Posts’. Once you’ve done that, open up your index.php file or home.php file and before the , add the code below:
4. Create shortened URLs for Twitter
Automatically shortening your blog posts’ URLs for Twitter is really easy to do with the functions.php file. I’ll show you how to shorten your posts’ URLs with tr.im and tinyurl (code from WPRecipes.com). Lets start with tr.im. Add the code below to your functions.php file:
And then to use the shortened URLs with the code below, within the loop in your single.php file.
Whilst tr.im is arguably a better shortening service, tinyurl is also very popular. Thankfully, it is also very easy to integrate tinyurl’d URLs into your blog posts with the code below in your functions.php file:
And then in your single.php file, within the loop:
5. Display images on archive pages (and the homepage) without using custom fields
A lot of WordPress themes use custom fields to display images, which most users understandably find a pain to do. However, it needn’t be that hard to do! As was posted in the WordPress support forums a while back, with the functions.php file, you can easily get around the need for custom fields:
Once you’ve inserted the code to your functions.php file, all that is left to do is to replace your custom field-getting code in the index.php/home.php file and replace it with the code below.