Categories
Blogger Tips

Show Particular Label Posts in Homepage

If everything is perfectly organized in your site or blog, then all the pages or post of your blog can be reached by the visitors easily. Like when we visit a news portal we can see there every news is categorized into different categories. Such as Asian news, european news, sports news, entertainment, etc. So that the visitors can find each and every news easily. Likewise some of the blog and site should be categorized into different categories. But there is little difficult to make the blogger post into categories. To categorize the recent post, we should use the lebel as category. It is a process of showing particular label’s post in homepage. This kind of widget, you cannot find in blogger.
Show Particular Label Posts in Homepage

As usual we always advised you all not to change any code before keeping back up your templates because if you accidentally missed placed the codes, you can restore the template.

Here is techniques to make the particular label’s posts showing in homepage:

Step 01: In First as usual Go to your blogger dashboard.
Step 02: Then enter into the template and click on edit html.
Step 03: After that find the code ]]>

 above this paste the given code:

    img.label_thumb{float:left;margin-right:15px !important;height:65px; /* Thumbnail height */width:65px; /* Thumbnail width */border: 1px solid #ff00ff;}
    #label_with_thumbs {float: left;width: 100%;min-height: 80px;margin: 0px 15px 2px 0px;padding: 1;}ul#label_with_thumbs li {padding:6px 0;min-height:60px;margin-bottom:1px;border-bottom: 1px solid #ff99ff;}
    #label_with_thumbs li{list-style: none ;padding-left:1px !important;}
    #label_with_thumbs a { text-transform: none;}#label_with_thumbs strong {padding-left:1px; }

    Step 04: Now find the  and just below this code, paste the following code

      //<![CDATA[function labelthumbs(json){document.write('

        ‘);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&#039;;}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('

      • ‘);if(showpostthumbnails==true)document.write(‘‘);document.write(‘‘+posttitle+’
        ‘);if(“content”in entry){var postcontent=entry.content.$t;}elseif(“summary”in entry){var postcontent=entry.summary.$t;}else var postcontent=””;var re=/]*>/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('
        ‘);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=’‘+commenttext+’‘;towrite=towrite+commenttext;flag=1;;}if(displaymore==true){if(flag==1)towrite=towrite+’ | ‘;towrite=towrite+’More »‘;flag=1;;}document.write(towrite);document.write(‘
      • ‘);if(displayseparator==true)if(i!=(numposts-1))document.write(”);}document.write(‘

      ‘);}//]]>

      Step 05: At last add the widget codes. Click on layout and add gadget then choose the html/javascript and paste the given codes into that box

       var numposts = 3;var showpostthumbnails = true;var displaymore = false;var displayseparator = true;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 100; <script -webkit-box-sizing:="" 0px="" 15px="" baseline="" blue="" border-bottom-width:="" border-box="" border-color:="" border-left-width:="" border-right-width:="" border-style:="" border-top-width:="" color:="" font-size:="" font:="" inherit="" initial="" margin-bottom:="" margin-left:="" margin-right:="" margin-top:="" padding-bottom:="" padding-left:="" padding-right:="" padding-top:="" src="/feeds/posts/default/-/label name?published&alt=json-in-script&callback=labelthumbs”>

      Step 06: Change label name by your blog’s label
      Step 07: You should just repeat the above code to put another label’s posts but should change the label name.

      Well done, You did successfully.

      Categories
      Blogger Tips

      Add Particular Label Posts Widget For Blogger

      Image result for list style label post widget for blogger
      After so many tutorials I came to know about a working code which works perfectly for displaying particular label posts in side widget or in the body. However, there are many benefits of this widget, if you want to display different label posts on homepage then it will attract your visitors attention and it will also attract some curiosity towards your blog’s design also. Here are the steps to be followed:

      Steps To Be Followed :

      Firstly, you should give a specific and unique label to your posts which you want to be shown up on another blog. 
      Secondly, Paste and edit some part of the code given below in any HTML supported base.In case of Blogger you can paste it in the HTML/Javascript widget.
      /* Recent posts by labels
      ——————————— */ 
      img.label_thumb{
      float:left;
      margin-right:10px !important;
      height:72px; /* Thumbnail height */
      width:72px; /* Thumbnail width */
      border: 1px solid #fff;
      -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);
      }
      #label_with_thumbs { text-align: justify;
      font: normal 18px Port Lligat Slab;
      float: left;
      width: 98%;
      min-height: 70px;
      margin: 0px 10px 2px 0px;
      padding: 0;
      }
      ul#label_with_thumbs li {
      padding:8px 0;
      min-height:75px;
      margin-bottom:0px;
      border-bottom: 1px dotted #999999;
      }
      #label_with_thumbs li{
      list-style: none ;
      padding-left:0px !important;
      }
      #label_with_thumbs a:visited {
          text-decoration: none;
          color: black;}
      #label_with_thumbs a:link {
          text-decoration: none;
          color: black;}
      #label_with_thumbs a { text-transform: none;}
      #label_with_thumbs a:hover { text-decoration: underline;}
      #label_with_thumbs strong {padding-left:0px; }
      //<![CDATA[
      function labelthumbs(json){document.write(‘

        ‘);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&#039;;}
      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(‘

    • ‘);if(showpostthumbnails==true)
    • document.write(‘‘);document.write(‘‘+posttitle+’
      ‘);if(“content”in entry){var postcontent=entry.content.$t;}
      else
      if(“summary”in entry){var postcontent=entry.summary.$t;}
      else var postcontent=””;var re=/]*>/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(‘
      ‘);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=’‘+commenttext+’‘;towrite=towrite+commenttext;flag=1;;}
      if(displaymore==true)
      {if(flag==1)towrite=towrite+’ | ‘;towrite=towrite+’More »‘;flag=1;;}
      document.write(towrite);document.write(‘

      ‘);if(displayseparator==true)

      if(i!=(numposts-1))
      document.write(”);}document.write(‘

      ‘);}

      //]]>
      var numposts = 5;var showpostthumbnails = true;var displaymore = false;var displayseparator = true;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 200; 
      <script blue="" color:="" src="/feeds/posts/default/-/Articles2Read?published&alt=json-in-script&callback=labelthumbs”>

      Replace The Following With Your Details:

      var numposts = – Replace 5 with the number of post you want to show.
      Articles2Read – Change it with the label of the posts of the blog.
      Categories
      Blogger Tips

      Scrolling Text Code In HTML For Blogger Or WordPress Blog

      Scrolling text is one of the finest widget for bloggers, and everyone want to add this scrolling text on their blog for making their blog more attractive.Today i come up with this widget for my friend bloggers you are able to add this widget to your blog by adding just a simple code.

      The Scrolling text widget usually attracts visitors and pulls them again and again on your website.Its usually used for advertisements, what will be your next updates, popular posts and etc.This widget decorate your blog and make attractive but don’t decorate it too much, particularly if your site contains too much content then it spoils the concentration of reader.

      So lets start the tutorial on how to add Scrolling Text widget to your blog.

      Here so many scrolling text widgets which comes in different colors styles and different move of the text so lets start it check it out yourself which one suits your blog.

      First go to your blogs dashboard > Click On Design

      We recommend you to choose cross column as it shows the scrolling text top in your blog and catch the maximum eyes but if you want any other place then you able to place this anywhere in your blog.

      Now click on the Add a Gadget link and choose HTML/Javascript gadget from the list of gadgets.

      1.) Adding Simple Scrolling Text:

      How to Add Simple Scrolling Text To Your Blog

      The Output will look like shown below:

      How to Add Simple Scrolling Text To Your Blog

      2.) If you want to add some background  colors then try this one:

      How to add simple scrolling text to your blog

      The Out will look like shown below:

      How to add simple scrolling text to your blog

      You would able to choose background colors as you want from HTML color codes chart click here.

      3.) Now Move your text in many directions like, Left, right, up and down:

      For moving text left add:- direction=”left”
      For moving text right add:- direction=”right”
      For moving text up add:- direction=”up”
      For moving text down add:- direction=”down”

      See the examples below:

      How to add simple scrolling text to your blog



      The Output will shown below:


      How to add simple scrolling text to your blog

      For Moving Text up change the direction attribute to up:

      How to add simple scrolling text to your blog



      The Output will shown below:

      How to add simple scrolling text to your blog

      As like above for moving text down change the direction attribute to down:

      How to add simple scrolling text to your blog



      The output will shown below:

      How to add simple scrolling text to your blog

      4.) For setting the speed of text scrolling just add some more attribute:- (scrollamount=”2″)

      How to add simple scrolling text to your blog



      The output will shown below:

      How to add simple scrolling text to your blog

      5.) Now Pause the text when mouse is over the text:
      Its very useful option because when the reader want to read the text and the scroll amonut is big so that reader want to put the mouse over the text and the text will pause there.

      How to add simple scrolling text to your blog 



      The output will shown below:

      How to add simple scrolling text to your blog

      6.) The Most Important is Adding Links in The Scrolling Text:



      The output will shown below:

      Oops it looks like the page is not able to shown this example because of already added a maximum number of examples for seeing this code working click here
      You are able to add some more links by repeating the yourtext code tag.
      Now save your HTML/Javascript widget and check it yourself on your blog.
      Having any questions or problems adding this widget drop your questions, problems or your suggestions as comments below.