How to display widget only On Page Post or Homepage

ErnasLie
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.

Popular post
Screenshot 1 images:acebangsam.us
4. Widget only appear on pages of posts <b:if cond='data:blog.pageType == &quot;item&quot;'> 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 == &quot;item&quot;'>
  <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 == &quot;false&quot;'>
          <b:if cond='data:showSnippets == &quot;false&quot;'>
            <!-- (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 == &quot;false&quot;'>
            <!-- (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.

Widget only appear on hompage
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 + &quot;_ArchiveList&quot;'>
    <b:if cond='data:style == &quot;HIERARCHY&quot;'>
     <b:include data='data' name='interval'/>
    </b:if>
    <b:if cond='data:style == &quot;FLAT&quot;'>
      <b:include data='data' name='flat'/>
    </b:if>
    <b:if cond='data:style == &quot;MENU&quot;'>
      <b:include data='data' name='menu'/>
    </b:if>
  </div>
  </div>
   </div>
</b:if>
</b:includable>


Click save and see the results, good luck


Post a Comment

Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.