Mempercantik Quote pada Posting Blog

by - Tuesday, December 29, 2015


template blog ini entah sudah keberapa kali yang saya coba. suka sih dengan modelnya yang putih bersih dan sederhana. tapi ada beberapa yang kurang dan bikin gatel-gatel rasanya kalau gak dibenahin. selain warna font-nya, yang cukup mengganggu adalah bagian "quote" -nya. jadi template ini gak cukup bagus menampilkan kutipan. biasanya kan kalau kutipan ditulis agak menjorok ke dalam, font agak besar dan warnanya lebih mencolok. nah template ini gak mengakomodasi itu, jadi ketika nulis kutipan ya seperti nulis paragraf biasa. makanya dengan kesungguhan hati *halah* dan mumpung gak ada kerjaan waktu cukup longgar saya otak-atik saja si quote ini. hasil googling sana sini ketemu sama blognya http://gias-alauddin.blogspot.com. dilanjut praktek cara mempercantik quote di blog saya ini deh. 

caranya dengan meng-copy-paste-kan kode dibawah ini pada CSS template blog. CSS template ada di menu pengaturan "Perancang Template Blogger >> tingkat lanjut (advance) >> tambahkan CSS >> copy paste koding >> save & lihat hasilnya. 
kode yang dicopy paste sbb:

.post blockquote {
font: 18px normal Tahoma, sans-serif;
padding-top: 10px;
margin: 5px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBdiMQfa9CikADMV8GcfAKOXuE2gB4NcShUDkI-19DFKu2Q01s9O3ZWF93PCasVpiwjjXf_yOJJm-afWfgjj1YJKSyyfjjKKQobXoYuzpgqGN3Bk3C3KHlXW61Kj_dDQtef613CxH8jCY/s400/comma-left.gif) no-repeat top left;
text-indent: 65px;
}
.post blockquote div {
display: block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh82QR7Qx2CuSgBb7n7Xuj0dKRZWULfxS23CnfyJ1EHdtATejNOQEG9zkeZAVJ4jSKG4btk4gitoJrhtpAILSJ2tNqVkjV16giqoIGgAMcPHcN6ziFvbu8bzHX2Sjq3Kfhzq5yC2Cwc8Ws/s400/comma-right.gif) no-repeat bottom right;
padding-bottom:10px;
}
.post blockquote p {
margin: 0;
padding-top:10px;
}

hasilnya seperti dibawah ini:
You've gotta dance like there's nobody watching,
Love like you'll never be hurt,
Sing like there's nobody listening,
And live like it's heaven on earth.
William W. Purkey

sebenernya ada cara lainnya dengan mengutak-atik kode html di pengaturan template blog. tapi saya gagal melulu. makanya saya coba dengan css saja dan ternyata berhasil. rasanya seneng banget. oiya jangan lupa setiap kali nyoba-nyoba siapin notepad kosong untuk backup kode yang diganti-ganti ya...

salam

\\

You May Also Like

0 Comments

Thankyou very much for dropping by. Tapi maaf saya moderasi ya, untuk menghindari spam dan komen dg link hidup. Bila waktunya luang pasti akan saya balas dan kunjungi balik blog kalian :)