Selamat datang agan
atau aganwati kali ini Saya akan berbagi tips dan trik blogging untuk Anda
yaitu cara membuat widget subscribe Flat UI responsive di blog, untuk
membuatnya silakan agan untuk mengikuti beberapa cara berikut ini;
Langkah
1. Login pada blog Anda
masing-masing,
2. Pada menu
dashboard pilih menu template, lalu pilih menu edit html,
3. Lalu cari
kode </b:skin> dengan cara
Ctrl
+F
,
4. Copy
script di bawah ini lalu paste tepat di atas kode </b:skin>,
#subscribe-css { padding : 5px; background : #16a085; }
.subscribe-wrapper { color : #fff; background : #807A7A; font : 13px; font-family : 'Oswald', Tahoma, Sans-serif; line-height : 20px; padding : 1px 20px 10px; text-align : center; border-radius : 3px; }
.subscribe-form { background : #807A7A; clear : both; display : block; margin : 10px 0; overflow : hidden; } form.subscribe-form { clear : both; display : block; margin : 10px 0 0; width : auto; overflow : hidden; }
.subscribe-css-email-field { background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ7FwUGfw5CIvPqR5Pd1vU9BeITy6QZbK3KSE7QYjNl3aJrqBspMcdEgaEuTCKUt4wBXDL-yaF4AK1E8Ru_O1zEH8aA0snmn-qehAvJTJO_pIwVxKHCTrZWgijXy0gmjHSSKB5nB1k6wwm/s1600/sprites.png) 1px -27px no-repeat #eee; color : #444; margin : 0 0 15px; padding : 12px 40px; width : 100%; border : none; }
.subscribe-css-button { background : #000000; color : #fff; cursor : pointer; font-weight : 700; padding : 10px; text-transform : none; width : 100%; border : none; font-size : 16px; transition : all 0.3s ease-in; }
.subscribe-css-button:hover { transition : all 0.3s ease-in; background : rgba(0, 0, 0,0.2); }
5. Lalu simpan,
6. Setelah
Anda simpan, pada menu dashboard pilih menu tata letak, lalu pilih tambahkan
gadget, setelah itu pilih menu html / javascript,
7. Copy
script di bawah ini lalu paste pada kolom html / javascript,
<div class="subscribe-wrapper">
<p>Ikuti blog ini dengan memasukan Email Anda dibawah ini lalu konfirmasi Email Anda! Terima kasih</p>
<div class="subscribe-form">
<form action="http://feedburner.google.com/fb/a/mailverify" class="subscribe-form" method="post" onsubmit="window.open
('http://feedburner.google.com/fb/a/mailverify?uri= RenaldyWays', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow" id="1359348936">
<input name="uri" type="hidden" value="RenaldyWays" />
<input name="loc" type="hidden" value="en_US" />
<input class="subscribe-css-email-field" name="email" autocomplete="off" placeholder="Enter your email address " />
<input class="subscribe-css-button" title="" type="submit" value="SUBSCRIBE NOW !" />
</form>
<p><a href="http://feeds.feedburner.com/RenaldyWays"><img src="http://feeds.feedburner.com/~fc/RenaldyWays?bg=000000&fg=FFFFFF&anim=1" height="26" width="88" style="border:0" alt="" /></a></p>
</div></div>
Jangan lupa untuk mengganti ID Feedburner Saya
dengan ID Feedburner Anda "RenaldyWays"!
8. Simpan dan lihat hasilnya.
Nah itu saja
dari Saya semoga bermanfaat, jangan lupa bagikan serta tinggalkan komentar
Anda, terima kasih.
