Hacking the Mystique Theme to Change the Header Tagline

Changing Ye Taglines

The base for this code modification is Mystique WordPress Theme created by Digital Nature version 2.4.2.

One of the first things I did when I started mucking around with the theme was to change the header so that a different tagline displayed depending on what category you were in. (A holdover from the days when I had six different blogs.)

Since I’m not using the category description, the following shows how to manually set the various taglines AND how to use category_description if you’d rather.

Ready to rumble? Then pop open Appearance -> Editor and read on…

In header.php, right after:

I put in the following bit of PHP in order to grab the category information:

< ? php $category = get_the_category();

If you want to use the category_description for the tagline instead of putting in a new phrase add this on the next line:

$tagline = $category[0]->cat_description;

If you want to use a new phrase based on the categoty name add this instead:

$toprank = $category[0]->cat_name;

You could use the cat_ID (category ID number) or the category_nicename (category slug) instead of the cat_name (category name), I just liked using the name.

Then, right below that you're going to add in the if-elseif-else code below. There are two version, one for the category description and one for a hardcoded phrase.

If you are using the category_description then you'll want to use this code:

if (is_category()) { 
// If the page is displaying a category then use the category description as the tagline
	echo $tagline;
 } else {
// Otherwise use the blog's description
	echo get_bloginfo('description');  
} ?>

If you are putting in the phrases manually (like me), you’ll want to use this code. Just replace the category names with your own information:

if (is_category()) {
// If the page is displaying a category then try to match the category name
	if ($toprank == '1 - Unquiet Bones') {
		echo " Putting Dreams to Paper";
	} elseif ($toprank == '2 - Custom-Models.com') {
		echo " Custom Model Horses in Every Hue!";
	} elseif ($toprank == '3 - Perish Twice') {
		echo " Of Dual-boxing and Death";
	} elseif ($toprank == '4 - Everyday Dragons') {
		echo " Remembering How to Fly";
	} elseif ($toprank =='5 - View From the Molehill') {
		echo " Impersonating a Grownup with the Best of Them!";
	} elseif ($toprank =='6 - Martha.net') {
		echo " There's no place like 127.0.0.1";
	} else {
		//This was just to check and see if posts were missing categories
		echo " Note to Self : Fix top level category for this post";
	}
} else {
//If the page is not a category, they use the default catchphrase
	echo get_bloginfo('description'); 
} ?>

With this in place, a new catch-phrase was displayed as folks navigated around on the blog.

Not really rocket science, but it was the first step in learning how to fiddle with the PHP to make things do what I want.

Problems with the code? Just leave me a comment and I’ll try to help you sort things out! ๐Ÿ™‚



7 responses to “Hacking the Mystique Theme to Change the Header Tagline”

  1. Anu Avatar
    Anu

    Hi Martha,

    I’m still in the process of designing the website and I am stuck with the header. The problem is I’m using a custom image and I think it is just too much to the top! I tried changing header attributes in the Stylesheet file, but I don’t think I am doing right because the header just seems stuck there. Will be grateful if you can provide some insight. Thanks!

    Rgds
    Anu

    1. Martha Bechtel Avatar

      Were you looking to move the header image down so that you can see the dark blue background above it?

      Or were you looking at moving the navigation menubar down so that there is more space between it and the header? ๐Ÿ™‚

      Sorry for the delay, didn’t get a chance to check comments until now (yardwork is evil).

  2. Anu Avatar
    Anu

    Thanks for the reply Martha! No prob about the delay. Actually, trying to do both – need the header image to come down a little and a tiny space between the header and the nav menu bar. I tried different things yesterday and the nav bar just kept moving up and down, but the header image refuses to budge down. ๐Ÿ™‚

    1. Martha Bechtel Avatar

      *puts on her coding hardhat* Lemme go digging and I’ll see what I can find for you! ๐Ÿ™‚

      1. Martha Bechtel Avatar

        Alright, I’m still working my way through the header.php file, but I think I found a ‘quick fix’ that can get you started. I’ll try and work out a coding solution but that may take a bit. ๐Ÿ™‚

        First off, to get the bit of blue background to show above your header, the easy way is to add it into the header image (header10.jpg). All the information I could find online seems to point to the positioning being broken in wordpress for background images, but I’m still searching.

        As for moving the menu bar around, an easy fix would be to change the size of the empty spacer.gif. Right now it’s width=”1″ height=”1″ but you could make one to match the header image on the background… that way you could match up the pixel heights. I’m still digging into the code, and hopefully I’ll have an answer for this as well later.

        If any of this doesn’t make sense, just lemme know! ๐Ÿ™‚

        If you need an image editing software to work with the pictures, you can get a free one at http://www.gimp.org/. Takes a little getting used to, but can’t argue with free! *grin*

  3. Rajesh Avatar

    Thanks for tips related to Mystique.
    Checkout:
    9 Ways to Customize Mystique WordPress Theme

    1. Martha Bechtel Avatar

      Thanks for the link! I had found the 40+ Most Wanted List, but I hadn’t seen this one. ๐Ÿ™‚

Leave a Reply