This tip similar to Tip #1 in that it will help you add HTML styling to parts of your blog that the usual HTML styling doesn’t reach! Last time it was post headings, this time we’re targeting your blog’s tagline.
While it’s perfectly possible to style your blog’s tagline using a CSS stylesheet, that method only allows you to modify the styling of the whole tagline. If you want embolden one word, or italicize one phrase, then you’re out of luck. If you try adding <strong> or <em> tags, they just appear in the tagline. So, what to do?
Well, the solution is a little bit more involved than last time, which is why I’ve designated this article for tweakers as opposed to regular bloggers, but in most cases it only requires a one line change to your theme’s header file to do it.
So, if you’re ready, let’s go…
- Login to your blog and go to the Theme Editor — select Design >> Theme Editor from the admin menu.
- Look in the list of Template Files on the right of the page for one called Header or header.php and click on it to open it in the editor. (Note: if you can’t find a header file, you will have to look for the file that contains the text bloginfo(‘description’).
- Once you have found the correct template file, the first thing you should do, especially if you have never done anything like this before, is make a copy of the template’s contents just in case something goes wrong and you’re not sure how to fix it. The easiest way to do this is to:
- Click in the edit window.
- Hit Ctrl-A to select all the text in the edit window.
- Hit Ctrl-C to copy the text to the clipboard.
- Open up a new file in an editor — e.g. Notepad on Windows.
- Hit Ctrl-V to paste the file into the editor.
- Now, if you make a mess of things, you can always reverse the process and paste the original template back into WordPress.
- To add HTML tags to the blog tagline you must find and modify the WordPress function call bloginfo(‘description’). There could be more than one of these in the header template so if you want to change them all, make sure to find all of them.
- To enable HTML tags in the blog tagline, change:
Note: double-check that you have made the change correctly otherwise your blog’s pages may fail to load!
- Click on the Update File button to save the modified template.
- Now, before you change anything else, make sure your blog page still loads and looks ok. If you see an ugly error message then see below for help. But if everything looks ok, then it’s time to test your modification.
- Go to the General Settings page (Settings >> General) and add some HTML to your blog’s tagline. For example, use <em></em> to italicize, or <strong></strong> for bold.
- Save your changes then check out your handiwork. You should see the effect of the HTML styling in your blog’s tagline.
Note: You can also use this technique to style your blog’s title, but there is a major snag. If you add HTML to your title in the Settings page, you will see the HTML tags in the title bar of your browser, which looks a little ugly.
Okay, so that turned out not to be such a quick tip, but I hope some WordPress users will find it useful.
What to do if you get an error message:
If you get an error message after modifying the header template the it’s likely you made a mistake when you were changing the template. Go back and inspect your changes, make sure you didn’t leave anything out (like a semi-colon or the echo statement) or misspelled something. If you can’t figure it out then paste your backup copy (I hope you made one!) back into the theme editor and try again.