Scroll Down and click on Go to Link for destination
Congrats! Link is Generated
How you can display your widget within posts or maybe Homepage. Dev Blog Tutorial subsequent is tips on how to display your widget for the post pages, the home-page or for the page that you want, one example is, we only wish to display it for the post pages or for the homepage. Maybe you 've been see different blogs and discover where the widget is only displayed in certain pages, perhaps because the blog owner's wants or asks from other people who would like to install the widget [for example advertisements widget ].
Follow the steps below
1. Login to your blogger panel admin
2. Click On Template » Edit HTML
3. Then Search widget that you want to change which will display. For example, I just wanted to show my widget Popular Post only on the post pages . Put the following code before the HTML element like this screenshot.
4. Widget only appear on pages of posts |
| Screenshot 1 images:acebangsam.us |
<b:if cond='data:blog.pageType == "item"'> YOUR WIDGET CODE HERE </b:if> Example 1
<b:section class='sidebar' id='tab1-popular-posts' showaddelement='yes'>
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content popular-posts'>
<ul>
<b:loop values='data:posts' var='post'>
<li>
<b:if cond='data:showThumbnails == "false"'>
<b:if cond='data:showSnippets == "false"'>
<!-- (1) No snippet/thumbnail -->
<a expr:href='data:post.href'><data:post.title/></a>
<b:else/>
<!-- (2) Show only snippets -->
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</b:if>
<b:else/>
<b:if cond='data:showSnippets == "false"'>
<!-- (3) Show only thumbnails -->
<div class='item-thumbnail-only'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
</div>
<div style='clear: both;'/>
<b:else/>
<!-- (4) Show snippets and thumbnails -->
<div class='item-content'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</div>
<div style='clear: both;'/>
</b:if>
</b:if>
</li>
</b:loop>
</ul>
</div>
</b:if>
</b:includable>
</b:widget>
</b:section>5. Widget only appear on the home page
<b:if cond='data:blog.url == data:blog.homepageUrl'> YOUR WIDGET CODE HERE </b:if> more details, see the screenshot below. |
| Screenshot 2 images: acebangsam.us |
Example 2
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
</div>
</b:if>
</b:includable>Click save and see the results, good luck