Cara memasang follow by email dibawah postingan blog

 Selamat datang sobat kali ini membahas cara memasang follow by email dibawah postingan, Selain Email Subscription, widget ini juga dilengkapi dengan tombol follow, sharing dan like social bookmark yang mungkin berguna untuk anda pasang. Penempatan widget ini adalah dibawah postingan blog. Untuk contohnya sobat lihat sendiri gambar di bawah



Oke langsung saja cara memasangnya :
  • Login ke Blogger
  • Template » Edit HTML » Expand Template Widget
  • Copy kode di bawah ini dan pastekan tepat di bawah tag <data:post.body/>

<!--Subscribe widget start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
.lostsector-box {
background: #fff;
border: 1px solid #ddd;
height: 360px;
margin: 10px auto;
padding: 10px;
width: 572px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
.lostsector-subscribe {
border: 1px solid #D3D3D3;
padding: 8px;
width: 300px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.lostsector-subscribe:hover {
-moz-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
-webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
}
.lostsector-mailbox {
border: 1px solid #D3D3D3;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
color: #666;
font: 14px "trebuchet ms", sans-serif;
padding: 7px 15px;
width: 160px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.lostsector-mailbox:hover {
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.lostsector-submit {
font: bold 12px Tahoma, Geneva, sans-serif;
font-style: normal;
color: #ffffff;
background: #ff5714;
border: 0px solid #ffffff;
text-shadow: 0px -1px 1px #222222;
box-shadow: 2px 2px 5px #000000;
-moz-box-shadow: 2px 2px 5px #000000;
-webkit-box-shadow: 2px 2px 5px #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
padding: 8px 15px;
cursor: pointer;
margin: 0 auto;
}
.lostsector-submit:active {
cursor: pointer;
position: relative;
top: 2px;
}
.lostsector-submit::-moz-focus-inner {
border: 0;
padding: 0;
margin: 0;
}
.lostsector-sharebox {
border: 1px solid #D3D3D3;
margin: -157px 0 0 330px;
padding: 8px;
width: 225px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.lostsector-sharebox:hover {
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: inset 1px 1px 55px 1px rgba(249, 215, 126, 1);
box-shadow: inset 1px 1px 55px 1px rgba(249, 215, 126, 1);
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
</style>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css' />
<div class='lostsector-box'>
<div class='lostsector-subscribe'>
<div style='color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;'>Get Free Updates</div>
<div style='margin: 10px 0 0 6px;'>
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform'
method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=anytingblog&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true'
style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='anytingblog' />
<input name='loc' type='hidden' value='en_US' />
<input class='lostsector-mailbox' name='email' 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;}'
type='text' value='Enter your email...' />
<input alt='' class='lostsector-submit' title='' type='submit' value='Subscribe'/>
</form>
</div>
<div style='border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;'>Follow us on:</div>
<div style='margin: -32px 0 0 120px;'>
<a href='http://www.facebook.com/anythingblog' target='_blank' title='Join us on Facebook'><img src='http://1.bp.blogspot.com/-VQPvLh7iNrQ/UNKkgsazz1I/AAAAAAAAB-M/lfOT0jvX4WU/s1600/lostsector.blogspot.com-facebook-icon.png' alt='facebook'/></a>
<a href='http://twitter.com/anything' rel='nofollow' target='_blank'
title='Follow us on Twitter'><img src='http://2.bp.blogspot.com/-ywduw262Qjg/UNKkjygn-gI/AAAAAAAAB-o/rz3Vr7au1BU/s1600/lostsector.blogspot.com-twitter-icon.png' alt='twitter'/></a>
<a href='https://plus.google.com/108801075003252823592/' rel='nofollow' target='_blank'
title='Follow us on Google+'><img src='http://3.bp.blogspot.com/-mu0wNBiFlHw/UNKkhzAcBxI/AAAAAAAAB-Q/KahKAFN0B2c/s1600/lostsector.blogspot.com-google-icon.png' alt='gplus'/></a>
<a href='http://pinterest.com/anything' rel='nofollow' target='_blank'
title='Follow us on Pinterest'><img src='http://4.bp.blogspot.com/-gZirxISlTfI/UNKkit3U51I/AAAAAAAAB-Y/vKkruHIU1Y8/s1600/lostsector.blogspot.com-pinterset-icon.PNG' alt='pinterest'/></a>
<a href='http://feeds.feedburner.com/anythingblog' rel='nofollow' target='_blank'
title='Subscribe to RSS'><img src='http://4.bp.blogspot.com/-uGdILJ7N7FU/UNKkjfxrYGI/AAAAAAAAB-c/6ruWLo4l_HU/s1600/lostsector.blogspot.com-rss-icon.png' alt='rss'/></a>
</div>
</div>
<div class='lostsector-sharebox'>
<script type='text/javascript'>
var switchTo5x = true;
</script>
<script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/>
<script type='text/javascript'>
stLight.options({
onhover: false
});
</script>
<div style='margin: 5px 5px;'>
<span class='st_fblike_hcount' displaytext=''></span>
</div>
<div style='margin: -30px -20px 0 0; float: right;'>
<a href='http://twitter.com/share' rel='nofollow' class='twitter-share-button'
expr:data-url='data:post.canonicalUrl' expr:data-text='data:post.title'
data-count='horizontal'  data-lang='en'></a>
<b:if cond='data:post.isFirstPost'>
<script type='text/javascript' src='http://platform.twitter.com/widgets.js'></script>
</b:if>
</div>
<div class='addthis_toolbox addthis_default_style' style='margin: 10px 0 12px 85px;'>
<a class='addthis_counter'></a>
<script type='text/javascript' src='http://s7.addthis.com/js/250/addthis_widget.js'></script>
</div>
<div style='margin: 5px 5px;'>
<su:badge layout='1'></su:badge>
<script type='text/javascript'>
(function () {
var li = document.createElement('script');
li.type = 'text/javascript';
li.async = true;
li.src = ('https:' == document.location.protocol ? 'https:' : 'http:') + '//platform.stumbleupon.com/1/widgets.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(li, s);
})();
</script>
</div>
</div>
<div style='float: right; margin: -40px -5px 0 0;'>
<div class='g-plusone' data-size='medium' expr:data-href='data:post.url'></div>
<script type='text/javascript'>
(function () {
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>
</div>
<div style='margin-top: 20px;'>
<iframe allowTransparency='true' frameborder='0' scrolling='no' src='http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fanyhingblog&amp;width=570&amp;colorscheme=light&amp; show_faces=true&amp;stream=false&amp;header=false&amp;height=180'
style='border:none; overflow:hidden; width:570px; height:180px;' />
</div>
</div>
</b:if>
<!--Subscribe widget end-->


Keterangan

  1. Ganti anytingblog dengan username feedburner anda
  2. Ganti http://www.facebook.com/anythingblog dengan url facebook fans page anda
  3. Ganti http://twitter.com/anything dengan url twitter yang anda miliki
  4. Ganti https://plus.google.com/108801075003252823592/ dengan url profil google plus anda
  5. Ganti http://pinterest.com/anything dengan url pinterest anda
  6. Ganti http://feeds.feedburner.com/anythingblog dengan url google feedburner
  7. Ganti anythingblog dengan username facebook fans page anda
  • Terakhir, klik simpan dan lihat hasilnya.
Sekian tentang  Cara memasang follow by email dibawah postingan blog semoga bermanfaat

Postingan terkait:

Belum ada tanggapan untuk "Cara memasang follow by email dibawah postingan blog"

Post a Comment