WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Header - Add Hyperlink to Logo (21 posts)

  1. rob26r
    Member
    Posted 1 year ago #

    In the banner of my Canyon theme I would like to make my "Brew City Auction & Pawn" a hyperlink back to my home page. My web site is http://www.brewcityauctionpawn.com. So I was watching a tutorial from the youtube video (http://www.youtube.com/watch?v=HV0gaIMaX9A) but I am lost because my Canyon theme Header.php file does not have the code he is referring to in his video. The relevant part of the video that contains the code starts at 5 minutes and 45 seconds.

    I can get the code (either HMTL or CSS) from the image-map web site but I don't know where to paste it. Any thoughts?

    Thanks.

    Rob

  2. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    It sounds as though you'll need to make a Child Theme if you haven't already. Have you?

  3. rob26r
    Member
    Posted 1 year ago #

    I am using a child theme.

    The CSS code from image-map is:

    <style type="text/css">
    dl.image_map {display:block; width:946px; height:201px; background:url(http://www.image-maps.com/uploaded_files/3201212311202544_BCAP%2012%2030.jpg); position:relative; margin:2px auto 2px auto;}
    a.LINK0 {left:10px; top:10px; background:transparent;}
    a.LINK0 {display:block; width:600px; height:0; padding-top:154px; overflow:hidden; position:absolute;}
    a.LINK0:hover {background:transparent; border:1px dashed black; color:black;}
    a.BLINK {left:942px; top:197px; background:transparent;}
    a.BLINK {display:block; width:202px; height:17px; overflow:hidden; position:absolute; font-size:0px;}
    a.BLINK:hover {background:black; border:1px dashed white; color:white; font-size:9px;}
    </style>

    <dl class="image_map">
    <dd></dd>
    <dd>Mapped @ Image Mapper</dd>
    </dl>

    <!-- Image map text links - Start - If you do not wish to have text links under your image map, you can move or delete this DIV -->
    <div style="text-align:center; font-size:12px; font-family:verdana; margin-left:auto; margin-right:auto; width:946px;">
    Untitled
    | Image Map
    </div>
    <!-- Image map text links - End - -->

  4. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Does it need to be an image map, i.e will there be more than one link?

  5. rob26r
    Member
    Posted 1 year ago #

    I am using image map because I thought it was the easiest way. Yes I will have more than one link at some point.

  6. rob26r
    Member
    Posted 1 year ago #

    I am open to trying other methods...

  7. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    It looks like you ought to put your image map code below this;

    <div id="head-wrap" class="head-wrap-bg">

    but above this

    <div id="head-text">

    If you haven't got your header.php file within your Child Theme already,
    - Make a copy of header.php from your theme
    - Move it to your Child Theme directory
    - Edit the header.php file from within the Child Theme

  8. rob26r
    Member
    Posted 1 year ago #

    Odd - I don't see the code you have referenced in my header.php file that I copied over to my child theme.

    I see:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
    <head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="<?php bloginfo( 'html_type' ); ?>; charset=<?php bloginfo( 'charset' ); ?>" />
    <title><?php wp_title( '|', true, 'right' ); ?><?php bloginfo( 'name' ); ?></title>
    <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
    <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
    <?php wp_head(); ?>
    </head>
    <body <?php body_class(); ?>>
    <div class="container_main">
      <div class="container_12">
        <?php get_template_part( 'custom', 'header' ); ?>
        <?php get_template_part( 'primary', 'menu' ); ?>

    [please mark any posted code - http://codex.wordpress.org/Forum_Welcome#Posting_Code ]

  9. rob26r
    Member
    Posted 1 year ago #

    I found something similar in my custom-header.php.

    Maybe it goes somewhere here?

    <?php
    $header_textcolor = get_header_textcolor();
    if( ( !empty( $header_textcolor ) && $header_textcolor != 'blank' ) ):
    $head_wrap_bg_class = ( get_header_image() )? 'head-wrap-bg' : '';
    ?>    
    
    <div class="grid_12">
      <div id="head-wrap" class="<?php echo $head_wrap_bg_class; ?>">
    	<div id="head-text">
    	  <span class="site-name"><a>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></span>
    	  <span class="site-description"><?php bloginfo( 'description' ); ?></span>
    	</div> <!-- end of #head-text -->
      </div> <!-- end of #head-wrap -->
    </div>
    <div class="clear"></div>
    
    <?php
    elseif( get_header_image() ):
    
    if ( function_exists( 'get_custom_header' ) ) {
    
    	$header_image_width  = get_custom_header()->width;
    	$header_image_height = get_custom_header()->height;
    
    } else {
    
    	$header_image_width  = HEADER_IMAGE_WIDTH;
    	$header_image_height = HEADER_IMAGE_HEIGHT;
    
    }
    ?>
    
    <div class="grid_12">
      <div id="head-wrap">
    	<div id="head-image">
    	  <a>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><img src="<?php header_image(); ?>" width="<?php echo $header_image_width; ?>" height="<?php echo $header_image_height; ?>" alt="<?php bloginfo( 'name' ); ?>" /></a>
    	</div> <!-- end of #logo -->
      </div> <!-- end of #head-wrap -->
    </div>
    <div class="clear"></div>
    
    <?php endif; ?>

    [please remember to mark any posted code - the above code is corrupted - http://codex.wordpress.org/Forum_Welcome#Posting_Code ]

  10. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Yes, near the top of the code you should find the code I referenced prior to this post.

  11. rob26r
    Member
    Posted 1 year ago #

    Andrew - Thanks for you help so far. Almost there I think.

    The good news is that the hyperlink is working but I have 2 headers. Any thoughts on how to adjust this?

    Below is the code:

    <?php
    $header_textcolor = get_header_textcolor();
    if( ( !empty( $header_textcolor ) && $header_textcolor != 'blank' ) ):
    $head_wrap_bg_class = ( get_header_image() )? 'head-wrap-bg' : '';
    ?>

    <style type="text/css">
    dl.image_map {display:block; width:946px; height:201px; background:url(http://www.image-maps.com/uploaded_files/3201212311202544_BCAP%2012%2030.jpg); position:relative; margin:2px auto 2px auto;}
    a.LINK0 {left:10px; top:10px; background:transparent;}
    a.LINK0 {display:block; width:600px; height:0; padding-top:154px; overflow:hidden; position:absolute;}
    a.LINK0:hover {background:transparent; border:1px dashed black; color:black;}
    a.BLINK {left:942px; top:197px; background:transparent;}
    a.BLINK {display:block; width:202px; height:17px; overflow:hidden; position:absolute; font-size:0px;}
    a.BLINK:hover {background:black; border:1px dashed white; color:white; font-size:9px;}
    </style>

    <dl class="image_map">
    <dd></dd>
    <dd>Mapped @ Image Mapper</dd>
    </dl>

    <!-- Image map text links - Start - If you do not wish to have text links under your image map, you can move or delete this DIV -->
    <div style="text-align:center; font-size:12px; font-family:verdana; margin-left:auto; margin-right:auto; width:946px;">
    Untitled
    | Image Map
    </div>
    <!-- Image map text links - End - -->

    <div class="grid_12">
    <div id="head-wrap" class="<?php echo $head_wrap_bg_class; ?>">
    <div id="head-text">
    <span class="site-name">" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></span>
    <span class="site-description"><?php bloginfo( 'description' ); ?></span>
    </div> <!-- end of #head-text -->
    </div> <!-- end of #head-wrap -->
    </div>
    <div class="clear"></div>

    <?php
    elseif( get_header_image() ):

    if ( function_exists( 'get_custom_header' ) ) {

    $header_image_width = get_custom_header()->width;
    $header_image_height = get_custom_header()->height;

    } else {

    $header_image_width = HEADER_IMAGE_WIDTH;
    $header_image_height = HEADER_IMAGE_HEIGHT;

    }
    ?>

    <div class="grid_12">
    <div id="head-wrap">
    <div id="head-image">
    " title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><img src="<?php header_image(); ?>" width="<?php echo $header_image_width; ?>" height="<?php echo $header_image_height; ?>" alt="<?php bloginfo( 'name' ); ?>" />
    </div> <!-- end of #logo -->
    </div> <!-- end of #head-wrap -->
    </div>
    <div class="clear"></div>

    <?php endif; ?>

  12. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Sorry, I'm not sure what you mean by "2 headers".

  13. rob26r
    Member
    Posted 1 year ago #

    My default header is set to nothing. Figuring the code would set the header. If you see my site I have the blank header and the header from the code. http://Www.brewcityauctionpawn.com

  14. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    I think I follow you. You may resolve this by adding;

    #head-wrap {
     display: none;
    }
  15. rob26r
    Member
    Posted 1 year ago #

    I am guessing I would enter this on the style.CSS or at the bottom of the custom header?

  16. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Yes, your guess is correct for the style.css file. Make sure you edit the style.css file within your Child Theme directory and not the original theme directory.

  17. rob26r
    Member
    Posted 1 year ago #

    I pasted the code in the child theme style.css section and it did not work. Hmmmm.

  18. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Then my assumption that you wanted the blank header removed was wrong.
    Can you re-explain what you want?

  19. rob26r
    Member
    Posted 1 year ago #

    Never mind - something wrong on my side. Thank you so much Andrew!!!

  20. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Thanks rob26r for taking the time to post your WordPress problem here.
    You've helped out others who are experiencing the same issue as you.

  21. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Also, could you mark your thread resolved? You'll help more people.

Topic Closed

This topic has been closed to new replies.

About this Topic