Cara Memodifikasi Widget Subscribe Feedburner

Salam Blogging. Kali ini Satores akan membagikan widget modifikasi SUBSCRIBE FEEDBURNER keren, disini ada 3 widget yang saya coba modifikasi , sahabat blogger tinggal pilih widget mana saja yang menurut sahabat blogger paling keren…

Berkikut ini adalah kode dari Widget hasil modifikasi SATORES.

1. Widget Feedburner modifikasi 1#

gambar di atas sudah saya rubah background-nya menjadi stone texture yang jauh lebih keren

<style>

.blogpasuruansubscribe {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOi-OLghBnN3H_UT5nxjxkGSmS9wim-vdA4r3PjKwvSGpGyoYqdeiHrTvCEQd8UaNJBLJ3wF6tGBOQ3TY5shv4P1A3FCitCT_98149vAqJRcLYwhZR82dhEvhKLDABqDjKNReLAMrqFlo/s1600/Copy+of+gb5.jpg)no-repeat -5px;

border: 1px solid #0ed9d9;border-radius:5px;

padding: 8px;

width: 297px;

-webkit-transition: all 0.5s ease-in-out;

-blogpasuruan-transition: all 0.5s ease-in-out;

-ms-transition: all 0.5s ease-in-out;

-o-transition: all 0.5s ease-in-out;

transition: all 0.5s ease-in-out;

}

.blogpasuruansubscribe:hover {

-blogpasuruan-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);

-webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);

box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);

}

.blogpasuruanmailbox {

background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgear30-R9lPX4X0l3WuXW5WC2pThNXv7MQmYFkWnRIS5uT2QRncDUGN5QpMGK2nV88U_Ff2mRrrOSDv8TQLeQ78KrGLIbmOo3tFaRwhvJOHMXUPKznvJEwD7-uOp31-z-w9nBPESEjPH7V/s1600/Pict1.jpg)no-repeat left 5px;

border: 1px solid #0ed9d9;

-webkit-border-radius: 4px;

border-radius: 4px;

-blogpasuruan-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;

-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;

box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;

color: #0ba9a9;

font: 16px "trebuchet ms", sans-serif;

padding: 10px 0px 9px 30px;

width: 160px;

-webkit-transition: all 0.5s ease-in-out;

-blogpasuruan-transition: all 0.5s ease-in-out;

-ms-transition: all 0.5s ease-in-out;

-o-transition: all 0.5s ease-in-out;

transition: all 0.5s ease-in-out;

}

.blogpasuruanmailbox:hover {

-webkit-box-shadow: none;

box-shadow: none;

-webkit-transition: all 0.5s ease-in-out;

-blogpasuruan-transition: all 0.5s ease-in-out;

-ms-transition: all 0.5s ease-in-out;

-o-transition: all 0.5s ease-in-out;

transition: all 0.5s ease-in-out;

}

.blogpasuruansubmit {

font: 16px Tahoma, Geneva, sans-serif;

font-style: normal;

color: #fff;

background: -webkit-gradient(linear,50% 0%,50% 100%,color-stop(0%,#0cc1c1),color-stop(100%,#0ba9a9));

background: -webkit-linear-gradient(top,#0cc1c1,#0ba9a9);

background: -moz-linear-gradient(top,#0cc1c1,#0ba9a9);

background: -o-linear-gradient(top,#0cc1c1,#0ba9a9);

background: -ms-linear-gradient(top,#0cc1c1,#0ba9a9);

background: linear-gradient(top,#0cc1c1,#0ba9a9);

border: 2px solid #0ba9a9;

text-shadow: 0;

border-radius: 5px;

padding: 10px 9px;

cursor: pointer;

margin: 0 auto;

}

.blogpasuruansubmit:active {

cursor: pointer;

position: relative;

top: 2px;

}

.blogpasuruansubmit::-blogpasuruan-focus-inner {

border: 0;

padding: 0;

margin: 0;

}

</style>

<div style='background: url(http://icons.iconarchive.com/icons/fasticon/comic-3/48/mail-icon.png)no-repeat -2px;padding:10px 0 10px 40px;color: #333; font-weight: bold; font: 23px Oswald, cursive; margin: 0px 0px 10px 0px;border-radius:5px;'>Get Free Updates by Email !</div>

<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform'

method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=namafeedburner-anda', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true'

style='margin: 0pt;' target='popupwindow'>

<input class='blogpasuruanmailbox' name='email' onblur='if (this.value == "") {this.value = "Enter your email...";}'

onfocus='if (this.value == "Enter your email...") {this.value = ""}'

type='text' value='Enter your email...' />

</form>

</div>

<div style='border: none; color: #333; font: 22px Oswald, cursive; margin: 25px 0 0 5px;text-align: left;'>Follow Us on:</div>

<a href='http://twitter.com/your-username' rel='nofollow' target='_blank'

title='Follow us on Twitter'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirgJAb2KQ7SyxkDzHcMK2yI7P9IwFQnGvdF5Q664LhljHCk_cT2Hs8WVXSjSifgiBeLh8V7uRLcgNWFRy8ki99XgQB4u9SPkgOxgFFGOF2jWPir6kODMKcrtQsPQXlkomgsrqZ3sDAkvY/s1600/twitter.png' alt='twitter'/></a>

<a href='https://plus.google.com/your id-username' rel='nofollow' target='_blank'

title='Follow us on Google+'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcYj1yQl_NbD6_20EbUSiQWxEv8FkFV7ZPNUJVNhASeTIRWYLYckPvQM6NFfSUyaBkXnYFjo7kQjvuoGhMhfRtQcm-TLMreHkkGcMd9zRkCimurFUeK-pOX4c-PleWmLxN0QqPnGhjlZM/s1600/googleplus-revised.png' alt='gplus'/></a>

<a href='http://pinterest.com/your-username' rel='nofollow' target='_blank'

title='Follow us on Pinterest'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRnhyphenhyphen2BfQHJg1Uzs6dGVzv48g7LUrpLQji0fKvWOSaQ_EdQBcNUHx9LEnwRhEDdoxTRwKVBaA9vACTeBDY9ZUoE7VSftqR-4aOWIRkteKeKFNmDUpSb9Pz6Yu84qegq9zQdsS0iefiNoc/s1600/pinterest.png' alt='pinterest'/></a>

<a href='http://www.youtube.com/user/your-username' rel='nofollow' target='_blank'

title='Subscribe us on Youtube RSS'><img src='http://icons.iconarchive.com/icons/martz90/circle/32/youtube-icon.png' alt='Youtube'/></a>

</div>

</div>

2. Widget Feedburner modifikasi 2#

3. Widget Feedburner modifikasi 3#

Cara Pemasangan :

1. cara pemasangannya simple saja , silahkan anda masuk ke menu Layout >> add Gadget >> plih Html/javascript >> masukan kodenya.

2. Sebelum anda simpan anda harus mengeditnya terlebih dahulu,sekarang perhatikan code yang dicetak tebal berwarna merah dan biru , untuk yang berwarna merah silahkan masukan masukan Id feedburner anda.sedangkan code yang berwarna biru silahkan anda masukan url halaman sosial media anda.

3. Setelah semua selesai langsung saja di simpan.

Kode ini sudah saya sesuaikan dengan sidebar widget yang memiliki lebar antara 300px. jadi saya sarankan widget ini anda masukan di sidebar widget yang berukuran lebar sekitar 300px agar widget ini terlihat lebih rapi. tapi jika anda ingin menyimpannya di sidebar yang ukuran kurang atau lebih dari 300px dan masih bingung cara mengeditnya.silahkan saja masukan pertanyaan anda di kotak komentar ,insyallah kalau saya sempet saya akan saya bantu.

Demikian widget hasil modifikasi SATORES semoga sobat bloger sekalian menyukainya, jika ada masalah dengan widget saya di atas mohon tinggalkan pesan insyaAllah jika ada waktu saya akan membantu permasalahan sobat Blogger… terima kasih.

Ditulis Oleh : Teguh ~ Satores

Sobat sedang membaca artikel tentang Cara Memodifikasi Widget Subscribe Feedburner . Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya. Terima Kasih...

<a href="http://satores.blogspot.com/2015/02/cara-memodifikasi-widget-subscribe.html" target="_blank">Cara Memodifikasi Widget Subscribe Feedburner</a>

:: Get this widget ! ::

Cara Memodifikasi Widget Subscribe Feedburner

Ditulis Oleh : Teguh ~ Satores

0 Response to "Cara Memodifikasi Widget Subscribe Feedburner"

Post a Comment