Contohnya blog saya ini, ada sekitar 251 Subscriber, tetapi kebanyakan yang tidak active, alias belum mengkonfirmasi email yang dimasukkan untuk menjadi Subscriber. kalo untuk Subscriber yang statusnya aktif ada 37 orang.. hehe.. payah kan.. maklumlah.. artikel diblog saya ini kurang bagus..
Udah cukup sekian basa-basinya.. takut yang baca pada kabur,, kita kembali lagi ke tujuan utama saya membuat tulisan ini, yaitu Cara Membuat Email Subscriber yang lumayan bagus lah.. ngga terlalu keren. Kira-kira tampilannya seperti yang ada di samping kanan artikel ini lah..
Nah, seperti itu tongkronganya... gimana keren ga ? karena kalian sudah
menilainya keren... hehe. maka saya akan lanjutkan bagaimana cara
membuatnya...
Cara Membuat Email Subscriber
- Masuk ke feedburner.google.com
- Login ke blog dulu.
- Masuk ke dashboard >> Tata Letak
- Tambahkan Gadget..
- Pilih HTML / Javascript
- Selanjutnya masukkan kode ini
<style>
#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/AVvXsEi-EBJx50ynenL4LmX7ijfc1sLdcAuOiKBUfWobcpQTmedit6ReH_SI7GeXsk7XYrWhX0MTjt-XJCemLo4E4DQB8WPskxbWY0MoLxAAmVnHkGXgTnVO_KPnwwY9m8bVgDtTG4-uNT2Xj5gs/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/AVvXsEgjRwJT9df3LvLjlCcMeFX2SebLj9r8tY3EW7JRSD_j64p4MbfBbImDT034CRdGfTu1wg-LKb0NPyB7zY6V5cjPOF4O1nf0z_cEUg_IN6BYVbfTn31N-MBchOON_M7IZS8At9lOma-YlzLI/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/AVvXsEj6QGmXpxIFERSOznaKPTEe0gdRSedS5eDzSpSQvLrEfoholuriuTtziYNkLLCfMIUVvcLEFvLDkPzFcbdr3BHJNE9RVafZ4waJ1qTwOBDUo1WmRRUrmmHhs9-gD3sUpveJg90SCdp55kyE/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/AVvXsEiJL13sR5Cwdtc_6iT8OQ3p7GBfvBu87msg4EbJunefy1a4ZU1Npy-zb7TcdLuTqTpgNGSxWCyUerbCwRPMQwuAgw6HsN7ITWbUaPtxOSLRQnYVb2fF4JvR8aXP916ex6N5qTJtqG12Dq9t/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=blogcapoenk', '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="blogcapoenk" 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/blogcapoenk" target="_blank">RSS Feed</a> </li>
<li class="my-twitter"> <a rel="nofollow" title="twitter" rel="author" href="https://twitter.com/lindamarlina40" target="_blank">Twitter</a> </li>
<li class="my-gplus"> <a rel="nofollow" title="Google Plus" rel="author" href=https://plus.google.com/113842248795304704318 target="_blank">Google Plus</a> </li>
</ul>
</div>
</div>
Ganti " blogcapoenk " dengan nama feedburner anda.
Ganti " lindamarlina40 " sesuai akun twitter anda.
Ganti " 113842248795304704318 " sesuai akun google plus anda.
Terakhir,, Simpan hasil perubahannya..
Sudah,, hanya itu saja langkah-langkahnya.. anda sudah bisa membuat email subscriber seperti diblog ini. ^_^..
semoga bermanfaat.
0 komentar:
Post a Comment