23 {{ upvoteCount | shortNum }}
23 {{ upvoteCount | shortNum }}

Need How Tos for making a single image in Wordpress Header clickable if it's possible!

by gabbydeb
20 replies
  • WEB DESIGN
    • |
Hello fellow Warriors.,

I can't seem to find the info I need to make a single image clickable on a custom Wordpress header. I create custom Wordpress headers. A job I am working on requires that a single graphic on this header to be clickable. I Googled my question and the results I get back, all talk about making the whole header clickable back to the homepage. I am at a disadvantage with PHP. I think the header.php file is where to do something like this, but that is as far as my great knowledge of PHP goes. LOL

Any help I could get with this, would be so appreciated.

Regards,
Debbie
#clickable #header #image #making #single #tos #wordpress
  • Profile picture of the author David V
    Very similar question just asked a day ago:
    http://www.warriorforum.com/programm...clickable.html
    {{ DiscussionBoard.errors[7607594].message }}
    • Profile picture of the author gabbydeb
      I don't want to make the header clickable. I found all kinds of info on that when I googled it. That is why I came here, in hopes that someone would know how to make a single graphic clickable, not the whole header. Perhaps I didn't make myself clear on this. Umm, The header in question has several different graphics. There is one graphic that needs to be clickable. It could be that this is not possible, and that is what I want to know.

      Regards
      Signature

      {{ DiscussionBoard.errors[7607638].message }}
  • Profile picture of the author Istvan Horvath
    Any image can be made clickable anywhere (except background images).
    Just put the usual HTML anchor tag around it. Done.
    Not PHP - simple HTML...
    Signature

    {{ DiscussionBoard.errors[7607671].message }}
    • Profile picture of the author David V
      Originally Posted by Istvan Horvath View Post

      Just put the usual HTML anchor tag around it. Done.
      HTML Code:
      <a href="http://the-site.com"><img src="http://the-site.com/image.jpg" alt="if you want alt" /></a>
      Correct the image path to your image path.
      {{ DiscussionBoard.errors[7607731].message }}
      • Profile picture of the author gabbydeb
        Hi David,

        Thank you so much for the code. So I would go into the header.php to do this? Sorry for sounding a bit clueless.

        Originally Posted by David V View Post

        HTML Code:
        <a href="http://the-site.com"><img src="http://the-site.com/image.jpg" alt="if you want alt" /></a>
        Correct the image path to your image path.
        Signature

        {{ DiscussionBoard.errors[7607781].message }}
        • Profile picture of the author David V
          Originally Posted by gabbydeb View Post

          Hi David,

          Thank you so much for the code. So I would go into the header.php to do this? Sorry for sounding a bit clueless.
          General answer, yes.
          There could be variables though,
          like how did you insert the image into the header?
          through WP admin area, or hardcoded in the header.php?
          Depends how and where you inserted that header graphic.

          EDIT:
          Do you have a url where I can see your header?
          {{ DiscussionBoard.errors[7607805].message }}
          • Profile picture of the author gabbydeb
            I create the headers in my own graphics program, thus the graphics are there when I upload the header in the wordpress header uploader located in the admin area. I hope I have explained it right.


            Originally Posted by David V View Post

            General answer, yes.
            There could be variables though,
            like how did you insert the image into the header?
            through WP admin area, or hardcoded in the header.php?
            Depends how and where you inserted that header graphic.
            Signature

            {{ DiscussionBoard.errors[7607818].message }}
            • Profile picture of the author David V
              Originally Posted by gabbydeb View Post

              I create the headers in my own graphics program, thus the graphics are there when I upload the header in the wordpress header uploader located in the admin area. I hope I have explained it right.
              Ok, I get that, but you said you have more then one graphic in the header and you want to hyperlink a graphic on/in the header, not the whole header.
              Seeing what your doing would be fastest. You may or may not want to hardcode in the header.php
              What's your theme?
              or is it online?
              or can you paste the section of code from your header.php that contains that graphics area.
              {{ DiscussionBoard.errors[7607851].message }}
              • Profile picture of the author gabbydeb
                The blog theme in question Wordpress 2012. So it would seem that because I want to make the individual graphic clickable, that I can't do that while it is on the header when I upload it? Correct me If I'm wrong.


                Originally Posted by David V View Post

                Ok, I get that, but you said you have more then one graphic in the header and you want to hyperlink a graphic on/in the header, not the whole header.
                Seeing what your doing would be fastest. You may or may not want to hardcode in the header.php
                What's your theme?
                or is it online?
                or can you paste the section of code from your header.php that contains that graphics area.
                Signature

                {{ DiscussionBoard.errors[7607881].message }}
                • Profile picture of the author David V
                  Originally Posted by gabbydeb View Post

                  The blog theme in question Wordpress 2012.
                  Ok, your explanations have both us shaking our heads.....
                  It's ok, what was mentioned earlier for code is how you hyperlink the img.
                  The default 2012 theme has ONE header image.
                  When you upload the header image (your custom graphic) it will automatically hyperlink to the home page in the 2012 theme.
                  If you really have TWO, then you've done some modifications somewhere, by default you can't do this without hardcoding the image into the header.
                  Which begs the question, is there ONE image, or TWO?
                  A visual of what your doing would conclude this quickly.
                  {{ DiscussionBoard.errors[7607918].message }}
    • Profile picture of the author gabbydeb
      Hi Istvan,

      Thanks so much for your helpful reply. So I would go into the header.php file to do this? after I uploaded the header to Wordpress? I guess I sort of need a picture drawn for me! LOL

      Regards,
      Debbie

      Originally Posted by Istvan Horvath View Post

      Any image can be made clickable anywhere (except background images).
      Just put the usual HTML anchor tag around it. Done.
      Not PHP - simple HTML...
      Signature

      {{ DiscussionBoard.errors[7607759].message }}
  • Profile picture of the author Istvan Horvath
    Well, you are now confusing me: in the OP you were talking (or created the impression) there are several images in the header area. And one of those needs to be clickable...

    If more than one, those can NOT be uploaded via the usual "replace the header image" technique from the admin panel - you need to upload them via FTP.

    And if so, then you MUST know the names of the images to include them with simple HTML img tags into the site. And around one of them - you would put the anchor tag.

    I don't see anything complicated here... as long as we put aside the WP theme option tools invented for HTML-illiterates
    Signature

    {{ DiscussionBoard.errors[7607859].message }}
  • Profile picture of the author Istvan Horvath
    Hmm... now seeing that I am not the only one who misunderstood what you wrote - I conclude you don't know not only WP and HTML but your own stuff, either. I mean you don't know the difference between ONE image and more images???
    Signature

    {{ DiscussionBoard.errors[7607864].message }}
  • Profile picture of the author Istvan Horvath
    Image editing basics 101: if you combine 2 or 78 images into ONE single file that you can upload via WP theme header options... there is NO individual graphics there. Just ONE SINGLE graphic file. Period.
    Signature

    {{ DiscussionBoard.errors[7607923].message }}
  • Profile picture of the author David V
    This is what the default 2012 header image looks like. It's one image and auto hyperlinked to the home page. Are you doing something different?
    {{ DiscussionBoard.errors[7607942].message }}
  • Profile picture of the author Istvan Horvath
    OK, I am guessing you want what is called image mapping.

    Google using these keywords: "image maps in wordpress header"
    Signature

    {{ DiscussionBoard.errors[7607964].message }}
    • Profile picture of the author David V
      Originally Posted by Istvan Horvath View Post

      OK, I am guessing you want what is called image mapping.
      Google using these keywords: "image maps in wordpress header"
      Above is your answer.
      It's not a simple hyperlink.
      There is a second option if you can't figure out image mapping.
      Go back to you image editor and export the graphic without that part you want to make "clickable". Then export the part you DO want to hyperlink as a png and then you actually will have 2 images. The first is the main header, the second could be put in a div in the header and positioned where it originally was. (and hyperlinked).
      It may be worthwhile to pay someone a few bucks to do it for you. There are forum members who might do this for you here or on a freelancer site.
      {{ DiscussionBoard.errors[7608040].message }}
  • Profile picture of the author gabbydeb
    Istvan and David,

    Thank you so much for your great help! This is why the Warrior forum is the best! I think I can navigate the waters now! LOL Again thank you! :-)
    Signature

    {{ DiscussionBoard.errors[7608054].message }}
    • Profile picture of the author gabbydeb
      Hello again,

      I just wanted to report SUCCESS! I finished the job I was working on, and made those graphics clickable! Thank you guys for your help!

      Regards,
      Debbie



      Originally Posted by Istvan Horvath View Post

      Image editing basics 101: if you combine 2 or 78 images into ONE single file that you can upload via WP theme header options... there is NO individual graphics there. Just ONE SINGLE graphic file. Period.
      Originally Posted by David V View Post

      This is what the default 2012 header image looks like. It's one image and auto hyperlinked to the home page. Are you doing something different?
      Signature

      {{ DiscussionBoard.errors[7613040].message }}
      • Profile picture of the author David V
        Originally Posted by gabbydeb View Post

        I just wanted to report SUCCESS!
        Glad to hear it, congrats!
        {{ DiscussionBoard.errors[7613046].message }}

Trending Topics