Cara Menciptakan Widget Berlangganan/Subscribe Seolah-Olah Jalan Tikus

Anda tentunya sudah tidak asing lagi bukan beserta situs website yang dengan nama jalantikus? Yap, situs website download ini merupakan salah satu situs paling populer dan melegenda.
Related
Widget subscribe atau yg biasa kita kenal beserta widget berlangganan merupakan sebuah widget yg dijalankan buat mempermudah para pengunjung pada mengikuti setiap update yang terdapat di jalantikus.
Dengan adanya widget ini, maka para pengunjung tidak akan ketinggalan buat melihat update terbaru di jalantikus.
Nah alasannya banyaknya minat para blogger yg ingin pula memakai widget ini didalam blognya, maka pada kesempatan ini aku akan mengatakan cara buat memasang widget berlangganan yang mirip seolah-olah dengan milik jalantikus.com.
Untuk cara memasang widget ini bekerjsama cukup mudah, anda hanya perlu menambahkan sedikit script isyarat serta pula sedikit meng-edit sesuai blog kamu.
Baiklah agar kau lebih memahami bagaimana cara pemasangan widget yg benar , silahkan ikuti caranya dibawah ini:
1. Pertama, login terlebih dahulu ke blogger
2. Kemudian masuk dalam Tema>Edit HTML
3. Lalu masukan isyarat berikut, di atas isyarat ]]></b:skin> atau </style>
.langganan.news-content min-width: 300px; width: 100%; padding: 20px; margin-top: 20px; margin-left: auto; margin-right: auto; background: #ce0a46; background: -webkit-linear-gradient(15deg,#ce0a46,#e98125); background: -o-linear-gradient(15deg,#ce0a46,#e98125); background: -webkit-linear-gradient(75deg,#ce0a46,#e98125); background: -o-linear-gradient(75deg,#ce0a46,#e98125); background: linear-gradient(15deg,#ce0a46,#e98125); border-radius: 5px; -webkit-box-sizing: border-box; box-sizing: border-box; .news-content position: relative; .sidebar-content .news-content .news-title position: relative; display: inline-block; font-family: Museo,sans-serif; font-size: 22px; line-height: 32px; .langganan .news-title font-family: Museo,sans-serif; font-size: 20px; margin-bottom: 15px!Important; line-height: 15px; font-weight: 700; padding-left: 0; background-color: hsla(0,0%,100%,0); .sidebar-content .news-title margin-bottom: 20px; .color.white color: #fff; .langganan .news-detail font-family: Open Sans; font-size: 14px; line-height: 20px; .color.white color: #fff; .news-detail white-space: normal; .langganan .email-langganan position: relative; .langganan .email-langganan:before position: absolute; height: 16px; width: 16px; bottom: 12px; left: 12px; color: #d62e3d; font-size: 16px; .icon-mail:before content: "E012"; [class*=" icon-"]:before, [class^=icon-]:before, [data-icon]:before font-family: untitled-font-2!Important; font-style: normal!Important; font-weight: 400!Important; font-variant: normal!Important; text-transform: none!Important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; .langganan .email-langganan input width: 100%; height: 40px; font-family: Open Sans; font-size: 14px; margin-top: 20px; border: 0; border-radius: 4px; padding-left: 40px; -webkit-box-sizing: border-box; box-sizing: border-box; a, button, input, label -webkit-tap-highlight-color: rgba(255,255,255,0); outline: 0; user agent stylesheet input:not([type]), input[type="email" i], input[type="number" i], input[type="password" i], input[type="tel" i], input[type="url" i], input[type="text" i] padding: 1px 0px; user agent stylesheet input -webkit-appearance: textfield; background-color: white; -webkit-rtl-ordering: logical; cursor: text; padding: 1px; border-width: 2px; border-style: inset; border-color: initial; border-image: initial; user agent stylesheet input, textarea, select, button text-rendering: auto; color: initial; letter-spacing: normal; word-spacing: normal; text-transform: none; text-indent: 0px; text-shadow: none; display: inline-block; text-align: start; margin: 0em; font: 400 13.3333px Arial; user agent stylesheet input, textarea, select, button, meter, progress -webkit-writing-mode: horizontal-tb !Important; .langganan .email-langganan position: relative; .langganan .submit height: 35px; width: 100%; margin-top: 20px; font-family: Museo,sans-serif; font-size: 14px; line-height: 35px; text-align: center; border: 0; border-radius: 4px; background-color: #3a2e28; outline: 0;.color.white color: #fff;.trs-2 -webkit-transition: .2s; -o-transition: .2s; transition: .2s;button, input[type=button], input[type=submit], label cursor: pointer; font-family: Open Sans;a, button, input, label -webkit-tap-highlight-color: rgba(255,255,255,0); outline: 0;; form display: block; margin-top: 0em; .langganan .email-langganan:before position: absolute; height: 16px; width: 16px; bottom: 12px; left: 12px; color: #d62e3d; font-size: 16px;.icon-mail:before content: "E012";[class*=" icon-"]:before, [class^=icon-]:before, [data-icon]:before font-family: untitled-font-2!Important; font-style: normal!Important; font-weight: 400!Important; font-variant: normal!Important; text-transform: none!Important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
4. Setelah selesai silahkan klik dalam "Simpan Tema"
5. Kemudian kita beralih ke Tata Letak>Tambahkan Gadget>HTML/Javascript
6. Dan masukan isyarat dibawah ini
<div id="" class="langganan news-content "><form action="https://feedburner.google.com/fb/a/mailverify/Palingtop21" method="post" sasaran="popup"><div class="news-title color white">Langganan Artikel</div><div class="news-detail color white">Temukan Tips serta Berita menarik setiap harinya. GRATIS!</div><div class="email-langganan icon-mail"><input type="email" placeholder="Alamat Email..." required="" data-role="none"><input type="hidden" value="jalantikus/feed" name="uri"><input type="hidden" name="loc" value="en_US"></div><button type="submit" value="LANGGANAN" class="submit color white trs-2" data-role="none">LANGGANAN</button></form></div>
Catatan:
Ubah isyarat yang sudah aku beri pertanda, bersama FeedBurner anda
7. Terakhir, klik "Simpan" kemudian cek blog kau buat melihat hasilnya
Bagaimana sobat-sobat, simpel bukan cara memasang widget subscribe mirip jalantikus ini? Sekarang para pengunjung anda mampu mengikuti update terbaru pula dari blog kamu.
Baca Juga
Baiklah aku rasa hanya itu yang mampu admin sampaikan, terimakasih dan hingga jumpa di postingan berikutnya.
0 Response to "Cara Menciptakan Widget Berlangganan/Subscribe Seolah-Olah Jalan Tikus"
Post a Comment