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

seo How move Blog Post Footer Widget in Blogger 2013

Seo Master present to you:
Today We Discuss How to move Blogger post Widget in Blogger post Footer,Its easy how to Move it.because Some time Blogger post Footer Sown Sharing And like Box.So if you remove this widget Follow These instructions.Some time You install New Blogger Templates .Template have Also Shearing Widget And social media.Some Time Blogger show in Footer Blogger Widget Shearing So if you want to remove this.Some This Widget Not Show in Blogger post Widget Footer.let's Do we back How Do This job.


Follow These Steps.

  • Go to your Dashboard >> layout >> Edit "HTML/Javascript" Widget

Find the following line of code near the bottom

  • container.insertBefore(n,footer);
When You Find Change it to this.
footer.childNodes[1].insertBefore(n,footer.childNodes[1].firstChild);
And the widget should appear in your post footer like below Snapshot Given.


To get the widget to appear after the first line use this code instead:
footer.childNodes[1].appendChild(n);
And it will show up like this Given Below Snapshot.


2013, By: Seo Master

seo How to Highlight Blog Author Comments in Blogspot/blogger 2013

Seo Master present to you:
How to Highlight Blog Author Comments in Blogspot/blogger
This Tutorial We Learn  How to Highlight Blog Author Comments in Blogspot/blogger,its Amazing And Atractive Effect in Blogger And Vister like This.You Can Add Any Color In Your Blogger Comments Background,How We Can Change This below Given all Instructions.Follow All instructions.When you Done this Steps hope your background Wiil be changed.


Follow These Steps.

  • Go to >> Blogger.com
  • Go To >> Template
  • Next Go >> Edit HTML
  • Find This Code Given below.
</body>

  • Just above it, paste the following code Given below.


<script src='http://code.jquery.com/jquery-latest.js'/>
<script>
$(function() {
function highlight(){
$('.user.blog-author').closest('.comment-block')
.css('border', '1px solid #FFA500')
.css('background','#F1F1F2 url("http://www.blogblog.com/1kt/transparent/white80.png")')
.css('color', '#444444')
.css('font-size', '12px')
.css('padding', '10px');
}
$(document).bind('ready scroll click', highlight);
});
</script>

How To Customization:

You Can Change All Colors Starting tags Is



2013, By: Seo Master

seo How Add Related Posts Widget For Blogger With Thumbnails 2013

Seo Master present to you:
How Add Related Posts Widget For Blogger With Thumbnails
This Tutorial We Learn How Add Related Posts Widget For Blogger With Thumbnails.its Amazing Css Ctyles We Learn This post how we can use this,its Amazing method For Increase traffic And And show old Post Below New post.when visit your post And End of The post New Related Posts Show With thumbline.let's we back and how we can do this.Follow Some Below given steps And put Carefully Css Codes.

Follow These steps.



  • Go To >> Blogger Dashboard >> Template >>Edit HTML.
  • Check the "Expand widgets template" box.
  • Search (CTRL + F) for this piece of code </head> 


Copy And Past Before/Above </head>

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'><style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 18px;
letter-spacing: 2px;
font-weight: bold;
text-transform: none;
color: #5D5D5D;
font-family: Arial Narrow;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
border-right: 1px dotted #DDDDDD;
color:#5D5D5D;
}
#related-posts a:hover{
color:black;
background-color:#EDEDEF;
}
</style>
<script type='text/javascript'>
var defaultnoimage=&quot;http://www.matrixar.com/-PpjfsStySz0/UF91FE7rxfI/AAAAAAAACl8/092MmUHSFQ0/s1600/no_image.jpg&quot;;
var maxresults=5;
var splittercolor=&quot;#DDDDDD&quot;;
var relatedpoststitle=&quot;Related Posts&quot;;
</script>
<script src='http://helplogger.googlecode.com/svn/trunk/related-posts-with-big-thumbnails.js' type='text/javascript'/>
<!-- remove --></b:if><!--Related Posts with thumbnails Scripts and Styles End-->

Note. If You Want More Change Value Show Post "var maxresults=5; You Can Change 5.

Now Next Find the Following code.

<div class='post-footer'>

Now Next  just above it, copy and paste the below code.


<!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'><div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if><b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.matrixar.com'><img alt='Blogger Tricks' src='http://www.matrixar.com/-K65p5zLLKQk/T3ObCINoP7I/AAAAAAAABmI/dF84-alnOu4/s1600/best+blogger+tips.png'/></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->

Note. Change the 6 value from max-results=6 with the number of posts you want to be displayed.

Now Save Your Template And you Done It.


2013, By: Seo Master

seo Ads Banners with CSS Effects also used in Spice Up Your Blogger 2013

Seo Master present to you:

This Tutorial About How Add We Ads Banners with CSS Effects also used in Spice Up Your Blogger.Now a Days its Amazing method For earning.So We can put banners on the bloggers and Advertisement here And When When Some Body Ask You you Will Pay And put Ads Where customer Want.Now We Can See Lot of Sites Authors Put css Stylish Ads And Earning.if you want to get more earning so put the ads your site and create page name of advertisement here.some time we vwaste time and empty hand,so don't waste your time if you want earning more mony,so we back and start job.first you decite where you put this ads,side bar is the best for puting ads 125*125 and 250*300  let's we start how we can do this.its easy and stylish.


How To Do This Just Follow The Steps Given Below.



  • Go to >> Blogger >> Layout >> Edit HTML.
  • Backup your template
  • Search for ]]></b:skin> and just above past The Code.
  • Click Save Template
  • Go to "Layout" ---> Click on Add Gadget ---> create new HTML / JavaScript.
  • Copy the code, Code Given Below.
  • Don't Try Changing This Code When Is Not Working.

/* -------------------www.matrixar.com Ads------------------*/
div.bsap_125 a{width:125px;display:block;font-size:11px;color:#888;font-family:verdana,sans-serif;text-align:center;text-decoration:none;overflow:hidden;float:left;line-height:100%;margin:0 4px 10px 0;}
div.bsap_125 img{border:2px solid #ddd;clear:right;padding:5px;}
div.bsap_125 a.adhere{color:#666;font-weight:bold;font-size:12px;border:2px solid #ccc;background:#e7e7e7;text-align:center;width:125px;height:125px;line-height:1000%;}
div.bsap_125 a.adhere:hover{border:2px solid #999;background:#ddd;color:#333;}
html>
body div.bsap_125 a.adhere{width:123px;height:123px;}
div.bsap_468 a{width:468px;display:block;font-size:11px;color:#888;font-family:verdana,sans-serif;text-align:center;text-decoration:none;overflow:hidden;line-height:100%;margin:0;}
div.bsap_468 img{border:0;clear:right;}
div.bsap_468 a.adhere{color:#666;font-weight:bold;font-size:12px;border:1px solid #ccc;background:#e7e7e7;text-align:center;width:468px;height:60px;line-height:480%;}
div.bsap_468 a.adhere:hover{border:1px solid #999;background:#ddd;color:#333;}
html>
body div.bsap_728 a.adhere{width:726px;height:90px;}
div.bsap_728 a{width:468px;display:block;font-size:11px;color:#888;font-family:verdana,sans-serif;text-align:center;text-decoration:none;overflow:hidden;line-height:100%;margin:0;}
div.bsap_728 img{border:0;clear:right;}
div.bsap_728 a.adhere{color:#666;font-weight:bold;font-size:12px;border:1px solid #ccc;background:#e7e7e7;text-align:center;width:128px;height:90px;line-height:730%;}
div.bsap_728 a.adhere:hover{border:1px solid #999;background:#ddd;color:#333;}
html>
body div.bsap_336 a.adhere{width:334px;height:280px;}
div.bsap_336 a{width:468px;display:block;font-size:11px;color:#888;font-family:verdana,sans-serif;text-align:center;text-decoration:none;overflow:hidden;line-height:100%;margin:0;}
div.bsap_336 img{border:0;clear:right;}
div.bsap_336 a.adhere{color:#666;font-weight:bold;font-size:12px;border:1px solid #ccc;background:#e7e7e7;text-align:center;width:336px;height:280px;line-height:2200%;}
div.bsap_336 a.adhere:hover{border:1px solid #999;background:#ddd;color:#333;}
html>
body div.bsap_468 a.adhere{width:466px;height:58px;}
.bsap a{text-shadow:1px 1px 1px #111!important;color:#eee!important;overflow:visible!important;-webkit-transition:all .2s ease;-moz-transition:all .2s ease;-o-transition:all .2s ease;border:0 none!important;-webkit-border-top-left-radius:80px;-webkit-border-bottom-right-radius:80px;-moz-border-radius-topleft:80px;-moz-border-radius-bottomright:80px;border-top-left-radius:80px;border-bottom-right-radius:80px;margin:0 10px 10px 0 !important;padding:7px!important;}
.bsap a:hover{-webkit-border-top-left-radius:40px;-webkit-border-bottom-right-radius:40px;-moz-border-radius-topleft:40px;-moz-border-radius-bottomright:40px;border-top-left-radius:40px;border-bottom-right-radius:40px;}
.bsap a img{border:0 none!important;-webkit-box-shadow:0 0 8px rgba(0,0,0,0.5);-moz-box-shadow:0 0 8px rgba(0,0,0,0.5);box-shadow:0 0 8px rgba(0,0,0,0.5);padding:3px!important;}
.bsap .even{margin-right:0!important;}
.bsap .ad1{background:#e42b2b!important;}
.bsap .ad2{background:#ff8400!important;}
.bsap .ad3{background:#a800ff!important;}
.bsap .ad4{background:#49a7f3!important;}
.bsap .ad5{background:#41d05f!important;}
.bsap .ad6{background:#B24700!important;}
.bsap .ad7{background:#FFE500!important;}
.bsap .ad8{background:#007D47!important;}
.bsap .ad9{background:#330000!important;}
.bsap .ad10{background:#990000!important;}
.bsap .ad11{background:#f70000!important;}

The size of 125x125 Code Given Below.

<center>
<div id="bsap_125" class="bsap_125 bsap">
<a href="ADVERTISE URL" class="ad1" title="Ad Title" id="bsa_1451626" target="_blank"> <img src = "IMAGE URL "alt ="AdName"height =" 125 "width =" 125 "/> </a>
<a href="ADVERTISE URL" class="ad2 even" title="Ad Title" target="_blank"> <img src = "IMAGE URL"alt =" AdName "height =" 125 "width =" 125 "/> </a>
<a href="ADVERTISE URL" class="ad3" title="AdTitle" target="_blank"> <img src = "IMAGE URL "alt =" AdName "height =" 125 "width =" 125 "/> </a>
<a href="ADVERTISE URL" class="ad4 even" title="Ad Title" target="_blank"> <img src = "IMAGE URL"alt =" AdName "height =" 125 "width =" 125 "/> </a>
</div></center>

The size of 468x60 Code Given Below.


<center>
<div id="bsap_468" class="bsap_468 bsap">
<a href="ADVERTISE URL" class="ad5" title="Ad Title" id="bsa_1451626"
target="_blank"> <img src = "IMAGE URL "alt ="AdName"height =" 60
 "width =" 468 "/> </ a>
</ Div>
</ Center>

The size of 728x90 Code Given Below.


<center>
<div id="bsap_728" class="bsap_728 bsap">
<a href="ADVERTISE URL" class="ad6" title="Ad Title" id="bsa_1451626"
target="_blank"> <img src = "IMAGE URL "alt ="AdName"height =" 90
 "width =" 728 "/> </ a>
</ Div>
</ Center>

The size of 336x280Code Given Below.

<center>
<div id="bsap_336" class="bsap_336 bsap">
<a href="ADVERTISE URL" class="ad8" title="Ad Title" id="bsa_1451626"
target="_blank"> <img src = "IMAGE URL "alt ="AdName"height =" 280
 "width =" 336 "/> </ a>
</ Div>
</ Center>

How Customize Changings Tthis Code.

  • ADVERTISE URL - In Aqua Color Highlight Replace to your advertiser URL.
  • IMAGE URL - Replace to your advertiser image ULR.
  • NOTE: The one Highlighted with Yellow should be changed with any thing you like among ad1 - ad11 (It changes the color of the background image)
  • Good luck. If you any doubts please ask by commenting below,i will Reply Soon Is Possibale...
  • Now If  You Like This post So Please Share It.

2013, By: Seo Master
Powered by Blogger.