Clickable Header with custom theme

  • Resolved Nazareth

    (@nazareth)


    18 years, 3 months ago

    Hello- Woulkd someone know how to make the whole header area a link to homepage? I’m using a custom theme and things are a bit different with the code- in my header.php the code looks like so

    <?php wp_get_archives(‘type=monthly&format=link’); ?>
    <?php wp_head(); ?>
    </head>
    <body>
    <div class=”page”>
    <div class=”header”>
    <h1>“><?php bloginfo(‘name’); ?></h1>
    <h2 class=”blog-description”><?php bloginfo(‘description’); ?></h2>
    </div>

    Not wuite sure what to change here.

    Also, I’m not sure if I did this right, but I was trying to hide the header description text and I changed the margin in the following ‘style.php’ to -1900, was that the right spot to do so?

    body {
    background-color:<?php tiga_bodyBgColor(); ?>;
    font-family:<?php tiga_getValue(‘bodyFontFamily’); ?>;
    margin:0px;
    padding:0px;
    text-align:center;
    <?php tiga_bgImage(‘body’); ?>
    background-attachment:fixed;
    }

    h1 {
    margin:-1900px;
    padding:0px;
    }

Viewing 15 replies - 16 through 30 (of 42 total)

  • >>But I use background positiong with links all the time. So it does make a difference to me….<<

    I do, as well. And I have ways around that. But the earlier suggestion was for something easier to implement – so I decided not to go into that – mainly because it doesn’t matter to the point of the current question anyway. From what I see, there’s no background positioning in regards to his header image (there is to his body background – but not the header). So I still say the easiest method would be to just adjust the padding to his H1 link so it encompasses the whole header area (but that’s my opinion – more options for the original poster, I suppose!). It’s easy, and doesn’t require javascript.

    And yes, better me than anyone in regards to the coffee – Ugh. I can’t even take medication for the withdrawal migraines I get – I just have to bear through it (and boy do I…just ask my poor, terrified husband. LOL)

    Thread Starter Nazareth

    (@nazareth)

    Padding, header elements, H1-H2’s, CSS- oy my brain just burst- but not to worry, life support isn’t all that bad.
    Not sure what the best method is as most of what ya’ll are saying is greek to me, but I went with the onclick thing & the curser thing- seems to be working fine. My header doesn’t have any blocks of text in it for linking, it’s all one big picture- even the text. The actual text has been moved off to the side where it isn’t visible, but I’d really like not to have it shown as it is kinda bland looking and interferes with the look of the graphic- I spose I could research how to make text look better- but my limitted knowledge is an impediment- it took me all day yesterday to discover that I couldn’t figure out how to make posted text include a drop shadow lol (I actually had it workin at one point, but kept getting validation errors- so I reverted back to my old CSS file.)

    Where would I put that “cursor: pointer;” in the header file?

    >>My header doesn’t have any blocks of text in it for linking, it’s all one big picture- even the text. <<

    See, now that would have been nice to know ??

    In that case, why could you not just link the header image? You know, remove it as a background in your CSS file, and just link to it straight up in your HTML?

    <a href="#"><img src="header_image_here.jpg"></a>

    That right there’s the easiest way to go about it.

    Thread Starter Nazareth

    (@nazareth)

    Well, I’ve got the whole image linked, but just have the curser issue thingie going on now where it doesn’t change to the hand to indicate the header is clickable. Not sure where to put the curser code in the style file.

    I did mention the header was a picture & no header description was viewable- wow do you need some coffee lol

    Sorry I haven’t responded sooner- I’ve spent the whole day dubbing around with trying to get video embedded and to validate, but no luck- I can get youtube validated with correct code, but not other video from different sites like vidilife video-

    <div class=”header” onclick=”location.href=’https://www.yoursite.com&#8217;;” style=”cursor: pointer;”>

    Try that.

    Thread Starter Nazareth

    (@nazareth)

    Perfect, works like a charm, thanks vkaryl- hmm- somethign happened somewhere along the way though- my whole header shifted over a bit to the right.

    You’re welcome, want to change this topic to resolved?

    Thread Starter Nazareth

    (@nazareth)

    Sure unless someone has a thopught on why the header shifted to the right & how to adjust it back? the link again is https://sacredscoop.com if yha needs to look at it- if noone has a thought in a day or so- just change this post to resolved.

    Hmmm. Are you wanting that graphic to repeat? If not, change this:

    background-image:url("images/header-bg.jpg");
    background-repeat:repeat-x;
    background-position:center;

    to this:

    background-image:url("images/header-bg.jpg") no-repeat 50% 0%;

    Better if it doesn’t repeat really, since you don’t want the logo title to partially reappear.

    Thread Starter Nazareth

    (@nazareth)

    no- I didn’t have it set to repeat- it just kinda somehow got nudged to the right by somethign I did when I was messin with the codes (not hte stuff you folks suggested- but other stuff)
    What file would the code you suggested be in?

    Just noticed that my center box where the posts go is also off center-

    You have this is your stylesheet:

    .header {
    border-color:#AAAAAA;
    background-color:#F8F7EF;
    height:124px;
    background-image:url(“images/header-bg.jpg”);

    and it *is* repeating – how weird. Your center column is centered,by the way – but I have a *huge* horizontal scroll on Firefox.
    background-repeat:repeat-x;
    background-position:center;
    border-style:solid;
    margin-bottom:5px;
    border-width: 1px;
    padding-left:10px;
    }

    Change it to this:

    .header {
    border-color:#AAAAAA;
    background-color:#F8F7EF;
    height:124px;
    border-style:solid;
    margin-bottom:5px;
    border-width: 1px;
    }

    and it *is* repeating – how weird. Your center column is centered,by the way – but I have a *huge* horizontal scroll on Firefox.

    Thread Starter Nazareth

    (@nazareth)

    hmmm- tried both of those suggestions but not getting it centered- it must show different in foxfire than IE

    ADDED: OK IU got it all back centered (at least in IE) I reinstalled the header.php, The header of course isn’t clickable now, now I’ll go slow and retry the suggestions for making the header clickable & see what happens-

    Did that fix the huge scroll bar for you Doodlebee?

    No, it didn’t.

    But I did figure out why it’s there. It’s this line in your stylesheet:

    h1 {
    margin:-1900px;
    padding:0px;
    }

    the -1900px margin is giving your site a *huge* scrollbar. I’d reset that sucker to 0 – gets rid of it.

    By the way – my *one* suggestion wasn’t to center your site, it was to fix the header. (criminy, I just noticed I have two posts in one container – how’d *that* happen?)

    If your site isn’t centered in IE, then add “text-align:center;” to your body in the stylesheet.

    Thread Starter Nazareth

    (@nazareth)

    doodlebee, I hjad to add that -1900 to move the header description off page so that it wouldn’t interfere with the graphic. I don’t really want to remove the header description and blog name completely as from what I understand search engines use it for keywords & such. Is there maybe another alternative to making the description invisible but present without removing it entirely?

    My site is centered now, but because I reinstalled the stock header.php file which did away with the clickable header again- I’ll try adding the stuff you gave me back in again and use that text-align code & see what happens- thanks all for your comments and help-

    Thread Starter Nazareth

    (@nazareth)

    We can call this issue resolved. I managed to get rid of Blog title, but can’t seem to get the description out. I’ll work on this by googling it- thaks all for your help on the header clickable thingie- I’ll get it working per your instructions I’m sure, it’s just that I messed something up myself before- but that’s resolved now too-

Viewing 15 replies - 16 through 30 (of 42 total)
  • The topic ‘Clickable Header with custom theme’ is closed to new replies.