Setelah sebelumnya Kang AP memposting cara gampang menciptakan kolom langganan keren dibawah postingan, pada kesempatan ini Kang AP mau memperlihatkan trik bagaimana cara menciptakan kolom langganan sederhana elegan dibawah postingan. Kenapa selalu dibawah postingan? Ya, alasannya hal ini akan menciptakan tampilan blog terlihat lebih keren. Anda mau kan blognya terlihat keren!
Kolom langganan ini cocok sekali bagi anda yang menyukai kesederhanaan namun terlihat elegan. Jika anda tertarik untuk menerapkannya, simak langkah-langkah berikut ini !
1. Login ke Blogger
2. Pilih Template » Edit HTML
3. Sekarang anda cari aba-aba ]]></b:skin>
4. Letakkan aba-aba dibawah ini diatas aba-aba ]]></b:skin>
/* Kotak berlangganan Kang AP*/.berlangganan-box {border-top: 1px solid #E9E9E9;border-bottom: 1px solid #E9E9E9;padding: 15px;margin:0;text-align:center;}.berlangganan-box input.email-address[type="text"] {width:60%;padding:10px;border:1px solid #ddd;text-align:center;border-radius: 4px;outline:none;background: #fff;}.berlangganan-box input.submit-email[type="submit"] {transition:all 0.5s;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;padding:10px 15px;background:#07ACEC;border-radius: 4px;color:#fff;border:none;font-weight:bold;border-bottom: 3px solid #0D9AD0;outline:none;}.berlangganan-box input.submit-email[type="submit"]:hover {background:#0D9AD0;cursor:pointer;}.berlangganan-box input.email-address[type="text"]:focus {box-shadow:0 0 2px #106FE4;}
5. Berikutnya cari aba-aba <data:post.body/>
Baca juga :
» Cara Membuat Tombol Share Efek 3D
» Cara Memasang Profile Keren Pada Blog
» Cara Praktis Memasang Widget Ganti Background Pada Blog
6. Pasang aba-aba dibawah ini dibawah aba-aba <data:post.body/>
<div class='berlangganan-box'> <form action='https://feedburner.google.com/fb/a/mailverify?uri= TipsAndTrikKangAP ' method='post'onsubmit='window.open('https://feedburner.google.com/fb/a/mailverify?uri= TipsAndTrikKangAP ', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'><p><a href='https://goo.gl/qfVpU5' rel='nofollow' target='_blank'>Berlangganan via email (gratis) ▼</a><p><input class='email-address' name='email' placeholder='Masukan alamat email...' type='text'/></p><input name='uri' type='hidden' value='Tips And Trik Kang AP'/><input name='loc' type='hidden' value='en_US'/><p><input class='submit-email' type='submit' value='Berlangganan'/></p></p></form></div>
7. Simpan dan lihat hasilnya
Demikian cara menciptakan kolom langganan sederhana elegan dibawah postingan, agar sanggup membantu dan bermanfaat. Terima kasih atas kunjungannya and happy blogging...!!
Sumber http://ap-thea.blogspot.com
EmoticonEmoticon