WWE Snaps: Blogger Tricks and Widgets

Remove Powered by Blogger "Attribution Tag" Easily

02:53 0

<div dir="ltr" style="text-align: left;" trbidi="on">
In this Post i will Show you how to remove the Attribution Tags on Blogger Very Easily Just follow the Steps given Below:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj70WQu7ucL9U1eLYqfGaOcje25fqreJx8SK6bCj5UeyBb4G_Pd0qVwNThsMyfbOnowxLCa8d15CD7JaiQWSZCJhjg8KCKQp5xY9yQC7HcpvryGP9rn9_z2I9X7lX77C2xrezBxTbjDm_g/s1600/Captureqq+copy+copy.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="282" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj70WQu7ucL9U1eLYqfGaOcje25fqreJx8SK6bCj5UeyBb4G_Pd0qVwNThsMyfbOnowxLCa8d15CD7JaiQWSZCJhjg8KCKQp5xY9yQC7HcpvryGP9rn9_z2I9X7lX77C2xrezBxTbjDm_g/s1600/Captureqq+copy+copy.jpg" width="400" /></a></div>
<br />
<br />
Step1:  <span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 15px; line-height: 1.4em;">Goto Dashboard---> Template</span><br />
<span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 15px; line-height: 1.4em;"><br /></span>
<span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 15px; line-height: 1.4em;">Step2: Search for the following piece of code ( Press Ctrl+F To Search Easily)</span><br />
<span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 15px; line-height: 1.4em;"><br /></span>
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<span style="color: #111111; font-family: Trebuchet MS, sans-serif;"><span style="font-size: 15px; line-height: 21px;"><code></code></span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Trebuchet MS, sans-serif;"><span style="font-size: 15px; line-height: 21px;"><span style="color: #111111;"><b:widget id='Attribution1'</span><span style="color: red;"><b> locked='true'</b></span><span style="color: #111111;"> title='' type='Attribution'> </span></span></span></blockquote>
<blockquote class="tr_bq">
<span style="color: #111111; font-family: Trebuchet MS, sans-serif;"><span style="font-size: 15px; line-height: 21px;"></span></span></blockquote>
</blockquote>
</div>
<div style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 15px; line-height: 1.4em;">
<br /></div>
Step3: Now In Place of<b><span style="color: red;"> locked='true'</span></b> from the Above Code Replace<span style="color: lime; font-weight: bold;"> locked='false' </span>Then Save the Template.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWFeHPISk7kctYPIWENvxOtnbUGzVeLASlO02QyFrYli06bUhS4ZzXaf73qexOac9469eb-N8uiMFeAHHONGR2N-LSGcJR1iBPr1ksR7CEZjGjSkw3seRc5DDuHMRu72kZdpjSwz55C4g/s1600/Captureeee+copy.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWFeHPISk7kctYPIWENvxOtnbUGzVeLASlO02QyFrYli06bUhS4ZzXaf73qexOac9469eb-N8uiMFeAHHONGR2N-LSGcJR1iBPr1ksR7CEZjGjSkw3seRc5DDuHMRu72kZdpjSwz55C4g/s1600/Captureeee+copy.jpg" width="640" /></a></div>
<br />
<br />
Step4: Now goto Dashboard--> Layout--> Attribution<br />
<br />
Step5: Now you will get a Remove Option which is not given Previously, Click on Remove.. Now your Attribution tag is removed :) Cheers!!<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP40aFQjtwyKF5E-fJWKCMcl-jkHML6wf3SjEddNRXrz5lBQkNpjT6uIxfhRFrPQKWVruTIndyQ6FCjUttY4YOzZFLSupMmamrHq22e0TcJ2meUBOe_uybZFX7IwHGpyz7yOtHs5EpNvA/s1600/Capturedss+copy.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="263" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP40aFQjtwyKF5E-fJWKCMcl-jkHML6wf3SjEddNRXrz5lBQkNpjT6uIxfhRFrPQKWVruTIndyQ6FCjUttY4YOzZFLSupMmamrHq22e0TcJ2meUBOe_uybZFX7IwHGpyz7yOtHs5EpNvA/s1600/Capturedss+copy.jpg" width="400" /></a></div>
<br />

Blogger Tricks and Widgets Remove Powered by Blogger "Attribution Tag" Easily

In this Post i will Show you how to remove the Attribution Tags on Blogger Very Easily Just follow the Steps given Below: Step1: Go...

Customize Labels With CSS3 Effects on Blogger/Blogspot

04:09 0

<div dir="ltr" style="text-align: left;" trbidi="on">
I Already Made a Post About<a href="http://wwesnaps.blogspot.com/2014/05/colorful-stylish-label-effect-for.html#.U3dA9_kbWwg" target="_blank"> How to Create a Label and How to Customize it with Colors</a> Just Read that If You don't know How to create a Label.<br />
<b><br /></b>
<b><span style="color: red;">PLEASE NOTE IF YOU ALREADY HAVE  LABEL WIDGET PLACED ON YOUR BLOG THEN GO TO LAYOUT-->EDIT( Where you placed your Label) And Make Sure you have Checked </span><span style="color: lime;">Cloud</span><span style="color: red;"> on Display Option</span></b><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2KWDJSkSVluLXaLbn3wxAeWD6rKnmUc2TWciKoqkFZrIWd6uncwkbm72brPVJe7-VCsk6VgQmcS_4es3-o8PUUdiH4W5_EsVqe48dVJ1oFRnxTywPnqWpEJJPSP0TnsVId0aBga8iig4/s1600/Capture.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2KWDJSkSVluLXaLbn3wxAeWD6rKnmUc2TWciKoqkFZrIWd6uncwkbm72brPVJe7-VCsk6VgQmcS_4es3-o8PUUdiH4W5_EsVqe48dVJ1oFRnxTywPnqWpEJJPSP0TnsVId0aBga8iig4/s1600/Capture.JPG" /></a></div>
<br />
<br />
Now I Will Show you to add CSS3 Effects on Labels<br />
<br />
<br />
<ul style="text-align: left;">
<li>Go to the Blogger Dashboard and Click on Template then Edit HTML</li>
<li>Now Search for the following code</li>
</ul>
<br />
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
<blockquote class="tr_bq">
]]></b:skin></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
</div>
<br />
<ul style="text-align: left;">
<li> Then Place the Below Code Just Above it.</li>
</ul>
<div>
<br /></div>
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;"><code></code></span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">.Label a{  background: rgb(0,100,180); </span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">background: -moz-linear-gradient(top,  rgba(0,100,180,1) 0%, rgba(20,60,100,1) 100%); </span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,100,180,1)), color-stop(100%,rgba(20,60,100,1))); </span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">background: -webkit-linear-gradient(top,  rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);</span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">background: -o-linear-gradient(top,  rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%); </span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">background: -ms-linear-gradient(top,  rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%); </span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">background: linear-gradient(top,  rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%); </span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0064b4', endColorstr='#123d60',GradientType=0 ); </span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">display:inline-block;border: 1px solid #005ca6;padding:0 8px; color:#fff!important; height:28px; line-height:28px; text-transform:capitalize; text-decoration:none;float:left;margin-top:5px; font-size:14px;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out;text-shadow: 0 -1px -1px rgba(0, 0, 0, 0.2); </span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">}</span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;">.Label a:hover{color:#000 !important; background:#123d60;}</span></span></blockquote>
<blockquote class="tr_bq">
<span style="font-family: Open Sans, sans-serif;"><span style="background-color: white; font-size: 14px; line-height: 24px;"></span></span></blockquote>
</blockquote>
<div>
<br /></div>
<br />
<ul style="text-align: left;">
<li>That's All you are done now Just Open your blog and See.. </li>
</ul>
<br />
<blockquote class="tr_bq">
<div>
<br /></div>
</blockquote>
<div style="text-align: left;">
<br /></div>
<div>
<br /></div>

Blogger Tricks and Widgets Customize Labels With CSS3 Effects on Blogger/Blogspot

I Already Made a Post About How to Create a Label and How to Customize it with Colors Just Read that If You don't know How to create ...

How to Create Tables in Blogger Easily? Simple

04:10 0

<div dir="ltr" style="text-align: left;" trbidi="on">
Hi friends Now i will Tell You how to create Tables in Blogger Posts or Pages Its very Simple,<br />
<b><br /></b>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrWmrGS6aFOoP6h_NSNLK8IVrOzLUgy1yIrMclOYX96y31Lsw39lf1vMO6Z6pgS-oYVoBte3Dh-PjNyVyAs5r7D7w-oXGT9DDXUemDJBb4TXcSWZLOf8PdwGlxuz2GNfD3eVfdKm6-I_k/s1600/icon_256.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrWmrGS6aFOoP6h_NSNLK8IVrOzLUgy1yIrMclOYX96y31Lsw39lf1vMO6Z6pgS-oYVoBte3Dh-PjNyVyAs5r7D7w-oXGT9DDXUemDJBb4TXcSWZLOf8PdwGlxuz2GNfD3eVfdKm6-I_k/s1600/icon_256.png" width="400" /></a></div>
<b><br /></b>
<b><br /></b>
<b>First </b>of All you should <b>make a Table and its contents in excel</b>. And the Remaining Job is Very Simple.. Just goto <a href="http://tableizer.journalistopia.com/" target="_blank">TABLEIZER</a> And Copy Paste the Excel Contents in the Space Given on the Website and Click Tableize it.! Then Copy and Paste the Generated Code and Paste those Codes on The Blog That's it!!!!!<br />
If You Like this Post Please Share With Your Friends ;)</div>

Blogger Tricks and Widgets How to Create Tables in Blogger Easily? Simple

Hi friends Now i will Tell You how to create Tables in Blogger Posts or Pages Its very Simple, First of All you should make a Table a...

Add Neat and Simple Facebook Like Box Widget for Blogger/Blogspot.

04:02 0

<div dir="ltr" style="text-align: left;" trbidi="on">
Adding a Neat and Simple Facebook Like Box Widget for Blogger/Blogspot is Very Easy if you follow the given steps.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidLmlWFp2mqT-KLXrG5d1CzlrY2HeOxLvJ51_g1cSdct98j_YkaulaFFCCMV5PuyKw1EfNSz4zx2so0PgSwGhmnO4QTkiHz7PkD__sQVEF-_xG1tyAVMC8zG3koCwFP_irup3KRpyMCss/s1600/Capture.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidLmlWFp2mqT-KLXrG5d1CzlrY2HeOxLvJ51_g1cSdct98j_YkaulaFFCCMV5PuyKw1EfNSz4zx2so0PgSwGhmnO4QTkiHz7PkD__sQVEF-_xG1tyAVMC8zG3koCwFP_irup3KRpyMCss/s1600/Capture.JPG" /></a></div>
<br />
<br />
Step1: Login to you Blogger Account and Then Goto Blogger Dashboard<br />
<br />
Step2: Now goto Layout--> Add a Gadget--> HTML/Javascript.<br />
<br />
Step3: Now Add the Below Given Code on the HTML/JavaScript Box.<br />
<br />
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2</blockquote>
<blockquote class="tr_bq">
Fwwesnaps&width=300&</blockquote>
<blockquote class="tr_bq">
height=190&show_faces=true&colorscheme=light&</blockquote>
<blockquote class="tr_bq">
amp;stream=false&border_color&header=false"</blockquote>
<blockquote class="tr_bq">
scrolling="no" frameborder="0" style="border:none;</blockquote>
<blockquote class="tr_bq">
overflow:hidden; width:312px; height:190px;" allowtransparency="true"></iframe></blockquote>
<blockquote class="tr_bq">
<a href="http://www.haakblog.com/2014/02/download-best-blogger-templates-of-2014.html" rel="dofollow" target="_blank" title="blogger templates"><img src="https://bitly.com/haakblog" alt="blogger templates" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://www.haakblog.com" rel="dofollow" target="_blank" title="blogger widgets"><img src="https://bitly.com/haakblog" alt="blogger widgets" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><div id="rpdr" style="font-family: arial, sans-serif; font-size: 9px;"></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
</div>
<div>
<br /></div>
<h3 style="text-align: left;">
<span style="font-size: small; font-weight: normal;">Step4: Now Replace <span style="color: red;">WWESnaps</span><span style="font-family: inherit; font-style: inherit; line-height: 19px;">  With Your Facebook Username</span></span></h3>
<div>
<span style="font-size: small; font-weight: normal;"><span style="font-family: inherit; font-style: inherit; line-height: 19px;"><br /></span></span></div>
<div>
<span style="font-size: small; font-weight: normal;"><span style="font-family: inherit; font-style: inherit; line-height: 19px;">Step5: Now Save it We are Done.! Cheers!</span></span></div>

Blogger Tricks and Widgets Add Neat and Simple Facebook Like Box Widget for Blogger/Blogspot.

Adding a Neat and Simple Facebook Like Box Widget for Blogger/Blogspot is Very Easy if you follow the given steps. Step1: Login to yo...

Colorful & Stylish Label Effect for Blogger/Blogspot.

03:39 0

<div dir="ltr" style="text-align: left;" trbidi="on">
Add a Stylish Cool Effects for Blogger Label.Here i will explain you gow to add Labels and How to Customize it with Stylish Effects.Just Follow my steps carefully Then it will be easy For You!<br />
<br />
Step1: Go to Blogger Dashboard and Then Layout--> Add a Gadget--> Label (If you don't Undertsand this Please See the Image Below.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3hqbUlXvA8tpo6XvNB5f3-edn6eAPu-C5gtxNvezGp5NlMGtSGvvtORAWtt_4u0ny4CHI3sDb4jKfHzIagQjCyd5KEM_MwZpIuX3cIIdjSw7vJPea7DaZrkeEhhtE_hVRV6Lx0O6p-_4/s1600/Capture+copy.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="312" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3hqbUlXvA8tpo6XvNB5f3-edn6eAPu-C5gtxNvezGp5NlMGtSGvvtORAWtt_4u0ny4CHI3sDb4jKfHzIagQjCyd5KEM_MwZpIuX3cIIdjSw7vJPea7DaZrkeEhhtE_hVRV6Lx0O6p-_4/s1600/Capture+copy.jpg" width="640" /></a></div>
<br />
<br />
Step2: Now a Pop-up Will open Will Label Options. Then Now to Add a Stylish Label Change the Display Option from List to Cloud.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfbbXq-JZntycSn_nZpt8BFF-J0lwdlvZpjx2gQEHJzldmhNLjTcgKY2TfR5Q2cqjE2r2LhVLCVZ65JrhJyIqZfpdlrP7TvVnzMT_5yANzJt5qUO4-oh1rUc6ojMJrC6AzBIVUiRYwXTE/s1600/Capture1+copy.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfbbXq-JZntycSn_nZpt8BFF-J0lwdlvZpjx2gQEHJzldmhNLjTcgKY2TfR5Q2cqjE2r2LhVLCVZ65JrhJyIqZfpdlrP7TvVnzMT_5yANzJt5qUO4-oh1rUc6ojMJrC6AzBIVUiRYwXTE/s1600/Capture1+copy.jpg" /></a></div>
<br />
<br />
Step3: Now go to Template Which is on the Left Pane of Dashboard. Then Click on Edit HTML<br />
<br />
Step4:  Now Search for the following code by Pressing Ctrl+F.<br />
<br />
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<span style="color: #222222; font-family: Cuprum;"><span style="font-size: 15px; line-height: 21.559999465942383px;"><b><code></code></b></span></span></blockquote>
<blockquote class="tr_bq">
<span style="color: #222222; font-family: Cuprum;"><span style="font-size: 15px; line-height: 21.559999465942383px;"><b>]]></b:skin></b></span></span></blockquote>
<blockquote class="tr_bq">
<span style="color: #222222; font-family: Cuprum;"><span style="font-size: 15px; line-height: 21.559999465942383px;"><b></b></span></span></blockquote>
</blockquote>
</div>
<div>
<br /></div>
<br />
Step5: Now Place the Below Code Just Above <span style="color: #222222; font-family: Cuprum;"><span style="background-color: white; font-size: 15px; line-height: 21.559999465942383px;"><b><code></code></b></span></span><br />
<span style="color: #222222; font-family: Cuprum;"><span style="background-color: white; font-size: 15px; line-height: 21.559999465942383px;"><b>]]></b:skin></b></span></span><br />
<span style="color: #222222; font-family: Cuprum;"><span style="background-color: white; font-size: 15px; line-height: 21.559999465942383px;"><b></b></span></span><br />
<div>
<br /></div>
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
/* Colorful Label Widget By www.wwesnaps.blogspot.Com —————- */</blockquote>
<blockquote class="tr_bq">
<br /></blockquote>
<blockquote class="tr_bq">
.sidebar .label-size {</blockquote>
<blockquote class="tr_bq">
position:relative;</blockquote>
<blockquote class="tr_bq">
text-transform: uppercase;</blockquote>
<blockquote class="tr_bq">
text-decoration:none;</blockquote>
<blockquote class="tr_bq">
font-size:13px;</blockquote>
<blockquote class="tr_bq">
font-family:Open Sans;</blockquote>
<blockquote class="tr_bq">
color:#fff!important;</blockquote>
<blockquote class="tr_bq">
}</blockquote>
<blockquote class="tr_bq">
<br /></blockquote>
<blockquote class="tr_bq">
.sidebar .label-size a {</blockquote>
<blockquote class="tr_bq">
color:#fff!important;</blockquote>
<blockquote class="tr_bq">
font-weight:bold;</blockquote>
<blockquote class="tr_bq">
padding:8px 10px;</blockquote>
<blockquote class="tr_bq">
margin:0 6px 6px 0;</blockquote>
<blockquote class="tr_bq">
float:left;</blockquote>
<blockquote class="tr_bq">
display:block;</blockquote>
<blockquote class="tr_bq">
-moz-transition: all 0.4s ;</blockquote>
<blockquote class="tr_bq">
-o-transition: all 0.4s;</blockquote>
<blockquote class="tr_bq">
-webkit-transition: all 0.4s ;</blockquote>
<blockquote class="tr_bq">
-ms-transition: all 0.4s ;</blockquote>
<blockquote class="tr_bq">
transition: all 0.4s ;</blockquote>
<blockquote class="tr_bq">
}</blockquote>
<blockquote class="tr_bq">
<br /></blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-1 a {background:#1abc9c;border-bottom:3px solid #127F69;}</blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-1 a:hover {background:#16a085;}</blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-2 a {background:#3498db;border-bottom:3px solid #226693;}</blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-2 a:hover {background:#2980b9;}</blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-3 a {background:#2ecc71;border-bottom:3px solid #1F8C4C;}</blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-3 a:hover {background:#27ae60}</blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-4 a {background:#9b59b6;border-bottom:3px solid #74398E;}</blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-4 a:hover {background:#8e44ad}</blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-5 a {background:#e74c3c;border-bottom:3px solid #922C20;}</blockquote>
<blockquote class="tr_bq">
.sidebar .label-size-5 a:hover {background:#c0392b}</blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
<div>
<br /></div>
You can Also Customize the Color of the Widget by Changing the Color Codes.<br />
<br />
 Now its All over Reload you blog and Enjoy this Awesome Widget. :) Cheers..!!

Blogger Tricks and Widgets Colorful & Stylish Label Effect for Blogger/Blogspot.

Add a Stylish Cool Effects for Blogger Label.Here i will explain you gow to add Labels and How to Customize it with Stylish Effects.Just Fo...

Beautiful Social Sliding Blogger Widget With Counters

05:35 0

<div dir="ltr" style="text-align: left;" trbidi="on">
<div dir="ltr" style="text-align: left;" trbidi="on">
Today i will Teach You How to add a Beautiful CSS Social Sliding Widget With Counters For Blogger, Its Pretty Simple If you follow the below Steps.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic3w143RDUzVZ-3Dl56F1e_bCqZlp9dAIjDPKulZ3601wiQAPjOtzSj_VHa1jTbUJzPde-GnbWwy7r-qe-b5flkV6rqh_a8aXVG4lDfjF1NqRjXCdRBg4yA5UE9mnRbj-CSmjDvHN8Bg0/s1600/Untitled-1+copy.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic3w143RDUzVZ-3Dl56F1e_bCqZlp9dAIjDPKulZ3601wiQAPjOtzSj_VHa1jTbUJzPde-GnbWwy7r-qe-b5flkV6rqh_a8aXVG4lDfjF1NqRjXCdRBg4yA5UE9mnRbj-CSmjDvHN8Bg0/s1600/Untitled-1+copy.jpg" /></a></div>
<br />
<br />
Step1: Goto Blogger Dashboard --> Layout --> Add a Widget --> HTML/Javascript.<br />
<br />
Step2: Just Paste the Below Code on the Space Given on HTML/Javascript.<br />
<br />
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
</blockquote>
<blockquote class="tr_bq">
<link rel="stylesheet" type="text/css" href="https://dl.dropboxusercontent.com/u/76401970/All%20Blogger%20Tricks/abt-sliding-social.css"/></blockquote>
<blockquote class="tr_bq">
<div class="abt-social"></blockquote>
<blockquote class="tr_bq">
    <ul></blockquote>
<blockquote class="tr_bq">
        <li><a class="abt-box facebook" href="#"><p>15K+</p>Facebook </a></li></blockquote>
<blockquote class="tr_bq">
        <li><a class="abt-box twitter" href="#"><p>10K+</p>Twitter</a></li></blockquote>
<blockquote class="tr_bq">
        <li><a class="abt-box gplus" href="#"><p>5K+ </p>Google+</a></li></blockquote>
<blockquote class="tr_bq">
        <li><a class="abt-box pinterest" href="#"><p>4K+ </p>Pinterest</a></li></blockquote>
<blockquote class="tr_bq">
        <li><a class="abt-box rss" href="#"><p>10K+</p>RSS</a></li></blockquote>
<blockquote class="tr_bq">
    </ul></blockquote>
<blockquote class="tr_bq">
</div></blockquote>
<blockquote class="tr_bq">
<br /></blockquote>
<blockquote class="tr_bq">
</blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
</div>
</div>
<div>
<br /></div>
<br />
Step3: After Adding the Above code Just Replace the '<span style="color: blue;"><b>#</b></span>' Code with the Link of your social media page and then Replace the Likes of those pages which is Given in Red Colour.

Blogger Tricks and Widgets Beautiful Social Sliding Blogger Widget With Counters

Today i will Teach You How to add a Beautiful CSS Social Sliding Widget With Counters For Blogger, Its Pretty Simple If you follow the bel...

Blogger/Blogspot Scroll to top jquery Button Widget

05:24 0

<div dir="ltr" style="text-align: left;" trbidi="on">
Adding this Widget is very Simple.Just follow the Below Steps Carefully.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMufRnDILEeQV99h_hOuJAUFoaBDwnFidWNknSVX8kru0cpOe1GfsT8Q5FIvFUBk0FcG5FzWw7DA4EkLpl3txwnpuhYw0w49HxldJKg4nlFcxGeU6FYmZc4fDfgtAKsn2OrL2VjqXm7kQ/s1600/Untitled-1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="266" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMufRnDILEeQV99h_hOuJAUFoaBDwnFidWNknSVX8kru0cpOe1GfsT8Q5FIvFUBk0FcG5FzWw7DA4EkLpl3txwnpuhYw0w49HxldJKg4nlFcxGeU6FYmZc4fDfgtAKsn2OrL2VjqXm7kQ/s1600/Untitled-1.jpg" width="400" /></a></div>
<br />
<br />
Step1: Just Goto Your Blogger Dashboard and Click on Templates on Left tab pane and then Click on Edit HTML.<br />
<br />
Step2: Now press Ctrl+F And then Enter <span style="background-color: #f9f9f9; color: #3e3e3e; font-family: lora; font-size: 16px; line-height: 24px;"> </span><b style="background-color: #f9f9f9; color: #3e3e3e; font-family: lora; font-size: 16px; line-height: 24px;"></b></div>
<span style="background-color: #f9f9f9; color: #3e3e3e; font-family: lora; font-size: 16px; line-height: 24px;">on the Search to find the tag.</span><br />
Step3: Now Add the Below Given Code Just Above the<b> </b><br />
 tag.<br />
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
<style type="text/css"></blockquote>
<blockquote class="tr_bq">
#abt-Top {-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px; width:100px;background-color: #EEEEEE;background-color: rgba(238, 238, 238, 0.6);filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#99EEEEEE',EndColorStr='#99EEEEEE');text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#444;text-decoration:none;border:1px solid #C9C9C9;}</blockquote>
<blockquote class="tr_bq">
</style></blockquote>
<blockquote class="tr_bq">
</blockquote>
<blockquote class="tr_bq">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"/></blockquote>
<blockquote class="tr_bq">
<script type='text/javascript'></blockquote>
<blockquote class="tr_bq">
    jQuery(function($) {</blockquote>
<blockquote class="tr_bq">
        $.fn.scrollToTop = function() {</blockquote>
<blockquote class="tr_bq">
        $(this).hide().removeAttr("href");</blockquote>
<blockquote class="tr_bq">
        if ($(window).scrollTop() != "0") {</blockquote>
<blockquote class="tr_bq">
            $(this).fadeIn("slow")</blockquote>
<blockquote class="tr_bq">
        }</blockquote>
<blockquote class="tr_bq">
        var scrollDiv = $(this);</blockquote>
<blockquote class="tr_bq">
        $(window).scroll(function() {</blockquote>
<blockquote class="tr_bq">
        if ($(window).scrollTop() == "0") {</blockquote>
<blockquote class="tr_bq">
        $(scrollDiv).fadeOut("slow")</blockquote>
<blockquote class="tr_bq">
        } else {</blockquote>
<blockquote class="tr_bq">
        $(scrollDiv).fadeIn("slow")</blockquote>
<blockquote class="tr_bq">
        }</blockquote>
<blockquote class="tr_bq">
    });</blockquote>
<blockquote class="tr_bq">
    $(this).click(function() {</blockquote>
<blockquote class="tr_bq">
        $("html, body").animate({</blockquote>
<blockquote class="tr_bq">
        scrollTop: 0</blockquote>
<blockquote class="tr_bq">
        }, "slow")</blockquote>
<blockquote class="tr_bq">
    })</blockquote>
<blockquote class="tr_bq">
    }</blockquote>
<blockquote class="tr_bq">
});</blockquote>
<blockquote class="tr_bq">
jQuery(function($) {</blockquote>
<blockquote class="tr_bq">
    $("#abt-Top").scrollToTop();</blockquote>
<blockquote class="tr_bq">
});</blockquote>
<blockquote class="tr_bq">
</script></blockquote>
<blockquote class="tr_bq">
</blockquote>
<blockquote class="tr_bq">
    <a href="#" id="abt-Top" style="display: none;">Scroll to Top </a></blockquote>
<blockquote class="tr_bq">
<br /></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
<div>
<br /></div>
That's All is Well!! Now Your are done. Just check your blog! If you have any Problem with this widget Contact Me.

Blogger Tricks and Widgets Blogger/Blogspot Scroll to top jquery Button Widget

Adding this Widget is very Simple.Just follow the Below Steps Carefully. Step1: Just Goto Your Blogger Dashboard and Click on Templat...

Awesome Recent Posts Widget With Thumbnail for Blogger/Blogspot

01:22 0

<div dir="ltr" style="text-align: left;" trbidi="on">
<div dir="ltr" style="text-align: left;" trbidi="on">
Today iam Going to show how to make a gorgeous recent posts widgets for blogger blog! Just follow the Steps Below,Before going on to the Step by step process Just Look into the Live Demo of this widget.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitZ3u4x2ECJuHALJ55enEkNeiPCWbpMhAEuvl2ZyHBSUVjqen6m7bOyZw6DKG-Xqj5tMiXpXD_iZp9L-xwUowFYtw_e_dFAz4q2jxqVFcm7hWa7QXNH8HXJsKfKx6OJa9wtNr66NigmHs/s1600/Untitled-1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="265" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitZ3u4x2ECJuHALJ55enEkNeiPCWbpMhAEuvl2ZyHBSUVjqen6m7bOyZw6DKG-Xqj5tMiXpXD_iZp9L-xwUowFYtw_e_dFAz4q2jxqVFcm7hWa7QXNH8HXJsKfKx6OJa9wtNr66NigmHs/s1600/Untitled-1.jpg" width="400" /></a></div>
<br />
<br />

<b>Step 1: </b>Goto Blogger dashboard--> Layout--> Add Element--> HTML/Javascript and Paste the below code in the Space give on the HTML/Javascript<br />
<b><br /></b>
<br />
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script></blockquote>
<blockquote class="tr_bq">
<style type="text/css"></blockquote>
<blockquote class="tr_bq">
#post-gallery {width:100%; margin:0px auto;font:normal 11px Arial,Sans-Serif;color:##000000;padding:8px;}</blockquote>
<blockquote class="tr_bq">
#post-gallery .rp-item {float:left;display:inline;  position:relative;  margin:2px;  padding:0px 0px;  background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7_cRPn6AOT6U69_kZpMNY2O1EiWTT3m2mdA2FWqR1BcGcFX8v6OqhdNqVBUZ02CKU6uJnsSkhEus-bO7I4AV-PgEWfMIG26K5qNZRX0o08Jgh8hKUu9-0qyzvKFVfRVJb0kixTCgOJCxy/s1600/LOAD+(66).gif') no-repeat 50% 50%;  width:79px;  height:79px;}</blockquote>
<blockquote class="tr_bq">
#post-gallery .rp-item img {  width:69px;  height:69px;  border:none !important;  margin:0px 0px !important;  padding:0px 0px !important;  background:transparent !important;  display:none;}</blockquote>
<blockquote class="tr_bq">
#post-gallery .rp-item img:hover{-moz-transform: scale(1.2) rotate(-350deg);-webkit-transform: scale(1.2) rotate(-350deg);-o-transform: scale(1.2) rotate(-350deg);-ms-transform: scale(1.2) rotate(-350deg);transform: scale(1.2) rotate(-350deg);-webkit-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);-moz-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);}</blockquote>
<blockquote class="tr_bq">
#post-gallery .rp-item .rp-child {  position:relative;  top:10%!important;  left:10%!important;  z-index:1000;  width:200px;  background-color:white;  border-bottom:5px solid #1BA1E2;  -webkit-box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7);  -moz-box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7);  box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7);  padding:10px 15px;  overflow:hidden;  word-wrap:break-word;  display:none;  opacity: 0.9;}</blockquote>
<blockquote class="tr_bq">
#post-gallery .rp-item .rp-child h4 {  font-size:12px;  margin:0px 0px 5px;  color:#1BA1E2;}</blockquote>
<blockquote class="tr_bq">
#post-gallery .rp-item:hover .hidden {display:block;}</style></blockquote>
<blockquote class="tr_bq">
<script type="text/javascript"></blockquote>
<blockquote class="tr_bq">
var rpTitle     = "Recent Posts",       // <b><span style="color: red;">Widget Title</span></b></blockquote>
<blockquote class="tr_bq">
    numposts    = 14,      // <span style="color: red;"><b>Number of Posts to show</b></span></blockquote>
<blockquote class="tr_bq">
    numchar     = 200,      // <b><span style="color: red;">Number of Characters to be displayed</span></b></blockquote>
<blockquote class="tr_bq">
    rcFadeSpeed = 600,      // <b><span style="color: red;">Speed</span></b></blockquote>
<blockquote class="tr_bq">
    pBlank      = "http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",      // If No Image</blockquote>
<blockquote class="tr_bq">
    blogURL     = "http://www.<b><span style="color: red;">wwesnaps</span></b>.blogspot.com/";       // Your Blog URL</blockquote>
<blockquote class="tr_bq">
</script></blockquote>
<blockquote class="tr_bq">
<script src="https://dl.dropboxusercontent.com/u/76401970/All%20Blogger%20Tricks/abt-recent-posts.js" type="text/javascript"></script></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
</div>
<div style="font-weight: bold;">
<br /></div>
Now change the <b style="color: red;"> </b><b><span style="color: red;">wwesnaps </span></b>to your blog name to make your blog recent posts appear correctly<br />
<br />
That's all your are now ready to view your awesome recent posts widget on your blog :) ,<br />
<b><br /></b>
<b><br /></b></div>

Blogger Tricks and Widgets Awesome Recent Posts Widget With Thumbnail for Blogger/Blogspot

Today iam Going to show how to make a gorgeous recent posts widgets for blogger blog! Just follow the Steps Below,Before going on to the S...

Clean Recent Comments Widget for blogspot/blogger

23:58 0

<div dir="ltr" style="text-align: left;" trbidi="on">
Comments Plays a important role in any websites or blog! so to make the viewers to encourage placing comments recent comments widgets may play an important role. so here is a step by step guide for making awesome recent comment widgets.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaV1R8a9bS2mVHvVV-HxnDZejjgvsF_AZXmS2YrF1ixFJ9RL0L7fCCl9X3U2Q1uaLimrqbd90j_Sq5LmXexPhUl4jmbkXHVjY317FBC1ZXhXYZwvRWSg2fUYwbzDF0yWbD6xmO-ncCJgc/s1600/Capture+copy.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaV1R8a9bS2mVHvVV-HxnDZejjgvsF_AZXmS2YrF1ixFJ9RL0L7fCCl9X3U2Q1uaLimrqbd90j_Sq5LmXexPhUl4jmbkXHVjY317FBC1ZXhXYZwvRWSg2fUYwbzDF0yWbD6xmO-ncCJgc/s1600/Capture+copy.jpg" /></a></div>
<br />
<br />
Step1: Just go to your Blogger Dashboard and Click on Layout on Left tab.<br />
<br />
Step 2: Now Click on Add a widget (It will display many "add a widget" Option so choose the correct place where you want your widget to appear and then press Add a widget)<br />
<br />
Step 3: After clicking on Add a widget a pop-up box will open with many options and there choose HTML/JavaScript option<br />
<br />
Step4: Now paste the following code in the Empty Space given on  HTML/Javascript option.<br />
<br />
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
<style type="text/css" scoped> </blockquote>
<blockquote class="tr_bq">
ul.allbloggertricks_recent{list-style:none;margin:0;padding:0;} </blockquote>
<blockquote class="tr_bq">
.allbloggertricks_recent li{background:none!important;display:block;clear:both;overflow:hidden;list-style:none;border:1px solid transparent;border-radius:9px;max-height:100px;-webkit-transition-duration:.5s;-moz-transition-duration:.5s;-o-transition-duration:.5s;transition-duration:.5s;-webkit-transition-property:0;-moz-transition-property:0;-o-transition-property:0;transition-property:transform;margin:0 0 6px!important;padding:3px!important}</blockquote>
<blockquote class="tr_bq">
.allbloggertricks_recent li:hover{border:1px solid #ddd;</blockquote>
<blockquote class="tr_bq">
-webkit-transform:rotate(6deg);-moz-transform:rotate(6deg);-o-transform:rotate(6deg) }</blockquote>
<blockquote class="tr_bq">
.allbloggertricks_recent a {text-decoration:none;}</blockquote>
<blockquote class="tr_bq">
.avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px </blockquote>
<blockquote class="tr_bq">
#ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden} </blockquote>
<blockquote class="tr_bq">
.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;width:35px;height:35px} </blockquote>
<blockquote class="tr_bq">
.allbloggertricks_recent li span{margin-top:4px;color: #222;display: block;font-size: 12px;line-height: 1.4;} </blockquote>
<blockquote class="tr_bq">
<br /></blockquote>
<blockquote class="tr_bq">
</style></blockquote>
<blockquote class="tr_bq">
<script type="text/javascript"></blockquote>
<blockquote class="tr_bq">
//<![CDATA[</blockquote>
<blockquote class="tr_bq">
    var</blockquote>
<blockquote class="tr_bq">
 numComments  = 5,</blockquote>
<blockquote class="tr_bq">
 showAvatar  = true,</blockquote>
<blockquote class="tr_bq">
 avatarSize  = 35,</blockquote>
<blockquote class="tr_bq">
 roundAvatar = true,</blockquote>
<blockquote class="tr_bq">
 characters  = 40,</blockquote>
<blockquote class="tr_bq">
 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",</blockquote>
<blockquote class="tr_bq">
 hideCredits = true;</blockquote>
<blockquote class="tr_bq">
 maxfeeds=50,</blockquote>
<blockquote class="tr_bq">
 adminBlog='Your Name';</blockquote>
<blockquote class="tr_bq">
//]]></blockquote>
<blockquote class="tr_bq">
</script></blockquote>
<blockquote class="tr_bq">
<script type="text/javascript" src="https://dl.dropboxusercontent.com/u/76401970/All%20Blogger%20Tricks/abt-recent-commentsv3.js"></script></blockquote>
<blockquote class="tr_bq">
<script type="text/javascript" src="/feeds/comments/default?alt=json&callback=allbloggertricks_recent&&max-results=50"></blockquote>
<blockquote class="tr_bq">
</script></blockquote>
<blockquote class="tr_bq">
<br /></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
</div>
<div>
<br /></div>
That's All now your Awesome Recent Comments Widget is ready. go and See your Blog!

Blogger Tricks and Widgets Clean Recent Comments Widget for blogspot/blogger

Comments Plays a important role in any websites or blog! so to make the viewers to encourage placing comments recent comments widgets may p...

Add Beautiful Page Navigation (in Numbers) Widget on Blogspot/Blogger

23:40 0

<div dir="ltr" style="text-align: left;" trbidi="on">
Here is a Wonderful Step by Step guide on how to add a beautiful page navigation Widget on blogger blog<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLBH_rm33X8T3LLmGEel1PerLhbLwHcLyg6KuBXcPQPO5bE6xsm6zmBJJUaxA7Q3ejHZn_nekGAQRVlzkpcmQ4upRotdaAi19ohtNelau9LfoQuBQY8S8lPXZ4AfhxBEOViFBlYTmPAuw/s1600/Untitled-1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="426" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLBH_rm33X8T3LLmGEel1PerLhbLwHcLyg6KuBXcPQPO5bE6xsm6zmBJJUaxA7Q3ejHZn_nekGAQRVlzkpcmQ4upRotdaAi19ohtNelau9LfoQuBQY8S8lPXZ4AfhxBEOViFBlYTmPAuw/s1600/Untitled-1.jpg" width="640" /></a></div>
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
Adding this widget contains only 2 steps:<br />
<br />
First is Adding CSS And Second is Adding the script.<br />
<br />
<b>1. Adding CSS:</b><br />
<br />
Step1: goto blogger dashboard and click on Template on Left tab pane.<br />
<br />
Step2: Now Click the Mouse inside the code area and press ctrl+F and then type ]]></div>
and then hit enter to find the code.<br />
Step3:  Now Paste the Following Code Just Above the  ]]><br />
.<br />
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
 .page-navigation{clear:both;margin:30px auto;text-align:center;}</blockquote>
<blockquote class="tr_bq">
.page-navigation span,.page-navigation a{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#404042;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}</blockquote>
<blockquote class="tr_bq">
.page-navigation a:hover,.page-navigation .current{background:#EC8D04;text-decoration:none;color: #fff;}</blockquote>
<blockquote class="tr_bq">
.page-navigation .pages,.page-navigation .current{font-weight:bold;color: #fff;-webkit-box-shadow: inset 0px -1px 2px 0px rgba(50, 50, 50, 0.69);-moz-box-shadow:inset 0px -1px 2px 0px rgba(50, 50, 50, 0.69);box-shadow:inset 0px -1px 2px 0px rgba(50, 50, 50, 0.69);}</blockquote>
<blockquote class="tr_bq">
.page-navigation .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}</blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
<div>
<br /></div>
<b>2. Now we have Finished Step1 Now we move on to step 2:</b><br />
<br />
Step4:  Now search for the below Line by pressing ctrl+F .<br />
<br />
<blockquote class="tr_bq">
<br /></blockquote>
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
 <b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'></blockquote>
<blockquote class="tr_bq">
</blockquote>
<div>
<br /></div>
<div>
Step5: Now add the Following Script Just above Below it</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
 </blockquote>
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
<b:includable id='page-navi'></blockquote>
<blockquote class="tr_bq">
<div class='page-navigation'></blockquote>
<blockquote class="tr_bq">
<script type='text/javascript'></blockquote>
<blockquote class="tr_bq">
var pgNavigConf = {</blockquote>
<blockquote class="tr_bq">
perPage: 7,</blockquote>
<blockquote class="tr_bq">
numPages: 6,</blockquote>
<blockquote class="tr_bq">
firstText: "First",</blockquote>
<blockquote class="tr_bq">
lastText: "Last",</blockquote>
<blockquote class="tr_bq">
nextText: "Next",</blockquote>
<blockquote class="tr_bq">
prevText: "Prev"</blockquote>
<blockquote class="tr_bq">
}</blockquote>
<blockquote class="tr_bq">
</script></blockquote>
<blockquote class="tr_bq">
<script src='http://helplogger.googlecode.com/svn/trunk/page-navigation.js' type='text/javascript'/></blockquote>
<blockquote class="tr_bq">
<div class='clear'/></blockquote>
<blockquote class="tr_bq">
</div></blockquote>
<blockquote class="tr_bq">
</b:includable></blockquote>
<blockquote class="tr_bq">
</blockquote>
</div>
<div>
Step6: Now find the Below code:</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
 </blockquote>
<blockquote class="tr_bq">
<b:include name='nextprev'/></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
<div>
<br /></div>
Step7: Now Replace the Above Code With the following code:<br />
<br />
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
 <b:if cond='data:blog.pageType == "index"'></blockquote>
<blockquote class="tr_bq">
<b:include name='page-navi' /></blockquote>
<blockquote class="tr_bq">
<b:else/></blockquote>
<blockquote class="tr_bq">
<b:if cond='data:blog.pageType == "archive"'></blockquote>
<blockquote class="tr_bq">
<b:include name='page-navi' /></blockquote>
<blockquote class="tr_bq">
</b:if></blockquote>
<blockquote class="tr_bq">
</b:if></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
<div>
<br /></div>
<span style="color: red;">If you can't Find the Old Navigation code  </span>Then Find This  Code:<br />
<br />
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
<b:section class='main' id='main' showaddelement='no'></blockquote>
<blockquote class="tr_bq">
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'></blockquote>
<blockquote class="tr_bq">
...</blockquote>
<blockquote class="tr_bq">
<b:includable id='main' var='top'></blockquote>
<blockquote class="tr_bq">
...</blockquote>
<blockquote class="tr_bq">
</b:includable></blockquote>
<blockquote class="tr_bq">
</b:widget></blockquote>
<blockquote class="tr_bq">
</b:section></blockquote>
<blockquote class="tr_bq">
Insert this code immediately above the </b:includable> tag:</blockquote>
<blockquote class="tr_bq">
<br /></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
<div>
<br /></div>
Insert the Below Code Above<b> <span style="background-color: #f9f9f9; color: #555555; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 11px; font-style: italic; line-height: 20px;"></span></b><br />
  :<b><br /></b>
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
 <b:if cond='data:blog.pageType == "index"'></blockquote>
<blockquote class="tr_bq">
<b:include name='page-navi' /></blockquote>
<blockquote class="tr_bq">
<b:else/></blockquote>
<blockquote class="tr_bq">
<b:if cond='data:blog.pageType == "archive"'></blockquote>
<blockquote class="tr_bq">
<b:include name='page-navi' /></blockquote>
<blockquote class="tr_bq">
</b:if></blockquote>
<blockquote class="tr_bq">
</b:if></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
<div style="font-weight: bold;">
<br /></div>
That's All Now your done! Hope You Understood this Post to Add Beautiful Page Navigation. If you have any doubts Please feel free to contact us.!<br />
<div>
<br /></div>
<div>
<br /></div>
<div>
<br /></div>

Blogger Tricks and Widgets Add Beautiful Page Navigation (in Numbers) Widget on Blogspot/Blogger

Here is a Wonderful Step by Step guide on how to add a beautiful page navigation Widget on blogger blog Adding this widget contai...

Add Top Commentators Widgets with Avatar on Your Blogger/Blogspot Blog!

22:25 0

<div dir="ltr" style="text-align: left;" trbidi="on">
Now Lets See How to add a top commentators widget  for blogspot/blogger blog with avatar easily.<br />
<br />
Screenshots for Top Commentators:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghbmsJbHa1IA2_H14YczJyZDvWpdf098-cxgwdGyLNAUvylmV11TDKsBWEAH7rtdxrDdQVgiF-Sfn7GfIFWOGJdU5_7TYb3jAc_v_4DewOVnfcU7SugGw52LfwEvWxOmVXOv1AWZXIb6g/s1600/top-commentators-gadget-blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghbmsJbHa1IA2_H14YczJyZDvWpdf098-cxgwdGyLNAUvylmV11TDKsBWEAH7rtdxrDdQVgiF-Sfn7GfIFWOGJdU5_7TYb3jAc_v_4DewOVnfcU7SugGw52LfwEvWxOmVXOv1AWZXIb6g/s1600/top-commentators-gadget-blogger.png" /></a></div>
<br />
<br />
How to add? follow the steps below:<br />
<br />
Step1:  Goto Blogger Dashboard and Click on Layout tab and then click on add a gadget--> HTML/Javascript<br />
<br />
Step2: Then Copy the Below code and paste it on the space given on HTML/JavaScript Button.<br />
<br />
<blockquote class="tr_bq">
<br /></blockquote>
<code></code><br />
 <style type="text/css"><br />
.top-commentators {<br />
margin: 3px 0;<br />
border-bottom: 1px dotted #ccc;<br />
}<br />
.avatar-top-commentators {<br />
vertical-align:middle;<br />
border-radius: 30px;<br />
}<br />
.top-commentators .commenter-link-name {<br />
padding-left:0;<br />
}<br />
</style><br />
<script type="text/javascript"><br />
var maxTopCommenters = 8; <br />
var minComments = 1;     <br />
var numDays = 0;         <br />
var excludeMe = true;   <br />
var excludeUsers = ["Anonymous", "someotherusertoexclude"]; <br />
var maxUserNameLength = 42;<br />
//<br />
var txtTopLine = '<b>[#].</b> [image] [user] ([count])';<br />
var txtNoTopCommenters = 'No top commentators at this time.';<br />
var txtAnonymous = '';<br />
//<br />
var sizeAvatar = 33;<br />
var cropAvatar = true;<br />
//<br />
var urlNoAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6X1n5iwSlCxot1I8T-NYhAt7RdEM4CmkmWe-k6JYWeAio3X0gbS0Hukmhpq2TiLKFKYsW1Jp7B8eEEuooqNKYDborf-3pFHza-xB4ZR_GyPsd6Ylbc-XKpTg0jRxxW0sfPwtQduzBcLZK/s1600/avatar_blue_m_96.png" + sizeAvatar;<br />
var urlAnoAvatar = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5OsTpieP6fGXMdpIak3-f3EZkSZp0iKlTwtajqvlT8xjYlzEQQXSIRGW3awkAoLElwRR377YTLHbWjsCBYST9Se4dFg7cBV5FBO6jTaTv4jHg2aCGCZembBGsl9jDizGqb2KB-phh8cOn/s1600/avatar1.png' + sizeAvatar;<br />
var urlMyProfile = '';<br />
var urlMyAvatar = '';<br />
if(!Array.indexOf) {<br />
 Array.prototype.indexOf=function(obj) {<br />
  for(var i=0;i<this.length;i++) if(this[i]==obj) return i;<br />
  return -1;<br />
}}<br />
function replaceTopCmtVars(text, item, position)<br />
{<br />
  if(!item || !item.author) return text;<br />
  var author = item.author;<br />
  var authorUri = "";<br />
  if(author.uri && author.uri.$t != "")<br />
    authorUri = author.uri.$t;<br />
  var avaimg = urlAnoAvatar;<br />
  var bloggerprofile = "http://www.blogger.com/profile/";<br />
  if(author.gd$image && author.gd$image.src && authorUri.substr(0,bloggerprofile.length) == bloggerprofile)<br />
    avaimg = author.gd$image.src;<br />
  else {<br />
    var parseurl = document.createElement('a');<br />
    if(authorUri != "") {<br />
      parseurl.href = authorUri;<br />
      avaimg = 'http://www.google.com/s2/favicons?domain=' + parseurl.hostname;<br />
    }<br />
  }<br />
  if(urlMyProfile != "" && authorUri == urlMyProfile && urlMyAvatar != "")<br />
    avaimg = urlMyAvatar;<br />
  if(avaimg == "http://img2.blogblog.com/img/b16-rounded.gif" && urlNoAvatar != "")<br />
    avaimg = urlNoAvatar;<br />
  var newsize="s"+sizeAvatar;<br />
  avaimg = avaimg.replace(/\/s\d\d+-c\//, "/"+newsize+"-c/");<br />
  if(cropAvatar) newsize+="-c";<br />
  avaimg = avaimg.replace(/\/s\d\d+(-c){0,1}\//, "/"+newsize+"/");<br />
  var authorName = author.name.$t;<br />
  if(authorName == 'Anonymous' && txtAnonymous != '' && avaimg == urlAnoAvatar)<br />
    authorName = txtAnonymous;<br />
  var imgcode = '<img class="avatar-top-commentators" height="'+sizeAvatar+'" width="'+sizeAvatar+'" title="'+authorName+'" src="'+avaimg+'" />';<br />
  if(authorUri!="") imgcode = '<a href="'+authorUri+'">'+imgcode+'</a>';<br />
  if(maxUserNameLength > 3 && authorName.length > maxUserNameLength)<br />
    authorName = authorName.substr(0, maxUserNameLength-3) + "...";<br />
  var authorcode = authorName;<br />
  if(authorUri!="") authorcode = '<a class="commenter-link-name" href="'+authorUri+'">'+authorcode+'</a>';<br />
  text = text.replace('[user]', authorcode);<br />
  text = text.replace('[image]', imgcode);<br />
  text = text.replace('[#]', position);<br />
  text = text.replace('[count]', item.count);<br />
  return text;<br />
}<br />
var topcommenters = {};<br />
var ndxbase = 1;<br />
function showTopCommenters(json) {<br />
  var one_day=1000*60*60*24;<br />
  var today = new Date();<br />
  if(urlMyProfile == "") {<br />
    var elements = document.getElementsByTagName("*");<br />
    var expr = /(^| )profile-link( |$)/;<br />
    for(var i=0 ; i<elements.length ; i++)<br />
      if(expr.test(elements[i].className)) {<br />
        urlMyProfile = elements[i].href;<br />
        break;<br />
      }<br />
  }<br />
  if(json && json.feed && json.feed.entry && json.feed.entry.length) for(var i = 0 ; i < json.feed.entry.length ; i++ ) {<br />
    var entry = json.feed.entry[i];<br />
    if(numDays > 0) {<br />
      var datePart = entry.published.$t.match(/\d+/g);<br />
      var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);<br />
   <br />
      var days = Math.ceil((today.getTime()-cmtDate.getTime())/(one_day));<br />
      if(days > numDays) break;<br />
    }<br />
    var authorUri = "";<br />
    if(entry.author[0].uri && entry.author[0].uri.$t != "")<br />
      authorUri = entry.author[0].uri.$t;<br />
    if(excludeMe && authorUri != "" && authorUri == urlMyProfile)<br />
      continue;<br />
    var authorName = entry.author[0].name.$t;<br />
    if(excludeUsers.indexOf(authorName) != -1)<br />
      continue;<br />
    var hash=entry.author[0].name.$t + "-" + authorUri;<br />
    if(topcommenters[hash])<br />
      topcommenters[hash].count++;<br />
    else {<br />
      var commenter = new Object();<br />
      commenter.author = entry.author[0];<br />
      commenter.count = 1;<br />
      topcommenters[hash] = commenter;<br />
    }<br />
  }<br />
  if(json && json.feed && json.feed.entry && json.feed.entry.length && json.feed.entry.length == 200) {<br />
    ndxbase += 200;<br />
    document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&start-index='+ndxbase+'&alt=json-in-script&callback=showTopCommenters"></'+'script>');<br />
    return;<br />
  }<br />
  // convert object to array of tuples<br />
  var tuplear = [];<br />
  for(var key in topcommenters) tuplear.push([key, topcommenters[key]]);<br />
  tuplear.sort(function(a, b) {<br />
    if(b[1].count-a[1].count)<br />
        return b[1].count-a[1].count;<br />
    return (a[1].author.name.$t.toLowerCase() < b[1].author.name.$t.toLowerCase()) ? -1 : 1;<br />
  });<br />
  var realcount = 0;<br />
  for(var i = 0; i < maxTopCommenters && i < tuplear.length ; i++) {<br />
    var item = tuplear[i][1];<br />
    if(item.count < minComments)<br />
        break;<br />
    document.write('<di'+'v class="top-commentators">');<br />
    document.write(replaceTopCmtVars(txtTopLine, item, realcount+1));<br />
    document.write('</d'+'iv>');<br />
    realcount++;<br />
  }<br />
  if(!realcount)<br />
    document.write(txtNoTopCommenters);<br />
}<br />
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&alt=json-in-script&callback=showTopCommenters"></'+'script>');<br />
</script><br />
</div>
<div>
<br /></div>
<br />
Step3: Then Save it.Now you are done! Thanks for Reading Hope You Understand this.. If you have any Problem With this Please contact us.

Blogger Tricks and Widgets Add Top Commentators Widgets with Avatar on Your Blogger/Blogspot Blog!

Now Lets See How to add a top commentators widget for blogspot/blogger blog with avatar easily. Screenshots for Top Commentators: ...

Simple,Neat and Clean Recent Posts Widget for Blogger Blog

22:01 0

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
Searching for Recent Posts Widget for Blogger? </div>
<div class="separator" style="clear: both; text-align: center;">
Here is the Simple,Clean and Neat Responsive Blogger/Blogspot Recent Posts Widgets</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
Screenshots:</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiG35FDksdmjo8SrFQAD-mTOJ4ak8cxvYNBurGJis6NXpJgc1S_AhZShnT98kubXHQEl-LWkn9jqIjJTJuHXlopa1iiBRmzNrH9UFnjgqZtQ3LJFaZUzJgQZaTehtC1oFd_tgSHs-In0bI/s1600/add+recent+posts+widget+for+blogger+blogspot.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiG35FDksdmjo8SrFQAD-mTOJ4ak8cxvYNBurGJis6NXpJgc1S_AhZShnT98kubXHQEl-LWkn9jqIjJTJuHXlopa1iiBRmzNrH9UFnjgqZtQ3LJFaZUzJgQZaTehtC1oFd_tgSHs-In0bI/s1600/add+recent+posts+widget+for+blogger+blogspot.png" /></a></div>
<br />
<b>For Recent Posts Widgets with snippets</b> Please follow these steps:<br />
<br />
Step1: Goto Blogger Dashboard ---> Layout---> Add a gadget--> HTML/Javascript<br />
<br />
Step2: Add the Following Codes on the space given on HTML/javascript. and Save<br />
<br />
<br />
<blockquote class="tr_bq">
<code><br /></code></blockquote>
<code>
<div id="hlrpsa"><br /><br />
<script src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-snippets.js"><br /><br />
</script><br /><br />
<script><br /><br />
var numposts = <span style="color: red;">5</span>;var showpostdate = false;var showpostsummary = true;var numchars = <span style="color: red;">100</span>;var standardstyling = true;<br /><br />
</script><br /><br />
<script src="http://<span style="color: red;">your-blog</span>.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"><br /><br />
</script></div><br /><br />
<div id="rpdr" style="font-family: arial, sans-serif; font-size: 9px;"><br /><br />
<a href="http://wwesnaps.blogspot.com/search/label/Blogger%20Tricks%20and%20Widgets" target="_blank" title="Grab this Recent Posts Widget">Recent Posts Widget</a> by <a href="http://wwesnaps.blogspot.com" title="Recent Posts Widget">wwesnaps</a></div><br /><br />
<noscript>Your browser does not support JavaScript!</noscript><br /><br />
<style type="text/css"><br /><br />
#hlrpsa a {color: #0B3861; font-size: 13px;} #rpdr {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_p6BCNsLvrn52tuXtCoCIE0G7LDw6Lsds68vyeaN66gaZOVNYcPbi1av0YGEWOuBeMY8m-vRLGek7RyKQe3vBCyR8M3TrfCmNFVx5da33gTjr94JrPTLG_JHgrUfBDM67z8JXcqIZYLDy/s1600/blogger.png) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}<br /><br />
#rpdr, #rpdr a {color:#808080;}<br /><br />
#hlrpsa { color: #999999; font-size: 11px; border-bottom:1px #cccccc dotted; margin-top:-10px; padding-bottom:10px;}<br /><br />
.hlrps a {font-weight:bold; }<br /><br />
.hlrpssumm {}<br /><br />
</style><br />
</code><br />
<code><br /></code>
<code>Replace <span style="color: red;">your-blog </span>with your blog url</code><br />
<code><br /></code>
<code>That's All you are Done now!</code><br />
<code><br /></code>
<code></code><br />
<b>For Recent Posts Widgets without snippets</b> Please follow these steps:<br />
<br />
<br />
Step1: Goto Blogger Dashboard ---> Layout---> Add a gadget--> HTML/Javascript<br />
<br />
Step2: Add the Following Codes on the space given on HTML/javascript. and Save<br />
<div>
<br /></div>
<blockquote class="tr_bq">
<blockquote class="tr_bq">
<code></code></blockquote>
<blockquote class="tr_bq">
 <div id="hlrpsb"></blockquote>
<blockquote class="tr_bq">
<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-titles-only.js"></script></blockquote>
<blockquote class="tr_bq">
<script style="text/javascript">var numposts = 10;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script></blockquote>
<blockquote class="tr_bq">
<script src="http://your-blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div></blockquote>
<blockquote class="tr_bq">
<div style="font-family: arial, sans-serif; font-size: 9px;" id="rpdr"><a href="http://wwesnaps.blogspot.com/search/label/Blogger%20Tricks%20and%20Widgets" title="Grab this Recent Posts Widget" target="_blank">Recent Posts Widget</a> by <a href="http://wwesnaps.blogspot.com" title="Recent Posts Widget">wwesnaps</a></div><noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript></blockquote>
<blockquote class="tr_bq">
<style type=text/css> </blockquote>
<blockquote class="tr_bq">
#hlrpsb a {color: #0B3861; font-size: 13px;} #rpdr {background: url( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_p6BCNsLvrn52tuXtCoCIE0G7LDw6Lsds68vyeaN66gaZOVNYcPbi1av0YGEWOuBeMY8m-vRLGek7RyKQe3vBCyR8M3TrfCmNFVx5da33gTjr94JrPTLG_JHgrUfBDM67z8JXcqIZYLDy/s1600/blogger.png ) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}</blockquote>
<blockquote class="tr_bq">
#rpdr, #rpdr a {color:#808080;}</blockquote>
<blockquote class="tr_bq">
.bbrecpost2 {</blockquote>
<blockquote class="tr_bq">
padding-top:6px;</blockquote>
<blockquote class="tr_bq">
padding-bottom:6px;</blockquote>
<blockquote class="tr_bq">
border-bottom: 1px #cccccc dotted; }</blockquote>
<blockquote class="tr_bq">
</style></blockquote>
<blockquote class="tr_bq">
</blockquote>
</blockquote>
</div>
<blockquote class="tr_bq">
Now replace<span style="color: red;"> your-blog</span> with your blog url</blockquote>
That's all you are done.. Please do share if you liked it..!<br />
<div>
<br /></div>
<br />

Blogger Tricks and Widgets Simple,Neat and Clean Recent Posts Widget for Blogger Blog

Searching for Recent Posts Widget for Blogger? Here is the Simple,Clean and Neat Responsive Blogger/Blogspot Recent Posts Widgets ...

How to Add Robots.txt (Sitemap) and Robots Header Tag in Blogger?

02:45 0

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: left;">
Robots.txt is a sitemap in which we can easily make our website or blog available on google search Properly,On other hand we should use it with Proper manner<span style="font-size: x-small;"> </span>with caution because incorrect use of this feature will make your blog or website ignored by search engines.</div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
How to Add Robots.txt (Sitemap) to my blog?</div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
First go to your blog dashboard and then select on Settings---> Search Preferences-->Custome robots.txt   -->Yes</div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
And then paste the following code on to your blog custom robots.txt space given.</div>
<div style="text-align: left;">
<br /></div>
User-agent: Mediapartners-Google<br />
Disallow:<br />
User-agent: *<br />
Disallow: /search?q=*<br />
Disallow: /*?updated-max=*<br />
Allow: /<br />
Sitemap: http://www.<span style="color: red;">wwesnaps</span>.blogspot.com/feeds/posts/default?orderby=updated<br />
<br />
Replace <span style="color: red;">wwesnaps </span>with your blog url that's all your are done with robots.txt now!<br />
<div style="text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjkkm3Fx3bP0gRU7uacfiWpTM1PqNVmbIMAj3RGRhuvF72EbXE9tmQPc23W6D2ZyDUkUlRBIuhYNEkUM-hhVL6ddKFl2b8nDUPeV2w3XgqdjHvy5jq9r8SAFptV8OUAN-dArhLpKtUvYM/s1600/Capture.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="153" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjkkm3Fx3bP0gRU7uacfiWpTM1PqNVmbIMAj3RGRhuvF72EbXE9tmQPc23W6D2ZyDUkUlRBIuhYNEkUM-hhVL6ddKFl2b8nDUPeV2w3XgqdjHvy5jq9r8SAFptV8OUAN-dArhLpKtUvYM/s1600/Capture.JPG" width="640" /></a></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
How to Use Robots Header tags?</div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
Its Simple got to Settings---> Search Preferences-->Custome robots Header tags   -->Yes</div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
And Check the boxes as given below in the picture</div>
<div style="text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhe7WFxWZXIuW2ZiEGcz_n02QJ3pQDB_PHNkxRuk6k-ICudZUwleLAkl4jvuzA9ULcC4qlgwDXqezQGhdCe0WBQYsvCnSgMrAU_kFXYRIcnk_vp8X9sQGrsywGt7Vp4vW5RxnDsF2yh4Ac/s1600/Capture.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="408" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhe7WFxWZXIuW2ZiEGcz_n02QJ3pQDB_PHNkxRuk6k-ICudZUwleLAkl4jvuzA9ULcC4qlgwDXqezQGhdCe0WBQYsvCnSgMrAU_kFXYRIcnk_vp8X9sQGrsywGt7Vp4vW5RxnDsF2yh4Ac/s1600/Capture.JPG" width="640" /></a></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
Thanks for reading i hope you understood this! Please Share this and help us to grow</div>
</div>

Blogger Tricks and Widgets How to Add Robots.txt (Sitemap) and Robots Header Tag in Blogger?

Robots.txt is a sitemap in which we can easily make our website or blog available on google search Properly,On other hand we should use it...

Best Premium Blogger Templates 2014

06:57 0

<div dir="ltr" style="text-align: left;" trbidi="on">
<h3 style="text-align: left;">
1 - Momento</h3>
<div style="clear: both; text-align: center;">
<img border="0" height="284" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjacNZSioIjxvXyb58AX-F-nWh63HSBTcjavUaeFAGcJ17FEQiz5WIbwDzWaiW1nuDS1ZywwWs2XsG1wetWfVbTa-mwqT8Od8HoGt_J5kR9cJbwUU1dawexTiTbRlOW7kPPmixRFII5QfK0/s640/Momento.png" width="640" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://templateism.com/store/item/preview/momento.html" target="_blank">Demo</a>
<a class="download" href="http://store.templateism.com/2013/10/momento-blogger-template.html" target="_blank">Download</a>
</div>
<br />
<h3 style="text-align: left;">
2 - FlatMag</h3>
<div style="clear: both; text-align: center;">
<img border="0" height="440" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmhdV37e41GckXR1cNETgBfWLYkfzFqpYWSJk8T5Dpdra6CA10sqXP4XEjNO-R7_FI7qNfF40y4tvH8xg4qHHFohOxSyB1ztpjsLxT9Ar3O5kKs_OpQ9-GwgL5haACKG0V4etd2d6NKXcs/s640/FlatMag.png" width="640" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://www.templateism.com/p/preview.html?url=http://flatmag.blogspot.com/" target="_blank">Demo</a>
<a class="download" href="http://www.templateism.com/2013/08/flatmag-responsive-blogger-template.html" target="_blank">Download</a>
</div>
<br />
<h3 style="text-align: left;">
3 - WebMag</h3>
<div style="clear: both; text-align: center;">
<img border="0" height="490" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTTQcPtvTdfcmPqZRFcVwhcQ64hN-FybUo4jNKgyIBvrCXvmKn9Bt5EGcLw5ntI7emroz4xvKNkHGZXLmYggn5NQ2QMQFbIChDzD2DDBUBzQNEYTe_AeHi1e0aHy0UaNtDI7zn1L3wRw3r/s640/WebMag.png" width="640" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://www.templateism.com/p/preview.html?url=http://webdesignmeg.blogspot.com/" style="font-family: '';" target="_blank">Demo</a><span style="font-family: '';"> </span><a class="download" href="http://www.templateism.com/2013/05/webmag-blogger-template.html" style="font-family: '';" target="_blank">Download</a>
</div>
<br />
<h3>
4 - XPress News</h3>
<div style="clear: both; text-align: center;">
<img border="0" height="382" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAoUscVv_j00Nfg-WiTeg5pqI3lm5p086muHq2x9i2pSs2UgVwS9AlMot-5e0ToisI8VpU-AcBE5S9rrdZOYxJFfzG-HFERebcIXTbYE1dyFLZio3FK2h6zNEE8TwRMZ-0lnfV-QQyx900/s640/XPress+News.png" width="640" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://themeforest.net/item/xpress-news-responsive-blogger-magazine/full_screen_preview/6539139" target="_blank">Demo</a>
<a class="download" href="http://themeforest.net/item/xpress-news-responsive-blogger-magazine/6539139?ref=rafaytutorials" target="_blank">Download</a>
</div>
<br />
<h3 style="text-align: left;">
5 - BlackNews</h3>
<div style="clear: both; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG0yBW0VjixmRoqo2Oh517meeu7g3Z6prr2xxzQ6KQfHvDOMzmnqeFPu3ynRPXaLAXP96XhZXnjOKcPz38VarXp09aps4t1h0X87vGYNDP3PaAEyuNvwcIY76SAoEZbATlptcWQqB09msq/s1600/BlackNews.png" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://themeforest.net/item/blacknews-news-magazine-premium-blogger-theme/full_screen_preview/6349355" target="_blank">Demo</a>
<a class="download" href="http://themeforest.net/item/blacknews-news-magazine-premium-blogger-theme/6349355?ref=rafaytutorials" target="_blank">Download</a>
</div>
<br />
<h3 style="text-align: left;">
6 - Apriezt</h3>
<div style="clear: both; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHgcl1yc1FenpmYQbf3tSVjNlU9AgzXrXUrXmm6T2Z_ABMLSbSC0Arg2nzYzeHIb0EjUn-GjWKxSJgN0LZ-JOIV3nn1B0UOc4IkPMBn0N62YP2v4dUh_YhA3v6n7ozrDEDXQxtZlLfvGSF/s1600/Apriezt.png" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://themeforest.net/item/apriezt-responsive-magazinenews-blogger-theme/full_screen_preview/6339405" style="font-family: '';" target="_blank">Demo</a><span style="font-family: '';"> </span><a class="download" href="http://themeforest.net/item/apriezt-responsive-magazinenews-blogger-theme/6339405?ref=rafaytutorials" style="font-family: '';" target="_blank">Download</a>
</div>
<br />
<h3 style="text-align: left;">
7 - Blogzon</h3>
<div style="clear: both; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2DYIbre4A4emrBWQkuB_sUXbzv55EM3je48fgTDM7rliW9CiN5LERmAcU1VBYrk7NIw4-6esB6zecOZLGAQk6Bq3KhTVXG7eTLTWBoTg3yL-iIOQZyE5045hijxo1iiKIX0QDeS_mNnWw/s1600/Blogzon.jpg" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://themeforest.net/item/blogzon-responsive-and-multipurpose-template/full_screen_preview/6193685" target="_blank">Demo</a><span style="font-family: '';"> </span><a class="download" href="http://themeforest.net/item/blogzon-responsive-and-multipurpose-template/6193685?ref=rafaytutorials" target="_blank">Download</a>
</div>
<br />
<h3 style="text-align: left;">
8 - Ijonkz</h3>
<div style="clear: both; text-align: center;">
<img border="0" height="324" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzohkd2-xVibWG7yhOjOL2OdWFeV4lo1cPNg_hjW2KwgVVT0Nsbl2J_sr7w0BDmawhqdoQ_4iQdwSmaOFP8DBjiWanduyXYE1LZaDscTNbou_63ojqPJo_UeFZea3UTvAiUUzZ1BGOATFO/s640/Ijonkz.png" width="640" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://themeforest.net/item/ijonkz-responsive-magazinenews-blogger-template/5958442" target="_blank">Demo</a><span style="font-family: '';"> </span><a class="download" href="http://themeforest.net/item/ijonkz-responsive-magazinenews-blogger-template/5958442?ref=rafaytutorials" target="_blank">Download</a>
</div>
<br />
<h3 style="text-align: left;">
9 - Flat News</h3>
<div style="clear: both; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEoqzHL3I6nuFwaCd00yiJi3fc8rUmchPNoL2HMdvq51WtOTuxj3lWgLeTjMCkglPZWCKheoIWJtkL9AI9biNIy53qsRMKGOxSCUKL6_0b53y4PB9EglBHMAo-uYppWv_jVYzsmfGJ_Ayv/s1600/Flat+News.png" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://themeforest.net/item/flat-news-easy-news-magazine-template/full_screen_preview/5379218" target="_blank">Demo</a>
<a class="download" href="http://themeforest.net/item/flat-news-easy-news-magazine-template/5379218?ref=rafaytutorials" target="_blank">Download</a>
</div>
<br />
<h3 style="text-align: left;">
10 -Geek Press</h3>
<div style="clear: both; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmQqW0ANHB7HUdExL2uSfot7iWkzez-skUUvAU8L5csWtHRJMSd4lK5gCE8QUF2tbEzzJmF6yOVaVN83RUhxUNLZzS3uh9ZyCqYdwDWMBSWbxWbw7fF38LTuaCwAxsspnSQ_4NyJYILScO/s1600/Geek+Press.png" /></div>
<div>
</div>
<div class="d-down">
<a class="demo" href="http://themeforest.net/item/geek-press-responsive-news-magazine-template/full_screen_preview/5716407" target="_blank">Demo</a>
<a class="download" href="http://themeforest.net/item/geek-press-responsive-news-magazine-template/5716407?ref=rafaytutorials" target="_blank">Download</a>
</div>
</div>

Blogger Tricks and Widgets Best Premium Blogger Templates 2014

1 - Momento Demo Download 2 - FlatMag Demo Download 3 - WebMag Demo Download 4 - XPress News Demo ...