Berikut Ini Cara Membuat Email Subscribe Keren Di Blog :
1. Masuk ke feedburner.google.com (aktifkan feedburner sobat)
2. Masuk atau Login ke Blogger.
3. Kemudian Pilih Tata Letak → Tambah Gadget → HTML / Javascript.
4. Selanjutnya copy dan pastekan kode dibawah ini :
<style>5. Simpan dan lihat hasilnya.
#dgenera-blog {
border: 0;
margin-bottom: 10px;
margin: 0 auto;
width:300px;
}
#email-news-subscribe .email-box{
padding: 5px 5px;
font-family: "Arial","Helvetica",sans-serif;
height:38px;}
#email-news-subscribe .email-box input.email{
background:#FFFFFF;
border: 1px solid #dedede;
color: #999;
padding: 7px 10px 8px 10px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
border-image: initial;
font-family: "Arial","Helvetica",sans-serif;}
#email-news-subscribe .email-box input.email:focus{color:#333}
#email-news-subscribe .email-box input.subscribe{
background: -moz-linear-gradient(center top,#666 0,#333 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#666),color-stop(1,#333));
font-family: "Arial","Helvetica",sans-serif;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border:1px solid #333;
color:white;
padding:7px 14px;
margin-left:3px;
font-weight:bold;
font-size:12px;
cursor:pointer;
border-image: initial;}
#email-news-subscribe .email-box input.subscribe:hover{
background-image:-moz-linear-gradient(top,#333,#666);
background-image:-webkit-gradient(linear,left top,left bottom,from(#333),to(#666));
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#ebebeb);
outline:0;-moz-box-shadow:0 0 3px #999;
-webkit-box-shadow:0 0 3px #999;
box-shadow:0 0 3px #999
-pie-background:linear-gradient(270deg,#ffda4d,#ff9b00);
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border:1px solid #333;
color:#FFFFFF;
}
#other-social-bar {
padding: 0px;
overflow: hidden;
height:37px;
margin-top:-8px;
}
#other-social-bar ul {list-style: none outside none; padding-left: 4px;}
#other-social-bar .other-follow {
float: left;
overflow: hidden;
padding:5px;
width: 270px;}
#other-social-bar .other-follow ul {
list-style: none outside none;
padding-left: 4px;}
#other-social-bar .other-follow li {
display:inline;
border:0;
}
#other-social-bar .other-follow li a {
font-size: 12px;
color:#666;
font-weight: bold; font-family:arial;
display:inline;
}
#other-social-bar .other-follow li.my-rss {
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpvJzhfRz7WRB2eWDNKAWUkFALQsA2llu2s5U7DjkyCLPtZVja6G5ida-S2-X5h7EXf9UploAr2wYHtrZ5ETaFCR5VwR2EzY9KvAMkTOp_Yjo6_ErVFVl9iRmZmNmP0AshVLaPEBipxvrj/h120/rss-16x16.png') no-repeat transparent;
line-height: 1;
padding: 0px 3px 1px 20px;
width: 60px;
margin-bottom:0px;
margin-left:5px;}
#other-social-bar .other-follow li.my-rss a, #other-social-bar .other-follow li.my-twitter a, #other-social-bar .other-follow li.my-gplus a{
text-decoration:none;
}
#other-social-bar .other-follow li.my-rss a:hover, #other-social-bar .other-follow li.my-twitter a:hover, #other-social-bar .other-follow li.my-gplus a:hover{
text-decoration:underline;
}
#other-social-bar .other-follow li.my-twitter {
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw5oU1k7r8mbo3LphUW6_jl2xDXq1sSg2P7bk6S1H_w260dtfNpjVJpWQcbbESf3_um_pGAWG5kM0E1ZyUmrBMkamNVVfxIlW0oslA53f1RLQmK0LjcMCs5vSttq9ov1IjM0HCXrLOV37y/h120/twitter'.png') no-repeat transparent;
line-height: 1;
padding: 0px 3px 1px 20px;
width: 60px;
margin-bottom:0px;}
#other-social-bar .other-follow li.my-gplus {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggQe8AOZgENuRvPjA8DENqG9qYcgmOv3Anb-vqr63vp1dwURmrrYoEMtIXIAOA2BkPxrBRY6yAYmSkY8I13Oa2On9gc146mCpDMNXLvW0YOLj9VjsJroEuZjkL7FaigpZtaL5uIgj1yqLh/h120/gplus-16x16.png) no-repeat transparent;
line-height: 1;
width: 60px;
padding: 0px 3px 1px 20px;
margin-bottom:0px;}
.emailicon {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoSFfnpEkYjmDvEnfE9LOZAFcR67Lv4KWMXo3LpMXFBBgRiU9ABt7q8AmvseeDHbzilJMg55ACcpwg3cSZ392QN4msXBk-EoKkaho1qsw6UC3fWpErD7dOSHonHogdtPzmRJY-lZKvRLG2/h120/MBT-RSS-FEED.gif") no-repeat scroll 0px 2px transparent;
padding: 0px 20px 0px 95px;
min-height:100px;
margin: 0px;
width: 183px;
line-height: 20px;
vertical-align: middle;
font-size: 14px;
color: rgb(51, 51, 51);
}
.emailicon p {
color:#FF8604;
font-size: 20px;
font-weight: normal;
font-family: impact;
padding:40 0px 10px 0px;
margin:0;
padding-top: 20px;
line-height: 25px;
text-shadow: 0px 1px 0px #fff, 0px 2px 0px #C6C6C6;
}
</style>
<!--[if IE]>
<style>
#email-news-subscribe .email-box input.subscribe{
background: #333;
}
</style>
<![endif]-->
<div id="dgenera-blog" >
<div class="emailicon"><p>Berlangganan Artikel Gratis Melalui Email! </p></div>
<div id="email-news-subscribe">
<div class="email-box"> <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=KomporMeledak', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="10" class="email" type="text" style="width: 160px; font-size: 12px;" id="email" name="email"value="Enter your email here..." onblur="if (this.value == '') {this.value = 'Enter your email here...';}" onfocus="if (this.value == 'Enter your email here...') {this.value = '';}" type="text" />
<input type="hidden" value="KomporMeledak" name="uri" /> <input type="hidden" name="loc" value="en_US" /> <input class="subscribe" name="commit" type="submit" value="Subscribe" /> </form> </div> </div>
<div id="other-social-bar">
<ul class="other-follow">
<li class="my-rss"> <a rel="nofollow" title="RSS" href="http://feeds.feedburner.com/KomporMeledak" target="_blank">RSS Feed</a> </li>
<li class="my-twitter"> <a rel="nofollow" title="twitter" rel="author" href="https://twitter.com/KomporMeledak2" target="_blank">Twitter</a> </li>
<li class="my-gplus"> <a rel="nofollow" title="Google Plus" rel="author" href=https://plus.google.com/106385345022208134314 target="_blank">Google Plus</a> </li>
</ul>
</div>
</div>
Note →
Ganti 'KomporMeledak' dengan nama feedburner sobat.
Ganti 'KomporMeledak2' sesuai akun twitter sobat.
Ganti '106385345022208134314' sesuai akun google plus sobat.
Selamat mencoba dan semoga bermanfaat.
0 komentar:
Post a Comment