How to make header logo clickable? - html

Question

Please give me instructions how to fix some Blogger codes. I just made an image logo and put it beside my blog title (behind title and description/using awesome template). I got successful making the blog title clickable, but no success in finding how to make the image logo clickable. I also tried putting my URL in
<div id='header-inner'>
<a expr:href='data:blog.homepageUrl' style='display: block'>
still not changing.
I tried changing it in the Chrome console using this code it worked, but I don't know how to fix it in the source html.
<a href="#">
<div id="header-inner
</a>
I inspect the page and tried some CSS codes but only made me more confused. Please give me some instructions how to fix...Big big thanks to all.
<div id='header-inner'>
<a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:height='data:height'
expr:id='data:widget.instanceId + "_headerimg"'
expr:src='data:sourceUrl' expr:width='data:width' style='display:
block'/>
</a>
<b:if cond='data:imagePlacement == "BEFORE_DESCRIPTION"'>
<b:include name='description'/>
</b:if>
</div>
</b:if>
<b:else/>
<div id='header-inner'>
<div class='titlewrapper'>
<h1 class='title'>
element.style {
background-image: url(//3.bp.blogspot.com/-
yjBU04mgpNw/W0l9tFJDjEI/AAAAAAAADRw/-
uOagCGc3cIhBSJsH3Zl4RetnKK_iuhUQCK4BGAYYCw/s1600/101bloggertips-logo.png);
background-position: left;
width: 120px;
min-height: 37px;
_height: 37px;
background-repeat: no-repeat;
}

Answer 1

You can add a div element to specifically target a smaller zone around your image and not the whole header.
Try replacing :
<a href="#">
<div id="header-inner
</a>
With :
<div class="header-inner>
<div class="logo-container">
<a href ="#">
<img src="Your image url" class ="logo_header" alt="My Logo">
</a>
</div>
</div>
Then you can add some css using your logo_container and logo_header classes as follow :
.logo_container {
width:200px;
height:auto;
display: block;
margin-left:auto;
margin-right:auto;
margin-bottom:60px;
}
.logo_header {
width:200px;
height:auto;
}
Hope it helps !