Support » Themes and Templates » Need help with making clickable header

  • Resolved fanboi

    (@fanboi)


    I’m customizing the Desktop Chaos theme. The original theme used html text for the blog title, bit I wanted to use a logo. There was no header graphic (header is built into a large background image – that goes behind content area AND header)

    I added an invisible gif to the section of the stylesheet css and then added the following code (taken from a site that has clickable header) to make that area clickable…

    <div id="blog-title .title" onclick="location.href='http://thejordanpease.com/test/';" style="cursor: pointer;">

    but it made the WHOLE PAGE clickable, not just the “blog-title .title” area. Although other buttons work fine, clicking in the search box sets it off – which disables search.

    HELP?

Viewing 15 replies - 16 through 30 (of 41 total)
  • Thread Starter fanboi

    (@fanboi)

    Thread Starter fanboi

    (@fanboi)

    really appreciate the help by the way!

    <span class="title"><a href="http://thejordanpease.com/test/"><img src="images/invisible.gif"></a></span>

    try add / before images/invisible.gif if that does not work try adding the full url

    Thread Starter fanboi

    (@fanboi)

    where does that code go? Same place I had code before? Within `<div id=”blog-title”>?
    `

    Thread Starter fanboi

    (@fanboi)

    I put that code where the old code was… even tried full URL. Gif still isn’t even showing up (I made a green streak thru invisible gif so I would be able to see it).

    <div id="blog-title">
    	<span class="title"><a href="http://thejordanpease.com/test/"><img src="http://thejordanpease.com/test/wp-content/themes/the-jordan-pease/images/invisible.gif"></a></span>
            </div>

    I think the problem is that who ever designed the theme put the code for title and description in templates while a normal way is to have it in header.php file so you will have problem from page to page you will have go in every template and make changes.

    I just looked html code and all I see is this

    <div id="blog-title">
    <span class="title">
    <a href="http://thejordanpease.com/test/"/>
    </span>
    <span class="description"/>
    </div

    No link

    I dont think you are on the right lines here. It is not necessary to include the image in the html via a template. To accommodate IE it is the link which needs to be clickable. Not the zone it is in. We would normally
    set the link to display: block and increase its height so it fills its parent container. Then we set the fancy bg up in the css as a background.
    Understood correctly this is a CSS question not a php / template thing.

    Thread Starter fanboi

    (@fanboi)

    Root – i don’t understand what you are talking about. What does IE have to do with this?

    govpatel – you said you looked html code and saw this

    <div id="blog-title">
    <span class="title">
    <a href="http://thejordanpease.com/test/"/>
    </span>
    <span class="description"/>
    </div

    I’m confused… you say no link… but there is a link in the code you mention.

    Well proper browsers let you use anything as an anchor not just a link……..

    Thread Starter fanboi

    (@fanboi)

    I don’t understand what that means… what is an anchor? I am not a programmer. I’m not able to take an idea and write code for it.

    html is mark up not code
    good luck with this

    Thread Starter fanboi

    (@fanboi)

    code – mark up, whatever you call it. Six of one half dozen of the other. You know what I mean.

    I can’t write it, but I can usually reverse engineer something and make it work – I didn’t really think this would be so difficult.

    I thought it would be relatively easy to just add the invisible gif to the header and make it a link.

    I still think I was closer when i started. At least then I had the link working. Sure the whole page was a link, but it worked in part.

    Does ANYONE have a clue as to how to do this… If I have to add code (or markup – whatever that is) to every template that’s fine. I just want to make it work.

    @fanboi – could you add the code to theme and then post a link to a page with that code in place (ie add <img src="http://thejordanpease.com/test/wp-content/themes/the-jordan-pease/images/invisible.gif">).

    that way we can see exactly what your issue is and be able to help.

    Thread Starter fanboi

    (@fanboi)

    the code

    <div id="blog-title">
    	<span class="title"><a href="http://thejordanpease.com/test/"><img src="http://thejordanpease.com/test/wp-content/themes/the-jordan-pease/images/invisible.gif"></a></span>
            </div>

    is in place on index.php at http://thejordanpease.com/test/

    but doesn’t seem to do anything, so I’m not even sure if that is the right approach. I started out doing this differently (see code I mentioned at start of thread) but was told that was wrong (even tho it came closer to working than anything suggested).

    pastebin URL for index.php

    let me know if u need links for stylesheet. or any or the other desktopchaos files.

    Thanks for looking into it!

    then you must be adding this in the wrong place, on the page you link to the source shows this:

    <div id="blog-title">
            <span class="title"><a href="http://thejordanpease.com/test/"></a></span>
            <span class="description"></span>
            </div>

    not what you posted above.

    Do you have any cache plugins running?

Viewing 15 replies - 16 through 30 (of 41 total)
  • The topic ‘Need help with making clickable header’ is closed to new replies.