Friday, April 24, 2015

Cara Memodifikasi Judul Widget Blog

Ketika Anda menggunakan template asli bawaan dari blogger, maka tampilan judul widget blog akan terlihat sangat tidak menarik. Jika tidak menarik, maka pengunjungpun akan merasa bahwa blog Anda tersebut masih dalam tahap pembenahan.

Sekarang Saya punya 2 desain yang berguna untuk merubah tampilan judul widget blog, tampilan dari 2 desain blog tersebut seperti di bawah ini:
Modify Widget 1
Desain Modifan Judul Widget 1
Modify Widget 2
Desain Modifan Judul Widget 2

Jika anda ingin menggunakna desain yang pertama, maka lakukan langkah-langkah berikut ini:

1. Masuklah ke menu Edit HTML.
2. Kemudian tempelkan kode CSS berikut ini tepat diatas kode ]]></b:skin>
.sidebar h2 {
font-size:110%;
font-weight:bold;
color:#ffffff;
text-transform:uppercase;
text-align:center;
background:#2281C4;
border-radius: 15px;
}

Tapi, jika anda ingin menggunakan desain yang kedua, maka lakukanlah langkah-langkah berikut ini:

1. Masuklah ke menu Edit HTML.
2. Kemudian tempelkan kode CSS berikut ini tepat diatas kode ]]></b:skin>
.sidebar h2 {
background:#009900;
color: #ffffff;
margin: 0px 0px 8px 0px;
box-shadow: 0 0 0 4px #009900, 2px 1px 6px 4px rgba(10, 10, 0, 0.5);
border-radius: 3px;
 -moz-border-radius: 1px;
 -webkit-border-radius: 1px;
text-align:center;

Note: Jika anda kesulitan mencari kode ]]></b:skin>, carilah dengan menggunakna CTRL+F kemudian pastekan kode ]]></b:skin> di dalam kolom pencarian, kemudian tekan enter.

Setelah Anda menempelkan salah satu kode yang Saya kasih di atas, sekarang pratinjau terlebih dahulu template Anda. Jika sudah cocok dengan desain tersebut, simpanlah templatenya.

Anda bisa mengganti kode CSS tersebut sesuai dengan keinginan anda. Contohnya, jika anda ingin merubah warna background/warna tulisan, maka rubahlah pada kode color. Untuk mengganti bayangan, rubahlah pada kode box-shadow.

No comments:

Post a Comment