Oct 3, 2016

Create Specific Label Sitemap Page with Featured Thumbnail for Blogger

data:blog.title
If everything is perfectly organized on your blog or site, then all posts and pages of your blog can be easy to reachable for readers and accessible to crawlable for search engines. So, today in this post I'm here with specific label sitemap widget for your Blogspot blog, which will not only help your readers to be easy to navigate every post of the particular label but also assist you to fast index your blog post on Google.

Specific Label Sitemap, Particular Label Sitemap, Sitemap Page With Specific Label

Live Demo

The Major Benefits Of Specific Label Sitemap Page


Here are essential profits to adding a specific label sitemap on a particular static page of your blogger blog.

  1. The particular label sitemap widget will increase Page Rank of your blog.
  2. Increase Internal Linking Strength of your blog.
  3. It will help you in increasing crawl rate of your blog.
  4. It will assist you in gaining page views of your blog.
  5. Specific label sitemap widget helps you to reduce bounce rate of your blog.
  6. Help your readers to view and easy to navigate your all blog post contain wth specific label.


Must Read - Warning! Blogging is Not For You If You Don't Have These Qualities.

Qualities Of Particular Label Sitemap


The main qualities of this widget listed below;
  1. Handpicked design.
  2. Designed With The Help Of JSON feed and CSS Language.
  3. Show all posts from a particular label.
  4. Featured Image Visible On Each Post.
  5. Read More Link, Showing Number Of Comments and date of publishing.
  6. Mobile Responsive design.
  7. Unique Look, Never Seen Before!

So now let's get straight to work, but before, As usual, I always advised you all to never change any code before keeping backup your template because if you accidentally missed placed the codes, you can restore the template and save yourself from a big issue.

How To Create Sitemap For Specific Label?

Do you know, the default label link of blogger platform is invaluable for search engines? Yes, They only used to categorized your posts. In BlogSpot, Labels in place of the category.

If you ever checked the robots.txt file of your blogger blog, then you will be aware of the true but dangerous fact that by the default setting of blogger, label links are disallowed for search crawlers to index.

Don't Ignore - 10+ Useful Blogger Widgets For BlogSpot Blogs.

I know you're very smart to think, If the link blocked for search crawlers, then what's the benefits you're getting to use that link to internal linking.

To get rid of this biggest issue, Today, I came up with a great trick to gain search visibility of your blog by increasing page rank of your all blog posts.


Example Of Links:

Instead of this;

<a href="http://www.mybloggerguides.com/search/label/Blogger%20Widgets">Blogger Widgets</a>

Use this (By Creating Specific Label Sitemap Page Link);

<a href="http://www.mybloggerguides.com/p/blogger-widgets.html">Blogger Widgets</a>

Creating Sitemap Page For Particular Label

If you follow above trick of internal linking for creating a page as a category, then your all blog post gain strength and also rank you higher in search results. No, the question is how to create specific label sitemap page to categorize blog posts.

This is very simple to do. Follow below steps carefully;

STEP 1] Go To Blogger.com >> Navigate To Pages >> Click On New Page.

STEP 2] Now switch post editor to HTML Mode.

STEP 3] Paste below piece of code in HTML Post editor.

<div dir="ltr" style="text-align: left;" trbidi="on">
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json){document.write('<ul id="label_with_thumbs">');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
{s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;}else thumburl='http://3.bp.blogspot.com/-zP87C2q9yog/UVopoHY30SI/AAAAAAAAE5k/AIyPvrpGLn8/s1600/picture_not_available.png';}
var postdate=entry.published.$t;var cdyear=postdate.substring(0,4);var cdmonth=postdate.substring(5,7);var cdday=postdate.substring(8,10);var monthnames=new Array();monthnames[1]="Jan";monthnames[2]="Feb";monthnames[3]="Mar";monthnames[4]="Apr";monthnames[5]="May";monthnames[6]="June";monthnames[7]="July";monthnames[8]="Aug";monthnames[9]="Sept";monthnames[10]="Oct";monthnames[11]="Nov";monthnames[12]="Dec";document.write('<li class="clearfix">');if(showpostthumbnails==true)
document.write('<a href="'+posturl+'" target ="_top"><img class="label_thumb" src="'+thumburl+'"/></a>');document.write('<strong><a href="'+posturl+'" target ="_top">'+posttitle+'</a></strong><br>');if("content"in entry){var postcontent=entry.content.$t;}
else
if("summary"in entry){var postcontent=entry.summary.$t;}
else var postcontent="";var re=/<\S[^>]*>/g;postcontent=postcontent.replace(re,"");if(showpostsummary==true){if(postcontent.length<numchars){document.write('');document.write(postcontent);document.write('');}
else{document.write('');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('');}}
var towrite='';var flag=0;document.write('<br><br><br>');if(showpostdate==true){towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;}
if(showcommentnum==true)
{if(flag==1){towrite=towrite+' | ';}
if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';commenttext='<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';towrite=towrite+commenttext;flag=1;;}
if(displaymore==true)
{if(flag==1)towrite=towrite+' | ';towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top"> Read More »</a>';flag=1;;}
document.write(towrite);document.write('</li>');if(displayseparator==true)
if(i!=(numposts-1))
document.write('');}document.write('</ul>');}
//]]>
</script>
<a href='http://www.mybloggerguides.com' rel='dofollow'></a>
<style type="text/css">
/* --------------------------------------------------------------
Specific Label Sitemap Page Widget For Blogger
Designed By : http://www.mybloggerguides.com
------------------------------------------------------------------*/
img.label_thumb{
float:left;
margin:5px !important;
height:150px!important; /* Thumbnail height */
width:150px!important; /* Thumbnail width */
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .4);
-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .4);
box-shadow: 0 1px 1px rgba(0, 0, 0, .4);
border: 1.2px solid #ff0000!important;
}
#label_with_thumbs {
float: left!important;
padding:5px;
margin:5px;
}
ul#label_with_thumbs li {
padding:2px;
background:#999;
border: 2px solid #0ff000;
width:48%;
display:inline-block;
margin:2.5px;
}
#label_with_thumbs li{
list-style: none ;
background:none;
padding-left:0px !important;
}
#label_with_thumbs strong {padding:-10px;}
#label_with_thumbs a { text-transform: uppercase; text-decoration:none; color:#ff2; font-size:14px;}
.post-body{color:#fff; font-size:15px!important;}
@media screen and (max-width:768px){ul#label_with_thumbs li{width:100%;}img.label_thumb{width:98%!important; float:none!important;}}
</style>
<script type="text/javascript">var numposts = 999999;var showpostthumbnails = true;var displaymore = true;var displayseparator = true;var showcommentnum = true;var showpostdate = true;var showpostsummary = true;var numchars = 80;</script>
<script src="http://www.mybloggerguides.com/feeds/posts/default/-/Blogger%20Widgets?published&amp;alt=json-in-script&amp;callback=labelthumbs&amp;max-results=999" type="text/javascript"></script></div>

STEP 4] Do Customization:

  • Change http://www.mybloggerguides.com with your blog domain URL.
  • Change Blogger%20Widgets with the label name for that you want to create sitemap page.

Tips for Customization:

  • If you have a single word for your label page name like “SEO” then replace Blogger%20Widgets with SEO.
  • If you have more than a single word in your label name, then put %20 between them to separate them.
  • Blogger Labels are case sensitive. So, care of it.

STEP 5] Now, Hit publish button.

That's it. Now open that page in which you've created a sitemap and check how it works on your blog.

Conclusion:

So above guide is about "How To Create A Sitemap For Specific Label with Featured Thumbnail On Blogger Page?" I've tried my best to make this tutorial as easy to understand as possible. But if in any case, you're facing any trouble, then let me know via dropping a comment below.

Did you like this post? I've googled but not find any blog, which provides accurate label sitemap with the featured image. So, After design it, I came up with this widget with complete implementation guide.

Do share this post and Subscribe us to get latest blogger tricks, blogger guides, SEO Tricks and blogger widgets direct into your mailbox for free.

Thank You!
Stay Blessed and Stay Happy!

9 comments:

  1. Hi Paramjot,, its not working plaes suggest me I got this

    ReplyDelete
  2. It's working perfectly. As I've mentioned, Label Name are case sensitive, so please care for it.

    For example:
    If your label name is Blogger Widgets, then don't write it as blogger widgets or Blogger widgets.

    If it does not work, then let me know.

    ReplyDelete
  3. Sir I face this issue what can i do. plz can you https://uploads.disquscdn.com/images/b2bf96772d92bae7bfba58c031a5779a83491643919c9fba7ff62dbe38db9c1b.png implement this code on my site via teamviewer please sir

    ReplyDelete
  4. I've never used TeamViewer, So I don't know much about it.

    Just checked it on my experimental blog and found it working well without any issue. Check Here >>

    Don't try it on a demo blog because the blog you're using have SSL (https://) facility. Just try it on your custom domain blog. Work 100% surely.

    If, this error message appear on your custom domain blog, then click on dismiss and hit publish button.

    ReplyDelete
  5. sir i was try on my domain blog also if you dont mine can you help me , because i will search for this issue from long time please

    ReplyDelete
  6. Yes, why not, This is my job dear, but you've to give me admin authority of your blog. This is my email id >> s.param94@gmail.com

    ReplyDelete
  7. Sir I was Sent request please accept

    ReplyDelete
  8. Done. :) Check your blog page.
    Don't forget to subscribe and like our facebook page.

    ReplyDelete
  9. Bro Its successfull thank you very much for your good co-operation

    ReplyDelete

We’re eager to see your comment. If you have any query related to the topic then drop a comment below. We will help you out of sure. However, Please Keep in mind that all comments are moderated manually by our human reviewers. According to our comment policy all link are nofollow so keep in mind that never use links in comments, we consider link comments as a spam.