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

Loading...
Seo Master present to you:

Adding Mashable WordPress Stylish Social Subscription Form Blogger/blog

This Tutorial All About How To Add Mashable WordPress Style Social Subscription Form To Blogger/blog.i Will Try that how we can Add This own blogger and Blog.
How To Add Mashable WordPress Style Social Subscription Form To Blogger/blog


Five Easy Steps Follow
  • Login to your Blogger Dashboard.
  • Click the drop-down menu and select "Layout".
  • Click on an "Add a Gadget" link.
  • Scroll and find "HTML/JavaScript".
  • Copy the code below and paste it inside the "Content Box".
<!--WordPress Style Social Subscription Form By www.www.matrixar.com-->
<style>

.Subscribe-BH h6{
background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVIG3t8YlGO5djmFxNJjwy8gAqDiujZLwBNtwyNUskyqwKO-Nm7_jK6Pdv84NJEYahgs4pIxz1iFTAeJEk-mDEp4gFwUYzBas2N8HX6LnCM-r-z5OBh4H-5rvNjIey9oZnY6Ik0BeUa28/s300/Subscribe%252Bblogger%252Bheroe.gif) no-repeat;height:50px;
margin:0px 0 0px 0;
padding:0px 20px 0px 0px;
font-size:0px;
font-family:Sans-serif, Arial, Helvetica;
font-weight:bold;
text-transform:uppercase;
color:#ffffff;
text-shadow:0 1px 0 #fff;
}

ul.social {
list-style: none;
margin: 10px;
overflow: hidden;
}

.social li {
float: left;
background: none !important;
padding: 0 !important;
margin: 0 8px;
}

.social li a {
display: block;
width: 50px;
height: 40px;
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeW0fD4hX0DW35Zj97O1nmGVN4edko-2vScfQu8p6ny-8YbKPVE-A30YLv6rPc9qsp-KDLDLYOQ8SRwdi17_Mdt_eFlCNbqbwiyZdLdtQRbCoTp3DCLqH3Cj_jrrAqpZseRgHoM0HhD8zZ/s250/Subscribe%252Bbloggerheroe%252BSocial.png") no-repeat transparent;
text-indent: -99999em !important;
-webkit-transition: ease-in 0.15s all;
-moz-transition: ease-in 0.15s all;
-o-transition: ease-in 0.15s all;
-ms-transition: ease-in 0.15s all;
transition: ease-in 0.15s all;
}

.social li a:hover {
padding: 0 !important;
}

.social li.rssicon a {
background-position: 0 0;
border-right: 1px solid #e6e6e6;
}

.social li.twicon a {
background-position: -50px 0;
border-right: 1px solid #e6e6e6;
}

.social li.fbicon a {
background-position: -100px 0;
border-right: 1px solid #e6e6e6;
}

.social li.gicon a {
background-position: -150px 0;
border-right: 1px solid #e6e6e6;
}

.social li.pinicon a {
background-position: -200px 0;
}

.social li.rssicon a:hover {
background-position: 0 -50px;
border-right: 1px solid #e6e6e6;
}

.social li.twicon a:hover {
background-position: -50px -50px;
border-right: 1px solid #e6e6e6;
}

.social li.fbicon a:hover {
background-position: -100px -50px;
border-right: 1px solid #e6e6e6;
}

.social li.gicon a:hover {
background-position: -150px -50px;
border-right: 1px solid #e6e6e6;
}

.social li.pinicon a:hover {
background-position: -200px -50px;
}

.Subscribe-BH{
width: 300px;
float: left;
}

.Subscribe-BH .count{
color:#F17C18;
font-size: 14px;
font-weight: bold;
font-family: Helvetica, Arial;
height: 40px;
line-height: 40px;
vertical-align: middle;
width: 310px;
padding: 0 0px 0 4px;
margin:0;
}  

.Subscribe-BH .count span.bigcount{
color:#F17C18;
font-size: 24px;
font-family: Helvetica, Arial;
line-height: 39px;
vertical-align: middle;
margin:0px;
padding:10px 0px 0px 0;
}  

.Subscribe-BH .subicons{
border-bottom: 1px solid #e6e6e6;
margin: 0px 0 0px 0;
float: left;
width: 300px;
font-family: Helvetica, Arial; font-size: 12px;
}  

.Subscribe-BH .emailsub{
border-bottom: 0px solid #e6e6e6;
padding: 15px 0 0px 0;
float: left;
width: 100%;
font-family: Helvetica, Arial;
}  

.Subscribe-BH .emailsub .emailicon{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNu8DVq_cJIIHfPcB9GWgE7ynh6A8hKzI7usq43T3fzUG2W7aLZPLotTHu9RW7WFoEuxvxOPMzrcHR0rQJYuEUR0D3noPDomnskBfRgy4GFOfbsvNk6rsOWJtb1agngEJvOJBrapkfVOyX/s32/Subscribe%252Bblogger%252Bhero%252Bsubscribe.png) no-repeat 0 2px;
float: left;
padding: 0px 15px 10px 40px;
margin: 0 0 0 5px;
width: 300px;  line-height: 20px;
vertical-align: middle;
font-size: 14px;
color: #333;
}

.emailbutton{
background:#f7f8f9;
background:-webkit-gradient(linear,left top,left bottom,color-stop(#f7f8f9,0),color-stop(#e9e9e9,1));
background:-webkit-linear-gradient(top, #f7f8f9 0%, #e9e9e9 100%);
background:-moz-linear-gradient(top, #f7f8f9 0%, #e9e9e9 100%);
background:-o-linear-gradient(top, #f7f8f9 0%, #e9e9e9 100%);
background:linear-gradient(top, #f7f8f9 0%, #e9e9e9 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f8f9', endColorstr='#e9e9e9',GradientType=0 );
border:1px solid #ddd;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
padding:6px 12px;
margin:0;
-webkit-box-shadow:0 1px 0 #f9f9f9 inset, 1px 1px 1px rgba(223,223,223,0.4);
-moz-box-shadow:0 1px 0 #f9f9f9 inset, 1px 1px 1px rgba(223,223,223,0.4);
box-shadow:0 1px 0 #f9f9f9 inset, 1px 1px 1px rgba(223,223,223,0.4);
color:#888;
text-shadow:0 1px 0 #fff;
line-height:1.2;
cursor:pointer;
font-size:13px;
}

.emailbutton:hover{
background:#f1f1f1;
background:-webkit-gradient(linear,left top,left bottom,color-stop(#f1f1f1,0),color-stop(#e0e0e0,1));
background:-webkit-linear-gradient(top, #f1f1f1 0%, #e0e0e0 100%);
background:-moz-linear-gradient(top, #f1f1f1 0%, #e0e0e0 100%);
background:-o-linear-gradient(top, #f1f1f1 0%, #e0e0e0 100%);
background:linear-gradient(top, #f1f1f1 0%, #e0e0e0 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#e0e0e0',GradientType=0 );
text-decoration:none !important;
}

.email{
clear:both;
width:100%;
margin:10px 0;
}

.emailform{
position:relative;
width:300px;
margin:0 auto;
}

.emailinput{
width:200px;
height:18px;
margin:0 auto;
padding:8px 40px 8px 10px;
border:1px solid #ddd;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
font-family:georgia;
font-style:italic;
-webkit-box-shadow:1px 1px 2px #dfdfdf;
-moz-box-shadow:1px 1px 2px #dfdfdf;
box-shadow:1px 1px 2px #dfdfdf;
font-size:14px;color:#666;
}

.emailbutton{
-webkit-border-top-right-radius:4px;
-webkit-border-bottom-right-radius:4px;
-moz-border-radius-topright:4px;
-moz-border-radius-bottomright:4px;
border-top-right-radius:4px;
border-bottom-right-radius:4px;
-webkit-border-top-left-radius:0px;
-webkit-border-bottom-left-radius:0px;
-moz-border-radius-topleft:0px;
-moz-border-radius-bottomleft:0px;border-top-left-radius:0px;
border-bottom-left-radius:0px;
padding:9px;
position:absolute;
right:-2px;
top:0;
display:block;
line-height:16px;
}

.emailbutton{
padding:8px !important;
}

.emailform, .emailinput{
width:98% !important;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
height:auto;
}

</style>

<p style="display:none;">Email Subscription box by<a href="http://www.www.matrixar.com/">Imtiaz Ahmed</a></p>

<div class="Subscribe-BH">

<h6 class='title'>Subscribe Now!</h6>

<div class="count">
<span class="bigcount">
<a href="http://feeds.feedburner.com/imtiazbloggertrick"><img src="http://feeds.feedburner.com/~fc/imtiazbloggertrick?bg=F17C18&amp;fg=000000&amp;anim=1" height="26" width="88" style="border:0" alt="" /></a>
</span>  Learn Pro Tricks daily </div>

<div class="subicons">
<ul class="social">

<li class="rssicon">
<a href="http://feeds.feedburner.com/imtiazbloggertrick" rel="nofollow" target="_blank">Rss</a></li>

<li class="twicon">
<a href="http://twitter.com/itsimtiazforum" rel="nofollow" target="_blank">Twitter</a></li>

<li class="fbicon">
<a href="http://www.facebook.com/imtiazbloggertrick" rel="nofollow" target="_blank">FaceBook</a></li>

<li class="gicon">
<a href="https://plus.google.com/114713654938026424676/" rel="nofollow" target="_blank">Google+</a></li>

<li class="pinicon">
<a href="http://pinterest.com/itsimtiazforum" rel="nofollow" target="_blank">Pinterest</a></li>

</ul>
</div>

<div class="emailsub">
<div class="emailicon">
<p style=" width:240px;
color:#3A3A3A;
font-size: 13px;
font-weight: normal;
font-family: Helvetica, Arial;
padding:0;
margin:0;
">Receive Quality Tutorials Straight in your Inbox   by submitting your Email ID below.</p>
</div>  

<div class="email">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=imtiazbloggertrick', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="emailform">

<input type="hidden" value="Bloggerheroe" name="uri" />
<input type="hidden" name="loc" value="en_US" /> <input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" class="emailinput" /> <input type="submit" class="emailbutton" value="Submit" title='' /></form></div></div></div>
<!--WordPress Style Social Subscription Form By www.www.matrixar.com-->

Make these Some important changes This Code.

Please Change Only Highlights Codes Such as imtiazbloggertrick  and  itsimtiazforum

i Hope You Are Done It.. 2013, By: Seo Master

seo How To Add Mashable WordPress Style Social Subscription Form To Blogger/blog 2013

Seo Master present to you: Adding Stylish Animated Blogger Recent Posts Widget

In This Post I Will help You How Add Recent post Widgets in Blogger/Blog Templates.This Tutorial all About blogger recent post.
How To Add Stylish Animated Blogger Recent Posts Widget

Three Easy Steps Follow.
  • Log in to blogger Design > Page Element. 
  • Click Add Gadget and select 'HTML/Javascript 
  •  Now Paste Below code.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>    
    <style type="text/css" media="screen">     
    <!--
    #spylist {    
    overflow:hidden;     
    margin-top:5px;     
    padding:0px 0px;     
    height:350px;     
    }     
    .spydate{     
    overflow:hidden;     
    font-size:10px;  }

    #spylist ul{     
    width:350px;     
    overflow:hidden;     
    list-style-type: none;     
    padding: 0px 0px;     
    margin:0px 0px;     
    }     
    #spylist li {     
    width:230px;     
    background: #1ed2f2;
    list-style-type: none;
    margin:0 0 5px 0px;
    padding:5px 5px 1px 10px !important;
    -webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-o-transition:all 0.2s ease;border: 0 none !important;-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;
    }    

    #spylist li:hover {
    background: #84f6f5;

    }

    #spylist li a {    
    text-decoration:none;     
    color:#4B545B;     
    font-size:11px;     
    height:18px;     
    overflow:hidden;     
    margin:0px 0px;     
    padding:0px 0px 2px 0px;     
    }     

    #spylist li img {     
    float:left;     
    margin-right:5px;
    margin-top:3px;      
    background:none;     
    border:0;     
    }     

    .spycomment{    
    overflow:hidden;     
    font-family:Tahoma,Arial,verdana, sans-serif;     
    font-size:10px;     
    color:#262B2F;     
    padding:0px 0px;     
    margin:0px 0px;     
    }
    -->
    </style>
     <script language='JavaScript'>


    imgr = new Array();

    imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

    imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

    imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

    imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

    imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
    showRandomImg = true;

    boxwidth = 255;

    cellspacing = 6;

    borderColor = "#232c35";

    bgTD = "#000000";

    thumbwidth = 70;

    thumbheight = 70;

    fntsize = 12;

    acolor = "#666";

    aBold = true;

    icon = " ";

    text = "comments";

    showPostDate = false;

    summaryPost = 40;

    summaryFontsize = 10;

    summaryColor = "#666";

    icon2 = " ";

    numposts = 5;

    home_page = "http://www.matrixar.com/";

    limitspy=4
    intervalspy=4000

    </script>

    <div id="spylist">
        <script src='http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/recentpostthumbspy-min.js' type='text/javascript'></script>
    </div><a style=" float:right;font-size:8px; color:#3B78CD; text-decoration:none;" href="hhh">Blogger widget</a>

  • Now After paste above code  
  • Replace http://www.matrixar.com/ with your Site URL 
  • Now save your HTML/Javascript'. 
i Hope You are done it. 2013, By: Seo Master

seo How To Add Stylish Animated Blogger Recent Posts Widget 2013






Cara mudah mengganti password gmail Google - Setelah anda membuat gmail tentunya anda ingin agar akun anda ini tetap aman dari jangkauan para pembobol data di luar sana. Sebenarnya tidak ada jalan yang 100% bekerja untuk masalah yang satu ini, tapi satu hal yang bisa kita lakukan adalah dengan rutin mengubah password.



Perlu dicatat bahwa password yang sudah pernah digunakan sudah tidak

seo Cara Mudah Mengganti Password GMAIL Google 2013

Powered by Blogger.
Design by Dev Nasser