Yesterday a friend on an FB Group posted a question asking if it was possible to show different header logos on selected categories in the Extra Theme. I would say – YES; you can do this using WordPress conditional tags. Following is the process as how you can execute this.

Note: I would assume that you’re using a child theme which has a header.php and a functions.php file. If you do not use a child theme, then your changes will be gone when the theme is updated.

There are two steps for this.

STEP #1

First open your header.php file and locate the following HTML. If you open the file in a code editor like Notepad++, it should be around 158 line (under this comment <!-- Logo --> )

Now replace the entire HTML tag with the following tag (it’s a WP action).

Now the entire portion will be looking like this –

Instead of –

Now save the file and move to functions.php file. There will do the magic.

STEP #2

Add the following function at the bottom of your functions.php file. Make sure you copy and paste this as exactly as given. Do the adjustments according to your needs. The code explanation has been given below.

CODE EXPLANATION

In the first step (STEP #1), we removed the HTML tag which was showing the Extra logo image. In place of it we’ve placed an action which will be called from a function in the STEP #2. Naturally, once you remove this tag, no logo image will be shown when you save the header.php file. It’s because Extra does not find that image any more and hence, cannot show the logo.

In the second step (STEP #2 ), we’ve created a function. The function is somewhat self-explanatory. We first uploaded four logo images with equal dimensions, which are as the following –

  1. logo-one.png
  2. logo-two.png
  3. logo-three.png
  4. logo-four.png

Now we’ve added those images accordingly as per the syntax given in that function. Please make sure you follow the exact syntax, else it will cause a fatal error on your site.

In the next segment of the code, we applied WP conditionals category-wise. In my case, I have four categories where I want to display those four different logos dynamically. My site categories are –

  1. CAT_ONE
  2. CAT_TWO
  3. CAT_THREE
  4. CAT_FOUR

So, what we do here is that we tell WP to check the archive page which is on CAT_ONE. If it finds that, then it’d display my logo-one.png image. If not, then display the default one, which I’d add via Extra epanel. Similarly, WP will check the category CAT_TWO and accordingly show the logo-two.png image. You can add more conditions as many as you wish following the syntax. If WP does not find any logo for a selected category, then it will show the default one which is of course added via Extra epanel.

The good part of using an action instead of calling the function directly is that you can further customize that using this action hook et_header_output.

Hope it helps. Let us know if this works for you. For any further customization or for any issues, do feel free to comment below and we will look into this.

Thanks

Share This