4
comments
How to Replace Sidebar Widget's Title with an Image
How to replace blogger sidebar widget title with any customize image would be a good hack for so many blogger's. I have noticed that in blogger help forum many of the blogspot users are asking for the help about how they can put an image instead of sidebar title.
suppose you need to put an image Replacing title in your sidebar with image can be very helpful when you want to design your custom design unique blog.
Demo Question asked by: Matthew Floratos
I'm looking to replace the traditional side bar title like "Archives" or "Tags" with images so that I can match the blog's aesthetic with fonts not available to Blogger. I've looked around in the template HTML, but it's a bit above me. Can anybody give be a quick pointer as regards to how I can replace widget names, which are traditionally text, with images? (If it's even possible at all, that is.)
So below here you will find the steps through which you can replace the title of the widget with image and yes answer of the question given above.
Prerequisites: You have already every image which you are going to replace with title text in sidebar.
# Step 1: Go to your Blogger Dashboard and Navigate to Layout > Edit HTML Section and check Expand Widget Templates check box.
# Step 2: Then use "Ctrl+F" to search for id='BlogArchive1' (for Archives gadget).
You may find this set(or something close to this) of codes:
<b:widget id="BlogArchive1" locked="false" title="Archives" type="HTML">
<b:includable id="main">
<b:if cond="data:title != """>
</b:if></b:includable></b:widget>
<h2 class="title">
<data:title></data:title></h2>
# Step 3:
<data:title></data:title>
is your sidebar title data tag and is responsible for display the title text for that widget. To use an image, replace it with your image source URL like this:<img src="YOURI_IMAGE_URL" alt='Image Name' />
# Step 4: Save your template and done :)
Thanks
Daniel :)