Cara Modifikasi Tampilan Widget Berlangganan Via Email di Blogger

SEO Blog ~ Jika bosan dengan tampilan default widget berlangganan via email di blogger, Anda dapat merubah tampilannya agar tampak lebih bagus dan profesional sesuai dengan tampilan tema blog Anda.

Widget berlangganan email di Blogger

Yang perlu dilakukan hanya menambah beberapa kode css ke dalam template untuk memodifikasi tampilan widget berlangganan untuk blogger agar sesuai dengan tema blog Anda. Caranya sangat sederhana, Anda hanya perlu memasukkan warna yang Anda inginkan. Berikut adalah contoh yang terlihat setelah dimodifikasi.

Modifikasi Tampilan Gadget Berlangganan Via Email di Blogger


Untuk pilihan warna dapat dimanfaatkan tool warna (color picker) pada situ http://www.huecode.com/

Cara memanfaatkan color picker tersebut tinggal mencopy kode warna yang diinginkan dan letakkan pada kode css widget email blogger Anda.

Langkah 1. Kemudian buka Blogger > Template > Edit HTML
Langkah 2. Cari kode </b:skin>
Langkah 3. Kemudian paste kode css berikut tepat di atas kode </b:skin>.

.FollowByEmail .follow-by-email-inner .follow-by-email-address{
color: rgb(47,46,78);
width: 100%;
height: 32px;
font-size: 13px;
border: none;
background: INPUT BACKGROUND COLOR;
padding: 0 0 0 4px;
}

.FollowByEmail .follow-by-email-inner .follow-by-email-submit{
width: 60px;
margin-left: 8px;
padding: 0;
border: 0;
color: white;
background: BUTTON BACKGROUND COLOR;
font-size: 13px;
height: 32px;
z-index: 0;
border-radius: 0px;
font-family: Arial, Tahoma, Century Gothic, sans-serif;
}

.follow-by-email-inner .follow-by-email-submit:hover{
background: BUTTON HOVER BACKGROUND COLOR;
}

Langkah 4. Sesuaikan warna widget sesuai dengan tema blog Anda.

Selesai. Dengan merubah tampilan widget berlangganan email blog Anda akan tampak lebih profesional, karena keserasian warna template dengan widget Anda. Demikian semoga bermanfaat,

Baca juga Cara Install Template Blogger

SHARE

Unknown

  • Image
  • Image
  • Image
  • Image
  • Image
    Blogger Comment

0 comments:

Post a Comment