Sebelumnya saya bingung bagaiman bisa membuat sebuah widget get update via email yang bagus dan menarik. Karena widget bawaan dari Feedburner Google kurang menarik tampilannya.
Setelah beberapa menit berfikir, kenapa saya tidak melakukan editing saja pada widget feedburner Google? nah, mulai dari fikiran itu, saya coba-coba browsing di Google mencari tutorial cara membuat Widget get update via email. Dan ketemu di blognya Kang Rohman. Saya coba pelajari coding-coding yang Kang Rohman buat. Maaf kang, saya cuma ingin mempelajari dan mencoba membuat karya sendiri, bukan mau mencuri ilmu… hehhe.. maaf sebelumnya kalo tanpa konfirmasi.
baiklah langsung saja pada tahapannya :
Tampilan default Widget Get Update Via Email punya Feedburner Google :
Dan akan dirubah menjadi :
Cara merubahnya sebenarnya cukup gampang, kita tinggal menambahkan beberapa code hiasan saja. Disini saya mengambil code dari Widget yang dibuat oleh kang Rohman.
Script asli :
| <form action="http://feedburner.google.com/fb/a/mailverify" style="border:1px solid #ccc;padding:3px;text-align:center;" target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=otong', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Enter your email address:</p><p><input style="width:140px" name="email" type="text"/></p><input value="otong" name="uri" type="hidden"/><input value="en_US" name="loc" type="hidden"/><input value="Subscribe" type="submit"/><p>Delivered by <a href="http://feedburner.google.com" target="_blank">FeedBurner</a></p></form> |
Script setelah editing :
| <form action="http://feedburner.google.com/fb/a/mailverify" style="border:1px solid #ccc;padding:5px;text-align:left;background:#fff;color: #000000" target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=otong', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"> <div style="background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5gKbYor5E5cohL8ELyjoJ0tI7joo7Ci1Vwz_Jabp6JzqvfPHwIpu52V37DW5UwpWKv44XcPYwWzcp1wyYaF6Y47iP9DHwnqd7zCjxENFeoB5QJXcTUvMA8JBA83R6XOAA6itnI1Aw9QI/?imgmax=800)no-repeat top right;padding:10px 0px"> <p>Kirim update terbaru dari</p> </div></form> |
+++++-----+++++
Penjelasan Script setelah editing :
- Script baris pertama
padding:5px >> merupakan jarak tulisan dengan garis tepi widget
background:#fff >> Background dasar kotak widget
color: #000000" >> Warna Teks
text-align:left >> Rata tulisan (kiri)
http://feedburner.google.com/fb/a/mailverify?uri=otong >> Ganti dengan url feedburner sobat
- Script baris 2
Berisi url gambar background, bisa sobat ganti dengan gambar apapun, tapi ukuran gambar disesuaikan ya,,,
- Script baris 3
Kirim update terbaru dari >> Bisa diganti sesuai keinginan
Blog si Otong langsung ke Email sobat! >> Ganti saja sesuai keinginan
width:200px >> Panjang kotak teks email
value="Masukan alamat Email sobat... " >> Tulisan di kotak teks email
input value="Langganan" >> Tulisan pada tombol input
+++++-----+++++
Hanya itu yang saya lakukan untuk merubah tampilan Widgetnya, cukup sederhana, hehhe,.. maklum masin newbie.. baru bisa editing, gak bisa buat sendiri.. hehe..
Untuk mendapatkan script asli dari widget tersebut sobat langsung saja login di http://feedburner.google.com, Kemudian pilih feed blog sobat yang ingin sobat buat widgetnya, kemudian pilih TAB “Publicize”, setelah itu pilih yang “email subcriptions”, copy scriptnya, lalu lakukan editing seperti diatas. Tambahkan code-code yang belum tercantum.
Atau sobat tinggal copas saja script editing diatas, lalu ganti code-code pentingnya, seperti url feed, gambar dan beberapa tulisan keterangan.
Selamat mencoba, semoga sobat paham dan artikel ini berguna… thanks…
No comments:
Post a Comment