Les nouveautés et Tutoriels de Votre Codeur | SEO | Création de site web | Création de logiciel

Seo Master present to you:
Recent Posts Widget
You surely have seen on many blogs and websites a Recent Posts Widget in the sidebar that shows the recent or newest or latest posts of the certain blog or website. This widget shows the posts title, date of post and an image of the post and even a snippet of the post. So today we are going to learn how to make this widget for your blog with some very easy steps. So let's start now.

How to add Recent Posts Widget to Blogger


Step 1. Log in to your Blogger Dashboard, then go to Layout and click on Add a Gadget link
Step 2. From the pop-up window, scroll down and choose HTML/JavaScript.
Step 3. Select & Copy the code from one of the options below and paste it into the new HTML/JavaScript: 

Option 1: Recent posts widget with snippets

<div id="hlrpsa">
<script src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-snippets.js">
</script>
<script>
var numposts = 5;var showpostdate = false;var showpostsummary = true;var numchars = 100;var standardstyling = true;
</script>
<script src="http://your-blog.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts">
</script></div>
<div id="rpdr" style="font-family: arial, sans-serif; font-size: 9px;">
<a href="http://www.matrixar.com/2013/04/recent-latest-posts-widget-for-blogger-blogspot.html" target="_blank" title="Grab this Recent Posts Widget" alt="Recent Posts Widget for blogger">Recent Posts Widget</a> by <a href="http://www.matrixar.com" title="Recent Posts Widget"
alt="Blogger and SEO Tips and tricks">Blogger Widgets</a></div><noscript>Your browser does not support JavaScript!</noscript>
<style type="text/css">
#hlrpsa a {color: #0B3861; font-size: 13px;} #rpdr {background: url(http://www.matrixar.com/-WM-QlPmHc6Y/T5wJV58qj9I/AAAAAAAACAk/1kULxdNyEyg/s1600/blogger.png) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rpdr, #rpdr a {color:#808080;}
#hlrpsa { color: #999999; font-size: 11px; border-bottom:1px #cccccc dotted; margin-top:-10px; padding-bottom:10px;}
.hlrps a {font-weight:bold; }
.hlrpssumm {}
</style>

Option 2: Recent Posts Widget Showing Post Titles Only


<div id="hlrpsb">
<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-titles-only.js"></script>
<script style="text/javascript">var numposts = 10;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script>
<script src="http://your-blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div>
<div id="rpdr" style="font-family: arial, sans-serif; font-size: 9px;">
<a href="http://www.matrixar.com/2013/04/recent-latest-posts-widget-for-blogger-blogspot.html" target="_blank" title="Grab this Recent Posts Widget" alt="Recent Posts Widget for blogger">Recent Posts Widget</a> by <a href="http://www.matrixar.com" title="Recent Posts Widget"
alt="Blogger and SEO Tips and tricks">Blogger Widgets</a></div><noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript>
<style type=text/css>
#hlrpsb a {color: #0B3861; font-size: 13px;} #rpdr {background: url( http://www.matrixar.com/-WM-QlPmHc6Y/T5wJV58qj9I/AAAAAAAACAk/1kULxdNyEyg/s1600/blogger.png ) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rpdr, #rpdr a {color:#808080;}
.bbrecpost2 {
padding-top:6px;
padding-bottom:6px;
border-bottom: 1px #cccccc dotted; }
</style>

Step 4.

  • Change 5 (option 1) and 10 (option 2) with the number of posts you want to display. 
  • Change false to true if you want the posts dates to appear 
  • Change 100 (option 1) if you want more characters to be displayed.
  • To change the color and font size of the links, modify the values in blue (links) and violet (font-size)
  • To change the style of posts summary, modify the values in green (color) and orange (font size)
  • Replace the your-blog text with the name of your blog or if you have a custom domain change all the bolded line with your address.

Step 5. Save your widget. And that's it! Enjoy!

If you need any help, leave a comment below.
And if you liked this post, please consider sharing it. Thanks.

2013, By: Seo Master
Seo Master present to you:


Search engine optimization is a very important part for the website or blog to get High traffic and PageRank. So here is complete seo guide which you help to do Complete SEO for your website or blog.

Complete seo for website | Blog
If you running your blog or website and you Don’t know where to start your SEO so here is complete SEO Guide and if you want to become SEO expert you don’t know where to start so just follow the simple steps here .
So let’s start    
  • What is SEO?

  • Why SEO is important?

  • Objective | Target of SEO?

  • What is a role of (SEO) in the internet Marketing?

  • What are the categories of SEO?

  • What is the type of SEO?

  •  How to Start Complete SEO for Blog | Website

Complete on-page search engine optimization (SEO) Guide

  • Optimize Choose Keywords:

  • Optimize Keyword in the URL:

  •  Optimize Page Title:

  • Meta Description:

  • Title  | Description | URL :

  • Optimize Heading Tags:

  • Optimize Page Content:

  • Optimize Internal Links:

  •  Optimize Images:

  • Meta Keywords:

    checklist seo for website | Blog

Complete off-page search engine optimization (SEO) Guide

10 Latest SEO tools to Help your Website Free SEO Service

if you want successful online business then you are going to need know the entire thing about SEO. Here are some SEO techniques and tools. You should definitely to adopt . 

here is complete Search engine optimization guide for newbie . so hope you enjoyed my article then if you like or you have any problem then comment below .

2013, By: Seo Master
الفنار القديم
مدخل القناة و تمثال دليسبس



خلفيات وصور رائعة hd wallpapers
المصدر: المصفوفة
Powered by Blogger.