Wednesday, August 30, 2017

Maximum Allowed AdSense Ads On A Web Page – 2017 Policy

Maximum Allowed AdSense Ads On A Web Page – 2017 Policy

Link to My Blogger Tricks

Maximum Allowed AdSense Ads On A Web Page – 2017 Policy

Posted: 29 Aug 2017 06:08 PM PDT

Congrats, Google AdSense has lifted its ads limit per page policy!

Publishers can now place unlimited AdSense ads on a web page provided that the total number of AdSense ads or third-party ads must not exceed the visible content.

Maximum Allowed Adsense Ads Units on a page

On a blog post written by SEJ, they have confirmed that Google has removed the ad limit policy:

I spoke with a Google representative this afternoon who confirmed the ad limit has been removed.

AdSense Has Removed "3 Ads Per Page Policy"

If you check the AdSense policy page with the web archives WayBack Machine, you can find that the old ad limit policy section which reads "Ad limit per page" has been replaced with "Valuable inventory" section on the updated ad placement policies page.

Ad limit per page

Currently, on each page AdSense publishers may place:

  • Up to three AdSense for content units
  • Up to three link units
  • Up to two search boxes Publishers may not place more than one "large" ad unit per page. We define a "large" ad unit as any unit similar in size to our 300x600 format.
    • Previously publishers could add 3 AdSense content units and 2 link units. Premium partners could place up to 6 ads units per page, normal publishers could do it only with the help of certified publishing partners such as Ezoic.

    In August 2016 Google updated this policy and now you can place an unlimited number of AdSense ads on a single page with no upper limit.  

    The new Google AdSense Ad Placement policy 2017 is the following:

    Valuable inventory
    Advertising and other paid promotional material added to your pages should not exceed your content. Furthermore, the content you provide should add value and be the focal point for users visiting your page. For this reason, we may limit or disable ad serving on pages with little to no value and/or excessive advertising until changes are made.

    According to the new ad placement policy, there is no limit on the number of ads you can place on a given page which means:

    1. Unlimited Content Units: Publishers can now put more than three AdSense for content ad units on a given page. Content units include all Text + Image ads.
    2. Unlimited Link Units: Publishers can add more than three Link ad units on a single page.
    3. Unlimited Large Units: Publishers can choose to place more than one large ad unit per page. Which means you can show more than one 300x600 ad formats. Large ad units include for example, 300x1050 and 970x250 formats, 750x200 and 580x400 regional formats.

    Conditions To Follow Before Placing AdSense Ads

    There are two strict conditions to follow before placing multiple AdSense ads on a web page. You must follow these restrictions carefully to ensure your AdSense account is not disabled or limited.

    Condition#1: Avoid Excessive Advertising

    Google has explicitly mentioned this policy:

    Advertising and other paid promotional material added to your pages should not exceed your content.

    All your AdSense ad units combined with any third-party Ad network ads (i.e Media.net or BuySellAds, AdClerks) you might be using, should not exceed the length of your visible content.

    Visible content refers to the actual content of your article or blog post, that includes:
    • Images, Text and Videos

    How Can You Know If Ads Exceed Your Content?

    A simple rule of thumb to ensure you never do excessive advertising on your blog is to stick to this formula:

    Total Content Space > Total Ad space

    As long as the total length or space of your visible content is greater than the total space occupied by ads on your site, you are not violating AdSense policy.

    Reverse this formula and you will see a flood of Ads on your site that will not only irritate the website visitors but would also kill the overall user experience, giving a look of a fish market i.e. Ad market!

    How Many AdSense Ads Per Page In 2017?

    Now when there is no restriction on the maximum number of AdSense ad units on a single page, you can wisely place as many ad units on your pages as you want, provided that the total content space is always greater than the total ad space i.e. Ads not exceeding the content.

    Keep these tips in mind, to ensure that the total number of Ads should not exceed content:

    • For a short content i.e. less than 500 words in length, do not show more than 3 Content Ad units on a web page
    • For a long content i.e. between 1000-1500 words, do not put more than 4 Content Ad units on a page.
    • For a very long content i.e. more than 2000 words, do not place more than 6 Content Ad Units per page.

    Placing more than 6 Content units on any lengthy post, will naturally effect user experience.

    So never overdo advertising, even if your content is way too long. Utilize more link units instead of only using content units in longer posts. 

    With too many ads and very short (thin) content, users will simply leave your site and thus leading you to a high bounce rate.

    Nothing causes more harm to any website than low quality content and a bad user experience.

    A content that has little to no value is called low quality content or thin content. Such content is not based on in-depth research and is simply a rewrite/copy/spun of a third-party content for the sole purpose of gaining traffic by spamming search engines.

    Google has warned against sharing such content that has no real value. Such sites are not only black listed in search engines through penalties such as Google Panda, but ad serving is also disabled on such pages as explicitly mentioned in 2017 AdSense ad placement policy:

    we may limit or disable ad serving on pages with little to no value and/or excessive advertising until changes are made.

    Condition#2: Show Only One Ad Above-The-Fold On Mobile Site

    You can show only one Ad above-the-fold on a mobile site but unlimited ads below-the-fold, provided that no two ads may appear on the screen at the same time.

    Although this condition is no more present on the new policy page but it is strictly recommended by Google. Most of my clients receive email notices from Google to remove Ads from above the fold in mobile view.

    This is one reason why I have only shown one link-unit  just below blog title on the mobile responsive version of this blog for smartphone devices.

    Through the WayBack machine, I could extract the following policy guideline by Google:

    Mobile implementations:
    The above ad limits also apply to mobile sites. In addition, two or more AdSense ads may not appear on the screen at the same time on a mobile site. Publishers with sites using responsive website should consider that ad units may shift into non-compliant positions as the site scales across different devices.

    This policy which  clearly mentions that no two ads may appear next to each other at the same time on a mobile screen. More emphasis is given through emails to above-the-fold section that is viewed when the user first enters your site.

    Above-the-fold is the section of your site that is viewed first time on page load before the user starts to scroll down.

    I strongly recommend that you add only one link unit of size 180x90 or 200x90, just below your article title to avoid policy violation applied to mobile views.

    I have tested this AdSense ad spot with a link unit and it has proven to be one my best-performing ad units compared to content units placed at top.

    Note: There are tons of other ad placement rules such as ads in emails, pop-up, iframe etc. that you must follow. In this tutorial we focused on the latest ad limit policy change only.

    Why Did Google Remove its Ad limit Policy?

    For three simple reasons:

    1. AdSense has more competitors today than before such as Media.net ads by Bing and Yahoo. If they don't allow publishers to add more ads, they will simply start displaying Media.net ads to fill empty ad inventories.
    2. To allow publishers to test new Ad Types such as Page-level ads and native ads which includes: In-feed ads, Matched content ads and In-article ads.
    3. To keep advertisers happy: If publishers are allowed to test more ad units, this will encourage more advertisers to invest on AdWords in order to expect a higher return on investment. The previous ad limit policy was not giving much to both publishers and advertisers as far as mobile monetization was concerned. Now publishers can show more ad units allowing the advertisers to experiment with several different ad formats.

    How Many AdSense Ads Per Page Will You Show?

    The removal of all restrictions on the number of ads does sound great but it puts a lot of great responsibility on the publishers. So use this opportunity carefully and increase your ad revenue by following the tips we discussed today.

    I would love to hear your feedback on this pleasant surprise. Do share with us how many AdSense ad units you are currently using on your Wordpress or blogspot blog. Now when Google has lifted the ad limit policy, how many AdSense ads units do you plan to show on a single page?

    Share your thoughts by leaving your precious comments!

    Friday, August 25, 2017

    How to Add Social Media Buttons to Blogger Posts? - Top/Bottom Location

    How to Add Social Media Buttons to Blogger Posts? - Top/Bottom Location

    		Link to My Blogger Tricks

    How to Add Social Media Buttons to Blogger Posts? - Top/Bottom Location

    Posted: 24 Aug 2017 11:01 AM PDT

    In this tutorial you will learn how to add social sharing buttons to each of your blogger posts. These responsive social sharing buttons will stick to the top or bottom of every blog post. It helps your blog visitors to share your content on social media networks without leaving your blog page.

    add social media buttons to blogger posts

    This sharing gadget for blogspot blogs is a lightweight version of JumboShare Counter. I will thus call it JumboShare Simplified. It loads faster and takes up negligible load time. Load time is a major SEO factor and Google will rank you higher in SERPs only if your webpage loads faster and provides a user friendly interface.

    I have created this lightweight sharing gadget by aligning all major social media buttons inside a horizontal row. Users can toggle the gadget to expand or collapse the number of sharing buttons displayed.    

    This gadget includes the following social media buttons:

    1. Facebook
    2. GooglePlus +1
    3. Twitter
    4. LinkedIn
    5. Pinterest
    6. StumbleUpon
    7. Buffer
    8. Viber - Will automatically display in mobile devices
    9. Whatsapp - Auto displayed in mobile devices
    10. Print

    These buttons have the exact same look and style as their official counterparts. It uses the official stylesheet for Facebook, Google, Twitter and the rest.

    social sharing buttons for blogspot blogs

    The viber and whatsapp share buttons will display only in mobile devices such as smartphones. Your visitors can now share your blog posts with their viber contacts and whatsapp friends. I am using IsMobileRequest condition to allow these buttons to display only smartphones instead of using CSS display:none.

    You can choose to display this social sharing gadget just below blog post title or you can display it at the bottom of every blog post. Lets get straight to work.

    Note: If you are using Jumboshare counters plugin, then you will need to remove them first.

    Add Social Media Buttons To Blogger Posts

    Follow these easy steps:

    1. Go To Blogger > Theme > Backup your theme
    2. Click Edit HTML
    3. Search for ]]></b:skin> and paste the following CSS code just above ]]></b:skin>


      /* ##### JumboShare Simplified ####### */
      #MBTshares-wrap{margin:20px 0px;border-top: 1px dotted #eee;padding: 10px 0;border-bottom: 1px dotted #eee;overflow:hidden}
      #MBTshares{display:inline-block;overflow:hidden;text-align:left;white-space:nowrap;font-family:arial;font-size:11px;margin:0px 5px 0; line-height: 1.4em;}
      #horiz{position:relative; padding:0; margin:0;}
      #horiz #MBTshares{position:relative;top:-8px; padding-top:20px;}
      #MBTshares a:hover{text-decoration:none!important;}
      /***Facebook***/
      .mbt-fb{background:transparent linear-gradient(#4C69BA,#3B55A0) repeat scroll 0 0;border:medium none;border-radius:2px;color:#FFF;cursor:pointer;font-weight:700;height:20px;line-height:20px;padding:0 6px;text-shadow:0 -1px 0 #354C8C;white-space:nowrap;text-shadow:0 -1px 0 #354C8C}
      .mbt-fb:focus,.mbt-fb:hover,.mbt-fb:active{background:transparent linear-gradient(#5B7BD5,#4864B1) repeat scroll 0 0;border-color:#5874C3 #4961A8 #41599F;box-shadow:0 0 1px #607FD6 inset}
      .mbt-fb i{padding:2px 2px 0 4px;font-size:11px;color:#3B5998;background:#fff;margin-right:4px;margin-top:3px}
      .mbt-fb:hover, .mbt-fb:visited, .mbt-tw:hover,.mbt-tw:visited, .mbt-linkedin:hover ,.mbt-linkedin:visited{color:#fff!important;}
      /***Gplus, Pinit, Stumbleupon***/
      .mbt-gp{box-shadow:0 1px 0 rgba(0,0,0,0.05);transition:background-color .218s ease 0s,border-color .218s ease 0s,box-shadow .218s ease 0;background-color:#FFF;background-image:none;border:medium none;border-radius:2px;border:1px solid rgba(0,0,0,0.17);color:#262626;cursor:pointer;font-weight:700;height:20px;line-height:20px;padding:0 6px 0 4px;white-space:nowrap}
      .mbt-gp:hover, .mbt-gp:visited{color:#262626!important;}
      #MBTshares .pinit{background:#f9f9f9!important}
      #MBTshares .stumb{background:#f0fafe!important;border:1px solid #cde3ea}
      #MBTshares .stumb:hover{border:1px solid #b7d5df;box-shadow:0 1px 0 rgba(0,0,0,0.1)}
      #MBTshares .stumb i{color:#eb4823!important;font-size:13px!important;margin-top:1px!important}
      .mbt-gp:focus,.mbt-gp:hover,.mbt-gp:active{border:1px solid rgba(0,0,0,0.25);box-shadow:0 1px 0 rgba(0,0,0,0.1)}
      .mbt-gp i{padding:2px 2px 0 0;font-size:11px;color:#DB4437;margin-right:2px;margin-top:3px}
      .mbt-gp .fa-pinterest{padding:0 2px 0 0;font-size:14px}
      #MBTshares .bufferimg{width:15px; margin-top:2px; padding:0 1px 0 0; }
      /***LinkedIn***/
      .mbt-linkedin{transition:background-color .218s ease 0s,border-color .218s ease 0s,box-shadow .218s ease 0;background-color:#0077B5;text-shadow:0 -1px #005887;border:medium none;border-radius:2px;border:1px solid #066094;color:#fff;cursor:pointer;font-weight:700;height:20px;line-height:20px;padding:0 2px 0 1px;white-space:nowrap}
      @media screen and (-webkit-min-device-pixel-ratio:0) {
      .mbt-linkedin{padding:0 5px 0 1px}
      }
      .mbt-linkedin:focus,.mbt-linkedin:hover,.mbt-linkedin:active{border:1px solid #0369A0;background-color:#0369A0}
      .mbt-linkedin i{padding:0;font-size:17px;color:#FFF;margin-right:0;position:relative;left:1px}
      .mbt-linkedin .ibg{background:#0369A0 none repeat scroll 0 0;width:17px;display:inline-block;border-right:1px solid #006095;border-radius:2px;height:20px;padding:0 2px 0 1px;margin:0 2px 0 -1px}
      /**Twtter, Print, Whatsapp, viber**/
      .mbt-tw{position:relative;height:22px;padding:4px 8px 1px 4px;font-weight:700;color:#FFF;cursor:pointer;background-color:#1B95E0;border-radius:3px;box-sizing:border-box}
      .mbt-tw:focus,.mbt-tw:hover,.mbt-tw:active{background-color:#0C7ABF}
      .mbt-tw i{padding:0 0 0 1px;font-size:14px;color:#fff;margin-right:2px;margin-top:0}
      .mbt-o{max-width:100%}
      .mbt-o,.mbtcount-o,.mbt-fb,.mbt-gp,.mbt-linkedin,.mbt-tw,.label,#mbtcount{display:inline-block;vertical-align:top}
      .mbtcount-o{position:relative;min-width:15px;height:17px;text-align:center;padding:1px 5px;margin-left:2px;background:#FFF none repeat scroll 0 0;border:1px solid #e7e7e7;border-radius:2px;display:none!important; }
      #MBTshares .printme {background-color:#333;}
      #MBTshares .printme:focus,#MBTshares .printme:hover,#MBTshares .printme:active{background-color:#000}
      #MBTshares .whatsapp{background-color:#73D40B;}
      #MBTshares .whatsapp i{font-size:15px!important;}
      #MBTshares .whatsapp:focus,#MBTshares .whatsapp:hover,#MBTshares .whatsapp:active{background-color:#65BA09}
      #MBTshares .viber{background-color:#7b519d;}
      #MBTshares .viber:focus,#MBTshares .viber:hover,#MBTshares .viber:active{background-color:#8558aa}
      #MBTshares .viberimg{width:13px; margin-top:0px; padding:0 3px 0 0; }
      #mbtcount{color:#666;white-space:nowrap;text-decoration:none;padding:2px 0 0}
      #mbtcount:hover{text-decoration:none}
      #MBTshares .arrow{height:0;left:-10px;position:relative;top:-15px;width:5px;z-index:2}
      #MBTshares .ext{min-height:18px!important}
      #MBTshares .arrow s,#MBTshares .arrow i{border-color:transparent #e7e7e7;border-style:solid;border-width:4px 5px 4px 0;display:block;position:relative;top:19px}
      #MBTshares .arrow i{border-right-color:#FFF;left:2px;top:11px}
      .share-btn{position:relative;display:inline-block; display:none!important;}
      .share-btn .h2{font-size:30px;font-weight:700;font-family:arial;color:#73D40B;height:31px; line-height: 1.4em;}
      .share-btn .h4{font-size:12px;font-family:arial}


      /*#########Horizontal Switch###########*/
      .switchoff2{display:inline-block;}
      .mbtswitch2{padding:0 15px 0 3px;position:relative;top:-15px;margin:20px 0 0 3px;display:inline-block;max-width:30px;height:20px;cursor:pointer;background-color:#fff;border:1px solid #eee;border-radius:2px;outline:0 none;font:16px fontawesome;color:#ddd}
      .mbtswitch2:hover{color:#73D40B}
      .mbtswitch2 i.active:after{content:'\f067';position:relative;left:7px;top:2px;font-style:normal}
      .mbtswitch2 i.inactive:after{content:'\f068';position:relative;left:7px;top:2px;font-style:normal}
      @media only screen and (max-width:230px) {
      .tcount{border-bottom: 2px solid #74D50C; border-right:none; min-width:100%;}
      #horiz #MBTshares {width: 100%;}

    4. Paste the following code just above </head> inside your template:

      (OPTIONAL STEP) Skip this step if you have already added JQuery and FontAwesome libraries inside your templates.

      <script async='' src='https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
      <link href='http://fortawesome.github.io/Font-Awesome/assets/font-awesome/css/font-awesome.css' rel='stylesheet'/>

    5. Next add the follow jQuery script just above </body> tag

      <script type='text/javascript'>
              //<![CDATA[
              /* ##### FREE JUMBOSHARE SIMPLIFIED #######
      Developed by: www.MyBloggerTricks.com
      Dual licensed under the MIT license and GPL license.
      Copyright (c) 2015-2016 STCnetwork.org
      */
      $(document).ready(function() {
      $(".mbtswitch").click(function(){$(".switchoff").slideToggle();if($(".mbtswitch i").attr("class")==="active"){$(".mbtswitch i").removeClass("active").addClass('inactive')}else if($(".mbtswitch i").attr("class")==="inactive"){$(".mbtswitch i").removeClass("inactive").addClass('active')}});

      $(".mbtswitch2").click(function(){$(".switchoff2").slideToggle();if($(".mbtswitch2 i").attr("class")==="active"){$(".mbtswitch2 i").removeClass("active").addClass('inactive')}else if($(".mbtswitch2 i").attr("class")==="inactive"){$(".mbtswitch2 i").removeClass("inactive").addClass('active')}});
      });
      //]]></script>

    6. Save your template.

    Add Social Media Buttons at Top/Bottom Of Every Blog Post

    add sharing buttons in blogger

    Follow these easy steps to add sharing buttons just below every blog post title or the post footer:

    Inside your theme, search for  <data:post.body/> . This code is located twice, once for mobile view and once for desktop view. Therefore consider the second appearance of <data:post.body/> only.

    Note: If you want to show this horizontal sharing bar below post titles, then paste the following HTML code just above <data:post.body/>   but if you wish to display the sharing bar at bottom of each blog post then paste the following HTML code just below <data:post.body/>

    If you want to display the sharing buttons both at top and bottom of each blog post, then paste the following HTML code once above <data:post.body/> and once below <data:post.body/>.

    <b:if cond='data:blog.pageType == &quot;item&quot;'>

    <div id='MBTshares-wrap'>

    <!--TOTAL-->
    <div class='share-btn tcount' data-service='total'>
            <div class='count h2 anim'/>
            <div class='h4'>SHARES</div>
    </div>
    <span id='horiz'>

    <!--FACEBOOK-->
    <div id='MBTshares'>
    <div class='mbt-o'>
    <a class='mbt-fb' expr:href='&quot;http://www.facebook.com/share.php?v=4&amp;u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' onclick='window.open(this.href,&apos;sharer&apos;, &apos;toolbar=0,scrollbars,status=0,width=626,height=436&apos;); return false;' rel='nofollow' target='_blank' title='Share on Facebook!'><i class='fa fa-facebook'/><span class='label'>Share</span></a>
    </div>
    <div class='mbtcount-o'>
    <div class='arrow'><s/><i/></div>
    <span class='share-btn' data-service='facebook'>
    <span class='count anim' id='mbtcount'/></span>
    </div>
    </div>

    <!--PINTEREST-->
    <div id='MBTshares'>
    <div class='mbt-o'>
    <a class='mbt-gp pinit' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url + &quot;&amp;media=&quot; + data:post.thumbnailUrl + &quot;&amp;description=&quot; + data:post.title' onclick='window.open(this.href,&apos;sharer&apos;, &apos;toolbar=0,scrollbars,status=0,width=626,height=436&apos;); return false;' rel='nofollow' target='_blank' title='Pin it!'><i class='fa fa-pinterest'/><span class='label'>Pin it</span></a>
    </div>
    <div class='mbtcount-o ext'>
    <div class='arrow'><s/><i/></div>
    <span class='share-btn' data-service='pinterest'>
    <span class='count anim' id='mbtcount'/></span>
    </div>
    </div>

    <!--TWITTER-->
    <div id='MBTshares'>
    <div class='mbt-o'>
    <a class='mbt-tw' expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.title + &quot;-&quot; + data:post.url' onclick='window.open(this.href,&apos;sharer&apos;, &apos;toolbar=0,scrollbars,status=0,width=626,height=436&apos;); return false;' rel='nofollow' target='_blank' title='Share on Twitter!'><i class='fa fa-twitter'/><span class='label'>Tweet</span></a>
    </div>
    </div>

    <!--LINKEDIN-->
    <div id='MBTshares'>
    <div class='mbt-o'>
    <a class='mbt-linkedin' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot; + data:post.url' onclick='window.open(this.href,&apos;sharer&apos;, &apos;toolbar=0,scrollbars,status=0,width=626,height=436&apos;); return false;' rel='nofollow' target='_blank' title='Share on Linkedin!'><span class='ibg'><i class='fa fa-linkedin'/></span><span class='label'>Share</span></a>
    </div>
    <div class='mbtcount-o ext'>
    <div class='arrow'><s/><i/></div>
    <span class='share-btn' data-service='linkedin'>
    <span class='count anim' id='mbtcount'/></span>
    </div>
    </div>

    <!--GOOGLE PLUS-->
    <div id='MBTshares'>
    <div class='mbt-o'>
    <a class='mbt-gp' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' onclick='window.open(this.href,&apos;sharer&apos;, &apos;toolbar=0,scrollbars,status=0,width=626,height=436&apos;); return false;' rel='nofollow' target='_blank' title='Share on Google Plus!'><i class='fa fa-google-plus'/><span class='label'>Share</span></a>
    </div>
    <div class='mbtcount-o ext'>
    <div class='arrow'><s/><i/></div>
    <span class='share-btn' data-service='google'>
    <span class='count anim' id='mbtcount'/></span>
    </div>
    </div>

    <!--STUMBLEUPON-->
    <div id='MBTshares'>
    <div class='mbt-o'>
    <a class='mbt-gp stumb' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url' onclick='window.open(this.href,&apos;sharer&apos;, &apos;toolbar=0,scrollbars,status=0,width=626,height=436&apos;); return false;' rel='nofollow' target='_blank' title='Stumble it!'><i class='fa fa-stumbleupon'/><span class='label'>Share</span></a>
    </div>
    <div class='mbtcount-o ext'>
    <div class='arrow'><s/><i/></div>
    <span class='share-btn' data-service='stumbleupon'>
    <span class='count anim' id='mbtcount'/></span>
    </div>
    </div>

    <div class='switchoff2' style='display:none;'>

    <!--BUFFER-->
    <div id='MBTshares'>
    <div class='mbt-o'>
    <a class='mbt-gp' expr:href='&quot;https://buffer.com/add?url=&quot; + data:post.url + &quot;&amp;picture=&quot; + data:post.thumbnailUrl + &quot;&amp;text=&quot; + data:post.title + &quot;&amp;via=stc_network&quot;' onclick='window.open(this.href,&apos;sharer&apos;, &apos;toolbar=0,scrollbars,status=0,width=626,height=436&apos;); return false;' rel='nofollow' target='_blank' title='Share on Buffer!'><img class='bufferimg' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmx9CnsDCCoCECm0znvN4iqYTyBlrsAceIcujSXdkuaua6diaXy9K-7B1c7GWniLkSNstRjkZ4a8EWnc0RBEsRRR49NjQ4OkgHrkNGMQe-oXyjzadLbimTOU9aE2vx6qUNTVXrOB9_4xMs/s1600/logo-icon.png'/><span class='label'>Buffer</span></a>
    </div>
    <div class='mbtcount-o ext'>
    <div class='arrow'><s/><i/></div>
    <span class='share-btn' data-service='buffer'>
    <span class='count anim' id='mbtcount'/></span>
    </div>
    </div>
    <b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
    <!-- WHATSAPP -->
      <div id='MBTshares'>
        <div class='mbt-o'>
          <a class='mbt-tw whatsapp' expr:href='&quot;whatsapp://send?text=&quot; + data:post.title + &quot; &gt;&gt; &quot; + data:post.url' rel='nofollow' target='_blank' title='Share on whatsapp!'><i class='fa fa-whatsapp'/><span class='label'>SMS</span></a>
        </div>
      </div>

    <!-- VIBER -->
      <div id='MBTshares'>
        <div class='mbt-o'>
          <a class='mbt-tw viber' expr:href='&quot;viber://forward?text=&quot; + data:post.title + &quot; &gt;&gt; &quot; + data:post.url' rel='nofollow' target='_blank' title='Share on viber!'><img class='viberimg' src=' https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0BiuLS1sazdwuOAsKZlFIpBnz-wZ_nMc7NWUI_fLOaX-VtaZ-JJBvzwsJYc3tmXq_FSHZj4a0TvqBYfW7QEch20PYB0gL_SIs46cjjwTsuZalpJbpfdyofaAtwYnZtVaL8bxL-IPzsg_N/s1600/Icon_small.png'/><span class='label'>Share</span></a>
        </div>
      </div>
    </b:if>

    <!-- PRINT -->
      <div id='MBTshares'>
        <div class='mbt-o'>
          <a class='mbt-tw printme' href='javascript:window.print()' rel='nofollow' target='_blank' title='Print this page!'><i class='fa fa-print'/><span class='label'>Print</span></a>
        </div>
      </div>

    </div> <!--switchoff-->

    <span class='mbtswitch2'><i class='active'/></span>
    </span>
    </div></b:if>

    Customization Guide:

    • All button locations are labeled for easy readability. You can easily change/swap the locations of button within the widget.
    • Replace stc_network  with your buffer handle or profile username or simply your blog title without spaces.
    • If you wish to display a social media button in mobile devices only then paste its code inside the yellow highlighted tags.
    • All buttons inside the purple highlighted tags will remain hidden when page loads and will be displayed only when the user clicks the +/- toggle button. Buttons will display using this toggle button which we named the switch.
    • If you wish to add more buttons inside the switch then simply copy its code and paste it inside the purple switch tags.
    • To remove buttons from inside the switch, simply copy the button's code and paste it above the switch tag i.e. <div class='switchoff2' style='display:none;'>

    Save your template and you are all done!

    Need Help in Add Sharing buttons in Blogger?

    Let me know if you have any queries. I would love to answer all your questions. More interesting tutorials on its way because I am back to blogging. Peace buddies! =)