Blogging Tip: Widgets in part of your blog only


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!
<
Unknown
Unknown

Beth Gorden is a homeschooling mother of six who strives to enjoy every moment with her kids through hands-on learning, crafts, new experiences, and lots of playing together. Beth is also the creator and author of 123 Homeschool 4 Me where she shares 1000+ free printables, creative homeschool lessons, crafts, and other fun ideas to help preschool and homeschooling families have fun while learning and exploring together.