How to add a link to background image in twenty eleven?

  • grafgo

    (@grafgo)


    11 years, 7 months ago

    Hi, I can find the answer anywhere… Does anyone know the answer?

    I replaced the search box with a logo in my twenty eleven child. it needs a link. Pretty basic.

    Where do i put the html link code that is attached to my logo? I looked in the header.php but I can’t seem to place it on the right. Only the left of the header.

    At the bottom left of this page, the logo has a link, but i would like to add the same link to the same logo on the top right of the page header.

    this is the css:

    #branding #searchform {top: 4.8em;} /* moves search down slightly */
#branding hgroup {
background: url(“images/open2.jpg”);
background-repeat: no-repeat;
background-position: 100% 0px;
}

    and the html:
    <p><a href="http://swiftpaymentinc.com/contact-2/" title="Open a Merchant Account" id="merchant-logo">Open a Merchant Account</a></p>

    I really need help on this one..

    Pierre

Viewing 2 replies - 1 through 2 (of 2 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 7 months ago

    Background images cannot be linked, they are not HTML elements.
    You need to replicate the height and width of the elements you want hyperlinked, to the hyperlink surrounding it.
    E.g

    #branding a.headings {
 display: block;
 height: 150px;
 width: 400px;
 /* test border */
 border: 1px solid red;
}

    You can add a border: 1px solid red; to actually see your hyperlink in action. Try and get the hyperlink to cover the area you want linked.

    Display block resource
    http://www.w3schools.com/cssref/pr_class_display.asp

    Thread Starter grafgo

    (@grafgo)

    11 years, 7 months ago

    In my case I have display none on: #branding and #searchform

    Maybe this is why this fix doesn’t show a red border? I added it to my style.css but it changed nothing.

    I admit I feel more lost now. where is it that I can add the link to or install this block in the right side of the header, in place of the search form where my logo is?

    Thank’s for your patience..

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to add a link to background image in twenty eleven?’ is closed to new replies.