Join Our 1500+ Community Readers

We hate spam as much as you!

Add Stylish Whatsapp Smileys/emotions to Your Blogger Posts and Comments

Social media network playing vital role on mobile platform where mobile users are connecting to their friends and sharing information and posting views on social media platform.

Whatsapp one of the favorite social media network for mobile users, every time while connecting to Whatsapp subscribers interests to share latest information to receive good comments along with expression views in the form of smileys/emotions.

If you’re attracted and addicted in using Whatsapp smielys/emotions and to share the same on blogger blog for commenting purpose for your subscribers then here we present you blogger trick for adding the same to your blogger blog.

Flat design trend rules this internet era, then why should you lay down in old design trends? Maximum number of Whatsapp users says smileys/emotions of Whatsapp are very powerful to express views in exactly what they feeling.
In this article we educate you how to add Whatsapp smileys to blogger posts and comments easily.

First Step
Sign into your blogger blog and from Blogger Dashboard
Select Template from drop down list
Click Edit HTML tab
Note: Before you implement this experiment to your blog better to backup template if anything goes wrong you can reload it again.

Now Search for code </body>
After finding code copy the below code and paste above to it
<script src=''/><a style='display:none;' href='' >bloggerwidgets</a><script type='text/javascript'>//bloggersmileys.init();</script>

Successful adding script to code to your blogger blog ‘Save Template’
Your blog is almost ready to show after completing next process

Step Second
Now search for code
<div class='post-footer-line post-footer-line-3'> or <div class='post-footer-line post-footer-line-3'/>

After finding code you can see </b:includable> copy the below code and paste above to it
For example after </div> ending code and before </b:includable>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
                                <div class='noopsmile' id='noopsmile' style='background-color:#E0F7FF;background:#eee; border-radius: 7px;width:634px; padding:10px; border:1px solid #ddd'>
<img src=''/><a style='display:none;' href='' >bloggerwidgets</a><div align='right' id='close' style='font: bold 13px arial;margin-top: -14px; cursor: pointer;'> Close [x] </div></div><div id='open' style='background-color:#eee; border-radius: 7px; padding:10px;width: 87px;cursor: pointer;display:none;left: 582px;position: fixed;top: 1%;z-index:999;font-weight:bold;'> Open Smileys </div>

Final step
Search code

After find the above code copy the below code and paste before to it
.post-body img.noops-smly {
  padding: 0 !important;
  margin-top: -2px !important;

That’s it you’ve done, now view your experiment after saving Template.
If you really enjoyed our article don’t forget to subscribe to us.
code credits netoops

Create a Full Width page in blogger blog Escape Sidebar

Blogger authors can easily create Full width page on their blog.

Do you think creating a full width page on blogger blog is useful or not. This question arise when there is no use of such full width page on  blog when it comes to inserting tables or creating a special 404 page or contact page or advertise on this blog etc., this type of page is necessary.
When visitors experience any post without sidebar with full width page looks your template more professional.
Here in this tutorial we present you different method of creating a Full Width page for blogger blogs without any hardwork. Removing sidebar to make your blogger page makes your template more stylish and attracts a lot of visitors. Let’s begin the tutorials
Sign into Blogger account
Pre-decide which page you want to create full width page to make visitors more convenient to read your article.
After completing your blogger post --> click on ‘Post HTML Tab’ on the top of the post
Copy the below code and paste it bottom of the page i.e above </div>
#kosidebar-wrapper, #midsidebar-wrapper, .gapad2, .blog-pager, .post-header-line-1, .post-footer { display:none !important;} #main-wrapper { width:98%!important;} .post { width:98%!important; }

Using of percentage for full width page i.e 98% is good for better view on mobile template.

After adding it successfully in your post, ‘Save or Publish post’ then preview your post how it looks. Very nice you’ve done it, your experiment is successful to make further more full width pages for your visitors.

If you’ve decided remove or not to show Titles from a certain page, then paste the below code above to </style>. Bots and crawlers will continue to fetch your title, subscribers, visitor won’t view them due to CSS coding effect.
.post-title, .post-labels, post-icons, post-author {display:none!important;}

Author Words:
Dear Reader, if you’ve enjoyed our article don’t forget to subscribe to us and we need your valuable feedback. We always respect your suggestions and views using comment box on this blog.

Online Best recommended Free Newspaper Blogger Templates

Free Download Professionals suggested Newspaper Blogger Templates for your blog.
Every one knows blogger is the only one platform for every author to edit their template in their own way to personalize its appearance for increasing traffic online. Here few best chosen blogger templates for the year 2015 having excellent responsive blogger template, good style, inspired from wordpress themes for blogger users.

If you’re searching for Blogger free Newspaper magazine styled templates then here few ones, we believe that you definitely like these templates for your blog. Lots of blogger newspaper magazine styles templates are available if you browse online but to what extent they’re responsive and increase your blog traffic and enhance your blog subscriber base? Its depends on template that you’ve installed and converting into responsive to users well in smartphones devices also.

RealMag Newspaper Blogger Template
Three column newspaper blogger template has light weight which makes visitors not to stay more time for loading your page (it depends on your blog widgets that you’ve installed). This template is designed for news making articles in responsive style.

Modern Mag Newspaper Blogger template
Stylish, News scrolling, slider with attractive tab Modern mag template is one of the best template for bloggers. This template works especially for entertainment, news blogs/websites run content having right positioned Adsense slot for good ads.

Sleekify Magazine Responsive blogger template
Grid view posts two column blogger template is fully responsive with slider. Sleekify magazine blogger template arrange your content in grid view and simple menu for content categorizing.

Easy News Responsive Free Blogger template
Most of the online authors are installed this template for their blogger blogs for easy news presentation to engage visitors. Easy news blogger template comes with two column having sidebar at left and right both sides designed for news in a magazine style.

Portify News magazine Blogger template
Fast loading and light weight blogger template best for news designed in magazine style. Portify is well developed layout template having friendly admin area to experience control content.

Techify Magazine style Free blogger template
Another grid view magazine styled premium blogger template comes with social media icons embedded at top right of template to attract visitors. Controlled view content can attract visitors rate and social subscribers base.

Beautiful 3 Free Responsive ecommerce templates for your Online Store

Download Free responsive templates for your Online stores.
Now the trend is moving towards installing responsive templates for access of websites/blogs on smartphones i.e mobiles, tablets and iphones.

Choosing and developing responsive templates according to the requirement of blog content is significant for authors. Here in this article we share few ecommerce responsive templates to keep your visitor engaged to browse more category items on your blog/website through mobiles.
Making you blog into responsive is increasing traffic to your blog/website.
Templates here shared one by one are totally free, download and enjoy.

Polish Shop eCommerce Template

The name only indicates it’s a neatly polished ecommerce template which is designed in responsive compatible with all the gadgets. Polish Shop Premium Responsive HTML template is a clean with great match for every online stores.

Demo   Download

Things for Cuties a fully responsive specially designed for Kids store. Perfectly suits for kids online store comes with option UNICEF donation button whenever sales is generated ask buyers to donate for children development organization UNICEF.
adfIt is build on HTML5/CSS3 with 15 layered PSD files, matching newsletter template, fully working OpenCart and Zencart.

 Demo   Download

Nicole Shop another powerful responsive ecommerce template comes with 4 home sliders and editable captions. Available in multicolor styles and compatible with cross browsers.
Demo   Download

For Faster Page Loading Switch to Adsense Asynchronous Ad Code

Google launched its new version of Adsense Ad Javascript Code Asynchrounous to improve users page speed. If the webmasters are still using the Old version Synchrounous Adsense Ad Javascript code then it is better to replace it with new version of Adsense Ad Javascript Code Asynchronous to improve your blog loading speed. Most of the Techblogger are implemented on their blogs/websites if you want to improve your subscribe base or traffic then switch to Asynchronous JS code.

If you've added Older version Google Adsense code after phrasing now replace it with new version code by using Google Adsense code Converter.
To overcome Google Adsense Ads loading problems users can migrate to new Adsense Ad Javascript Asynchronous version. Google Adsense new version renders user experience and enhances web page loading without blocking other parts of your web page from loading.
100% approve Your Google Adsense Account easily 
Make money from your bed
Display Ads middle of blogger posts

Here in this article we educate you better and easy way How to implement or migrate to new version, let’s start step by step.
Step One

Sign into your Blogger account
From Blogger Dashboard select ‘Template Link Tab’
Click on ‘Edit HTML’
Search for code </head> or <head>
Copy the below code
<script async='async' src=""></script>

Paste it before </head> or after <head>
Note: You need add this once only inspite of you’ve multiple ads
Step Two

Sign into your Google Adsense Account
Click on ‘My Ads’ link tab
Click on any beneath Ad Unit size (You want to replace with older Ad code with new Ad code) ‘Get Code’ link (As shown in the image below)

Now Select ‘Asynchronous’ option (Automatically its shows new version Ad code)

The Older and New code looks like this

Old Version Synchronous Javascript Code
<script type="text/javascript"><!--
google_ad_client = "pub-XXXXXXXXXXXXXXXX";
/* 300x250, created X/XX/XX */
google_ad_slot = "XXXXXXXXX";
google_ad_width = 300;
google_ad_height = 250;
<script type="text/javascript"

New Version 'Asynchronous' JavaScript Code
<script async src="//"></script>
<!-- 300x250, created x/xx/xx -->
<ins class="adsbygoogle"
(adsbygoogle = window.adsbygoogle || []).push({});

Copy the New version Asynchronous Javascript code code to Note pad file
Replace Older version Adsense Ad Javascript code with New version code
You can practice to other Ad units using same method.

Author words:
If you really enjoyed with our article don’t forget to subscribe to us.
We always appreciate your feedback and suggestion. Thanks.

It’s necessary to display blogger desktop template on Mobile device?

Major brand mobile manufacturers launching advanced features enabled Smartphones in the market. In view of this smartphone user usage of internet has increased visiting lots of websites related to education, blogging, shopping and news etc.

Website owners if they’ve not installed right responsive blogger template for their blog then it is difficult to show all the information provided not be useful. Visitors may not watch all the information whatever you’ve provided not viewable on mobile devices because visitors have to spend log of time or template will take much time to load on mobile device.

Mobile device may not show your valuable Adsense ads on mobile devices installed on Desktop template.
Blogger by default show its mobile template unless you don’t enable desktop template on mobile phone.
To show all the options on your desktop template on mobile devices simply disable mobile template on blogger.

Reasons are to disable mobile template on blogger?

Visitors can experience all the features thus you’ve provided on desktop template
To display Adsense Ads on mobile device you’ve to disable mobile template option blogger.
To increase your social subscribers base through mobile device
Readers easy search option to view more articles 

Way to disable Blogger Desktop Template on Blogger Mobile template?

Sign into your blogger account
From Blogger Dashboard Select Template
Under template option you can view Desktop template options and Mobile template option (as shown in the image below)

  • Click on ‘Gear’ icon below the mobile template
    Under Choose mobile template option 
  • Select ‘No Show desktop template on mobile devices’ (as shown in the image below).
Now Click on ‘Save’ the button right side below
That’s it you’ve done.

Trick to Prevent Embedding Your Website inside an Iframe by Others

Most of you are familiar with basic HTML coding and its advantages for maintaining a website or blog. HTML IFRAME is a very common thing that be used for embedding any document or webpage into your website.
Here in this article we educate you ‘How to prevent an HTML IFRAME’ code for embedding your website or blog by others in their website or blog inside an IFRAME? Universally lots of websites or blogs embed popular websites in IFRAME for content to increase their traffic and visibility online. If you’re a IT professional then you know very well about script coding if you’re not then here is the code to prevent others to embed your website in IFRAME. Without prior permission from the Author most the websites are using embed code to insert website in IFRAME.
Let’s begin tutorial with the help of Script code you can prevent to embed your website by others.

Sign into your blogger account
From dashboard select Template link and proceed
Click on ‘Edit HTML’ link tab
(Note: Before you implement this experiment better backup your template if anything goes wrong you can reuse it again)
Search for tag </head>
Now Copy the below script code and paste before </head>
<script type="text/javascript">
function noiFrame() {
try {
if ( !== window.self) {
document.write = ""; = window.self.location;
setTimeout(function() {
document.body.innerHTML = '';
}, 0);
window.self.onload = function() {
document.body.innerHTML = '';
} catch (err) {
After successful adding coding ‘Save the Template’
That’s it you’ve all done
Author's Note:
If you really enjoyed our article don’t forget to subscribe to us…. Leave your feedback we always appreciate your views.

Add Labels Widget to show each label in different attractive colors for blogger blogs

Varieties of labels widgets are available online with simple, animated, single colors etc. but visitors when visits any blog/website attracts with arrangement of widget and their customization.
Most the webmasters are aware of that and every time they try to show something different to their subscribers presenting professionalism. Here in this tutorial we educate you about how to convert your labels widget to show in different attractive colors for each label. Let’s begin tutorials for adding this simple code, webmaster don’t work hard for adding this code to their blog/website just follow our step by step procedure.

Step 1
Sign into your blogger account
From Blogger dash board select ‘Layout’ link and proceed
Note: Before you implement this on your blog/website just backup your template, if anything goes wrong you can reuse it again.
Click on ‘Add a Gadget’ link tab and select ‘Labels’ widget and Save your template
Browse More Related Posts
More News...
Step 2
Select to click on ‘Template’ link
Click on ‘Edit HTML’ link tab
Now search for tag

After find this tag copy the below code and paste above to it

/******Color label widget by****/
    <div>.sidebar .label-size {
      position:relative; text-transform:uppercase;
      font-size:13px; font-family:Arial;
    .sidebar .label-size a {
      padding:8px 10px;
      margin:0 6px 6px 0; float:left;display:block;
      transition: all 0.4s ease-in-out;}
    .sidebar .label-size-1 a {background:#1abc9c;border-bottom:3px solid #127F69;}
    .sidebar .label-size-1 a:hover {background:#16a085;}
    .sidebar .label-size-2 a {background:#3498db;border-bottom:3px solid #226693;}
    .sidebar .label-size-2 a:hover {background:#2980b9;}
    .sidebar .label-size-3 a {background:#2ecc71;border-bottom:3px solid #1F8C4C;}
    .sidebar .label-size-3 a:hover {background:#27ae60}
    .sidebar .label-size-4 a {background:#9b59b6;border-bottom:3px solid #74398E;}
    .sidebar .label-size-4 a:hover {background:#8e44ad}
    .sidebar .label-size-5 a {background:#e74c3c;border-bottom:3px solid #922C20;}
    .sidebar .label-size-5 a:hover {background:#c0392b}
<div class="separator" style="clear: both; text-align: center;"><a href="" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
/******Color label widget by*********/

After successful adding the above code, Click on ‘Save template’
Now preview your template to watch experiment.
That’s it you’ve done.

Earn online with Google Adsense Ads on Wordpress blogs inserting code inside post content

In our earlier posts on this blog discussed about How to insert Google Adsense Ads on Blogger on blogs? in middle of the content using small CSS code.

Here the same method Wordpress users now can insert ads inside posts or in between two paragraphs of the content post. Popular website authors suggest that Wordpress platform is best for its themes but difficult in theme improvisation and Blogger blogs were earning sources of authors with Google Adsense where users can insert ads anywhere in the blogger blogs templates are friendly to users.

This article is special for Wordpress users and here we educate you How to insert Ads in Wordpress template inside of the content posts. Webmasters don’t need to work hard for adding this plugin to their Wordpress theme its easy and most of the Wordpress users are running on their blogs successfully.

Sign into your Wordpress account
From Wordpress Dashboard click on Plugins -- > Add New
In Search Plugins box type as Insert Post Ads and Go

Click on Install Now link and activate it.
Under Post Adverts Click on Add New above settings link

(To get code directly or for manual installation follow the below link )
Now write Advert Title and paste the below code. Select the number of paragraph where you wish to display ads follow Publish button to activate.

Go to Post Adverts -- > Settings under option ‘Where do you want ads to display? choose your styles as mentioned in the image below eg. Posts, pages, forums, topics, replies to display your ads and click on ‘Save settings’ button.

Trick to insert Ads inside content without using plugins

In this method users don’t need to apply plugins, without using any type of plugins.
Sign in to your Wordpress account
From Wordpress Dashboard Click on Appearance -- > Editor

Click on Theme’s function.php located at right sidebar
Now Copy the below code and paste it on Editor panel

//Insert ads after second paragraph of single post content.
add_filter( 'the_content', 'prefix_insert_post_ads' );
function prefix_insert_post_ads( $content ) {
$ad_code = '<div>Your Ads Code Here</div>';
if ( is_single() && ! is_admin() ) {
return prefix_insert_after_paragraph( $ad_code, 2, $content );
return $content;
function prefix_insert_after_paragraph( $insertion, $paragraph_id, $content ) {
$closing_p = '</p>';
$paragraphs = explode( $closing_p, $content );
foreach ($paragraphs as $index => $paragraph) {
if ( trim( $paragraph ) ) {
$paragraphs[$index] .= $closing_p;
if ( $paragraph_id == $index + 1 ) {
$paragraphs[$index] .= $insertion;
return implode( '', $paragraphs );

After successful adding code in Editor panel, click on Update file button
Code Customization

  • Change ‘Your Ads Code Here’ with your ad code
  • Replace 2 with your choice value of paragraph to display ads
 Authors Words
If you really enjoyed with our Article then don't forget to Subscribe to US. We always respect your valuable feedback.

About Me

My Photo
Krishi Omli
Dedicated blogger - Always endeavor to know new things and share with others.
View my complete profile

Money Tariff

All Your Tech Needs

How to Help us?

If you feel our blogging Tutorials helped to you, then help us to spread our voice by using the below badge:-


Try a Back Links

Total Pageviews

| Blog Tariff | Blogger Tricks | Blogging Tips | SEO | Earn Money | Blogger Templates © 2009. All Rights Reserved | Template Style by Blog Tariff .com | Design by Brian Gardner | Back To Top |