Cara Ubahsuai Featured Post Widget Pada Blog

Cara Ubahsuai Featured Post Widget Pada Blog - Google telah menambah satu lagi Widget khas untuk pengguna blogspot iaitu Featured Post Widget. Kegunaan Widget ini adalah sesuai untuk tujuan mempromosikan artikel yang dirasakan bermutu tetapi kurang pageview, jadi boleh buat sticky post di sini. Selain itu ia Widget yang automatik dan mudah dipasang dengan dua hingga 3 langkah sahaja.

Tetapi...

Ada masalahnya. Iaitu Featured Post Widget ini nampak kurang menarik kerana setting asasnya yang basic sahaja.

Jangan risau, saya boleh tolong buat Featured Post Widget anda nampak menarik, macam saya punya...

 

Cara Ubahsuai Featured Post Widget Pada Blog

1. Masuk ke Dashboard > Template > EDIT HTML

2. Cari kod ]]></b:skin> dan masukkan kod berikut ini di atasnya.

#FeaturedPost1 {
background:#5fb404;height:auto;
padding-left:15px;padding-bottom:15px;
font:16px Lora;
border-bottom:2px solid #FFE25F;margin-bottom:15px;
}
#FeaturedPost1 h2 {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQKwPPrS65nCQ3dlaW20prV4vQn_iGN8viVC8FOM3YylqT2EPj1PoBaA52WU-EQekJzBNJw_xT5l5jfYl0zb6klzKem8UccJ6lZLurqahRXZoYlm-hOmO3gWH-hdrfy5vDnKxgPdFcJQ4/s320/Featured.png) no-repeat bottom left;
height:5px;
padding-top:55px;
font-size:0px;
}
#FeaturedPost1 a:link {
color:#fff;
text-decoration:none;
}
#FeaturedPost1 a:visited {
color:#fff;
text-decoration:none;
}
#FeaturedPost1 a:hover {
color:#000;
text-decoration:underline;
}
#FeaturedPost1 img {
max-width:98%;
max-height: 300px;float:left;text-align:center;}

Selepas ditambah di atas kod ]]></b:skin> anda, template anda akan kelihatan seperti di bawah:-

3. Sila tekan SAVE jika anda telah berpuas hati dengan template tersebut.

Nota:
- Untuk tukar background (tajuk featurd post widget) tukar pada : warna kuning
- Untuk tukar background widget, tukar pada : warna hijau
- Untuk tukar warna link tulisan, tukar pada: warna merah

Ok.

Selamat mencuba.

Jika ada sebarang pertanyaan, sila tinggalkan di kotak komen di bawah. Saya akan cuba membantu sedaya upaya. 

Read More ....