CARA MEMASANG WIDGET SUBSCRIBE EMAIL WITH SOCIAL ICON FLAT

CARA MEMASANG WIDGET SUBSCRIBE EMAIL WITH SOCIAL ICON FLAT

CARA MEMASANG WIDGET SUBSCRIBE EMAIL WITH SOCIAL ICON FLAT

Assalamualaikum.wr.wb kali ini saya akan memberitahu anda tentang cara memasang widget subscribe email with social media icon flat. Widget subscribe email memang sangat digunakan untuk para  pengunjung dan sang pembuat blog untuk saling ber-interaksi. Sosial media yang terdapat di widget subscribe email biasanya banyak sekali banyak perhatian oleh para pengunjung. Oke langsung aja....
  • Login dulu di Blogger.com
  • Masuk di Tata Letak / Layout > Add Widget > Html / Javascript
  • Copy kode dibawah ini

<--------------Kode Start--------------->
<style>
#sidebar-subscribe-box{width:300px;border:1px solid #aaa;border-radius:3px;padding:3px 0}
 .sidebar-subscribe-box-wrapper{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgTpeHn6yBGgVc8SxSAs7zKTzxYhUnGYx6UwgRyjZZ2mTX0T3xbxujhEuzzdjQTDzLPXlQlKMpptgCu2xwkF_bGBVnvI60kiSRAsolsX2wot4FOnP4wSEV00w0fEKu56iMS9Azvjc0oZ4/s1600/background.png) repeat scroll 0 0 #f7f7f7;color:#111;font-size:14px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:uppercase}
 .sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0}form.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto}
 .sidebar-subscribe-box-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCgU8kZYUqeKCruDXtZcEO5r-3_rXfAC-SYWkFjbUlMh5vHwsS5AcT9gFzPfBobiai2QMESC4eVchnVyKkL3SFFeDKVELr0Pd4cCZS6zCzSxjOpxY340EeGegFm0E1QcVXwgy37tGQcYE/s1600/icons.png) no-repeat 0 -27px;border:1px solid #ccc;border-radius:4px;color:#444;margin:0 0 15px;padding:10px 40px;width:68%}
 .sidebar-subscribe-box-email-button{background:#09f;border:1px solid #007fff;box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0 transparent;color:#fff;cursor:pointer;font-family:verdana;font-weight:700;padding:10px;text-shadow:1px 1px 0 rgba(0,0,0,.4);text-transform:uppercase;width:100%}
 .sidebar-subscribe-box-email-button:hover,.sidebar-subscribe-box-email-button:focus{background:#1ca4ff}
 .sidebar-subscribe-box-email-button:active{-moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;outline:0}iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table{width:100%}embed{border-radius:3px;-moz-box-shadow:0 2px 4px rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2);background:#FFF;border:1px solid #ddd;box-shadow:0 2px 4px rgba(0,0,0,0.2);margin:0;padding:4px 4px 4px}
 #footer-section{border-top:1px solid #aaa;box-shadow:inset 0 4px 6px -3px #aaa;font-family:cambria;font-size:14px;height:90px;margin:10px -30px 5px;padding:0 30px;text-align:center;width:100%}
a.social-icons{margin-right: 5px;height:45px;width:45px;}
a.social-icons:hover { opacity: .7; filter:alpha(opacity=70);}
</style>

<div id="sidebar-subscribe-box">
<div class="sidebar-subscribe-box-wrapper">
    <br/>
<a class="social-icons" href="https://facebook.com/cataragames"><img src="http://icons.iconarchive.com/icons/designbolts/flat-social-media/48/Facebook-icon.png" alt="Facebook icon" title="Like Us On Facebook" /></a>
<a class="social-icons" href="https://twitter.com/ravi_tiamo"><img src="http://icons.iconarchive.com/icons/designbolts/flat-social-media/48/Twitter-icon.png" alt="Twitter" title="Follow Admin On Twitter"/></a>
<a class="social-icons" href="https://plus.google.com/116385200394124877040/"><img src="http://icons.iconarchive.com/icons/designbolts/flat-social-media/48/Google-plus-icon.png" alt="GooglePlus" title="Follow Admin On G+"/></a>
<a class="social-icons" href="http://feeds.feedburner.com/CataraGames"><img src="http://icons.iconarchive.com/icons/designbolts/flat-social-media/48/RSS-icon.png" alt="RSS" title="Langganan Games dan Aplikasi Via Email *FREE*"/></a>
<p>Selalu Dapatkan Pembaruan Games Dan Aplikasi Android Via Email</p>
<div class="sidebar-subscribe-box-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=CataraGames" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogspot/MPGFW', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="CataraGames" />
<input name="loc" type="hidden" value="en_US" /><input class="sidebar-subscribe-box-email-field" name="email" autocomplete="off" placeholder="Masukan Email Kamu Disini..."/>
<input class="sidebar-subscribe-box-email-button" title="Langganan Via Email" type="submit" value="Langganan" /></form><p><a href="http://feeds.feedburner.com/CataraGames"><img src="http://feeds.feedburner.com/~fc/CataraGames?bg=00FFFF&amp;fg=444444&amp;anim=1" height="26" width="88" style="border:0" alt="" /></a></p>
</div></div></div>
<---------------Kode Berakhir--------------->

  • Simpan
Keterangan :

  1. Ganti warna Silver dengan url background widget nya
  2. Ganti warna merah dengan url sosial media kalian masing2
  3. Ganti warna biru dengan url Rss FeedBurner kalian masing2
  4. Ganti warna ungu dengan url mailvery rss kalian
  5. Ganti warna hijau dengan nama blog anda 
  6. Ganti warna orange dengan kode feedcount Rss anda ( Bisa di dapatkan di FeedBurner )


Bagaimana ? mudah bukan... baca juga Cara memasang link bergoyang di blog.
Jangan lupa  untuk selalu berkomentar ... dan share artikel ini

0 Comment "CARA MEMASANG WIDGET SUBSCRIBE EMAIL WITH SOCIAL ICON FLAT"

Post a Comment

:) :)) ;(( :-) =)) ;( ;-( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ $-) (b) (f) x-) (k) (h) (c) cheer
Click to see the code!
To insert emoticon you must added at least one space before the code.

Subscribe to: Post Comments (Atom)
Loading...