Blogging Tip: Widgets in part of your blog only

Saturday, November 26, 2011

Blogging Tip: Widgets in part of your blog only

  • This site uses affiliate links. Purchasing through these links does not cost you anything additional, but gives us a small referral fee.
  • This is a recreational blog. Although I've done my best to ensure the safety of each activity, clarity of directions, and accuracy of my educational activities; I can in NO way be held liable for your personal use of my material. Please use common sense.
See all disclosures here.
blogging tips
For someone who is code illiterate trying to make your blog look the way you want can be a daunting task! I know because I’m Beth & I’m code illiterate! image
As I was designing my webpage & making it look the way I wanted to I came across this useful information that I wanted to share with you: You can make a widget (think Amazon, buttons, pictures, etc.) appear only on your front page, specific post page, or all post pages. And guess what? It’s SO simple. Here’s how you do it:
  1. ALWAYS back-up your template first!!
  2. Add the gadget as normal.
    (You will have to find the gadget in your blogs html so make sure to give it a unique title.)
  3. In your dashboard Click 'Design' > 'Edit Html' > Tick the 'Expand widget templates' box
imageimage
image
4. Find the gadget in your template (Click Control & F at the same time. Enter name of gadget and click Next)
image
5. The gadget code will look similar to the code below you can see the title xxxxx, the code displayed here is the entire code for the gadget :

<b:widget id='HTML1' locked='false' title='xxxxx' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>

6. Copy the code in red below and add it to the same position in your code. Copy the code in yellow if you want a gadget on a specific post only. If you want the widget to appear on homepage only or post pages only – insert the appropriate code:
  • <b:if cond='data:blog.url == data:blog.homepageUrl'> (Homepage only)
  • <b:if cond='data:blog.pageType == "item"'> (all post pages only)
  • <b:if cond='data:blog.url == "PUT-THE-POST-URL-HERE"'> (specific post page only). Not if you use this you need to replace the PUT-THE-POST-URL-HERE with the URL of the post you want the gadget to be on.

<b:widget id='HTML1' locked='false' title='Recent Posts' type='HTML'>
<b:includable id='main'>
USE ONE OF THE CODES FROM ABOVE  <!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if> </b:includable>
7. Save your template and check to make sure you did it right. Now you can go back in your widget & remove the title if you like.
Cool, huh!


2 comments:

  1. Thanks for sharing. I'm still learning how to do things.

    ReplyDelete
  2. Very cool I totally have problems lol

    ReplyDelete