Making entire WordPress header clickable

December 30th, 2007 5:02 pm by TheHumanBot

Zualtea and oth3rsid3 provided us a solution to make the entire WordPress Header Clickable. Thanks guys.

1) Inside the theme folder, open header.php
2) Inside <body> tag , look for <div id=”headerimg”>
3) Use HTML tag map to make the entire header background image clickable, as below:

<div id="headerimg">
<img src="<?php bloginfo('stylesheet_directory');
?/>/images/kubrickheader.png" border="0" usemap="#misual" />

<map name="misual" id="misual"><area shape="rect"
coords="218,72,644,129" href="/" /> </map>

<h1><a href="<?php echo get_settings('home');
?>">< ?php bloginfo ('name'); ?></a></h1>

<div class="description">< ?php bloginfo('description');
?></div></div>

4) I changed the co-ordinates “coords” so as to cover the entire background image (kubrickheader.png)

Read more about map tag here. I was never aware of this useful tag. I already implemented this more than a week ago. Thanks again guys.

Very impressive indeed, to get solutions from Mizo Computer Science students. I do agree you don’t need to go to an Engineering College to write a few lines of code. But I have seen several Engineering/Computer Students (both Mizo and others) who don’t seem to have even a bit of interest in Computers, forget coding.

Similar Posts:

Recent Posts:

6 Responses to “Making entire WordPress header clickable”

  1. 1
    codeAries Says:

    nitin ka visit ziah thin tana ka contri ve theih chhun… a zillion wc… :)

    Report this comment

  2. 2
    Oth3rSid3 Says:

    @Ben: mi(sual).com lai chauh khi i link duh maw ka lo tia…chuvang nia mapping ah khan misual lai te kha kan map na chhan…image pumpui link chu tag hi tag hmang a link top pon theih tho a…mahse blue color lai te khi link duh chuan mapping khi tha mai…:)

    Report this comment

  3. 3
    Oth3rSid3 Says:

    sorry code tag hman theih na nge :)

    correction:
    image pumpui link chu ‘img’ tag hi ‘a’ tag hmang a link top pon a tih theih tho a…

    Report this comment

  4. 4
    benjamin Says:

    I tried that. It did not work.

    Report this comment

  5. 5
    Oth3rSid3 Says:

    khey…i see…then mapping is the right choice

    Report this comment

  6. 6
    ÄÅÌÎÍÒÀÆ ÑÏÁ Says:

    ÑËÎÌ ÇÄÀÍÈÉ…

    minny…

    Report this comment