ThemeShaper Forums » Thematic


Placing clickable images in the menu/header area

(5 posts)
  • Started 11 years ago by roesch
  • Latest reply from charles_i
  • This topic is not resolved
  1. Hello,

    I'am looking for a way to place several pictures in a row below the header image.
    This will be 'buttons' to external links.

    I do not need the menu structure, but if I can use it, i am fine with it. At least I do not make static pages next to my main page with posts.

    Hard coding is not a problem.
    I tried some things putting HTML code as href to an image, but I have problems to get my code in the right 'box'. It does not align with the header and stuff, but is fixed thight to the left side of the screeen.

    Where to start?

    The list of home, coaching, etc. is placed using a widget in the side bar.
    the upper 'home' is directly coded in header.php.
    I think I have to create a box between #header and #access, looking at this
    or can I use a predefined area like #access?


    Posted 11 years ago #
  2. charles_i

    I've been trying for the past several days to figure out how to do the same thing. I also searched for several hours for any information on using image navigation in any template in WP - no luck.

    I don't think it's possible using the WordPress Dashboard with a plugin, or wp_menu code because all navigation seems to run on CSS ul and li links. In my Thematic Child Theme I was able to place one background image in one ul link but as soon as I went to ul ul and li li the second image would not show up. I had all kinds of problems with 'no-repeat' as well - either not working or repeating the same image twice and bypassing the link to my second image.

    There's too much backend code to trace (for me to spend the time) to figure out where this menu is being generated. And there are so many CSS menu levels with defaults for every conceivable type of behaviour that just turning it all off was becoming problematic. And to add to that the problem with the WP hierarchy is that if you just remove one piece of code (comment it out) it falls back to the parent code so you have to actually rewrite everything to turn it off or remove the function call all together.

    In my case I don't need to worry about adding additional navigation later in the Dashboard. The navigation images are actually in my header (a row of nav images across the bottom with a background image behind them) so I'm going to just hack it and do it the old fashioned stupid way. Apologies to the code masters who would slap me for doing this:

    1. Comment this out in functions to kill the WP menu
    <?php //wp_page_menu('exclude=24,27,28&menu_class=menu menu-primary'); ?>

    2. Comment this out too in styles.css - it builds the menu and the 'skip to content link':
    #access {

    3. Create an old fashioned linked line of images with hrefs

    4. Add the nav code to header.php file or get fancy and put a function in there to call it from somewhere else

    5. Create the pages in the Dashboard and use the generated URLs in my hand made navigation.

    I hope that works. This is a real limitation of WordPress, it seems to me. There is always the assumption that everything will be CSS built. I often have to use good old fashioned images for unconventional navigation.


    Posted 11 years ago #
  3. if you are trying to make a custom menu then you should check out the exhaustive sticky i wrote on the subject.

    within is an example of another member's totally custom image menu.

    btw- the menu is being generated by the function thematic_access()

    Posted 11 years ago #
  4. I have no pages, so the wp menu is not showing up.
    I made buttons (jpg pics) and used html code to let them link to external pages.
    Put all html code in a new function I placed in function.php
    and filtered/replaced it to a hook below the header.

    works for me.

    slowly slowly I start to get the system.

    Posted 11 years ago #
  5. charles_i

    Thanks so much for the "exhaustive sticky"!!!! BRILLIANT! Finally got image navigation to work with your code. If I have further questions I'll start a new thread or post it on that one as suggested.


    Posted 11 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.