Ok tanpa panjang lebar lagi berkut adalah cara mengganti block quote blogspot.
Pertama sobat masuk ke Dasbor >> Template >> Edit hatml jangan lupa centang Expand Template Widget
Setelah itu sobat cari kode berikut .post blockquote Kemudian sobat hapus kode tersebut biasanya bentuk kode dalam blog sobat bentuknya seperti berikut
.post-body blockquote { line-height:1.3em; }Bagai mana pun bentuknya didalam template sobat hapus dari .post-body blockquote { samapi akhir tanda }
atau
.post blockquote{ lainya }
Seteah sobat hapus kode diatas kemudian sobat cari kode ]]></b:skin> kemudian taruh kode dibawah ini tepat diatas kode ]]></b:skin>
blockquote {Sobat bisa mengganti kode yang berwarna diatas, untuk yang berwarna merah sobat bisa ganti dengan pilhan gambar yang telah saya sediakan di blog demo, nanti sobat bisa memilihnya, yang berwarna biru sobat bisa ganti dengan "normal,italic atau bold italic" , untuk yang berwarna hijau sobat bisa ganti ukuran font dengan yang sobat inginkan, yang terakhir sobat bisan ganti jenis font dengan jenis font yang sobat suka.
background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIIu77WaSavO-Sek2am1r_8aITjc8lEnFqdEaPBfwXqH44Xxs2k3utZ960fDZGiXijcghJq1hc0cQBtv2byq7S6_q6jv1ng1aw7L82806HwmNCyTpHf9agcdq4EyPt8SLnlJAnm0oIG6Y/s1600/notebook-with-numbers.gif) repeat-y;
margin: 0 20px;
padding: 0px 20px 5px 55px;
color:#7a7a7a;
font: bold 0.7em "Comic Sans MS", verdana;
line-height: 153%;
}
blockquote p {
margin: 0;
}
Untuk kode block quote diatas dengan menggunakan nomor dari 1 sampai 112 berikut adalah screen shootnya
Jika sobat tidak ingin menggunakan no dalam block quote blog sobat, sobat bisa ganti kode yang tadi disimpan di atas ]]></b:skin> dengan kode berkut.
blockquote {Untuk cara menyesuaikan bacground, font dan lain-lain caranya masih sama dengan cara yang diatas.
background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIIu77WaSavO-Sek2am1r_8aITjc8lEnFqdEaPBfwXqH44Xxs2k3utZ960fDZGiXijcghJq1hc0cQBtv2byq7S6_q6jv1ng1aw7L82806HwmNCyTpHf9agcdq4EyPt8SLnlJAnm0oIG6Y/s1600/notebook-with-numbers.gif) repeat-y;
margin: 0 20px;
padding: 0px 20px 5px 55px;
color:#7a7a7a;
font: bold 0.9em "Comic Sans MS", verdana;
line-height: 153%;
}
blockquote p {
margin: 0;
}
Dan berkut adalah demo dari kode diatas. di blog demo juga disedian preview background block quote dan urlnya agar sobat bisa menyesuaikan background block quote dengan background blog sobat.
Sumber kode : MyBloggerTrick
Jadi tampilan blokquote bisa lebih cantik lagi pakai seperti ginian yah...
BalasHapusThanks sharingnya
Iya sob, tampilan block quote jadi lebih menraik klw pakai yang seperti ini..
HapusSama-sama sob :)
Boleh tukar link/banner sob?Kunjungi di blog aku yach http://reformasibaru.blogspot.com
BalasHapusWah maaf sob, menu tukeran link udah lama saya tutup maaf ya sob :)
Hapusane mau nanya gan gmna klo barisnya lebih dari pada gambar gan?
BalasHapusKalaupun lebih akan gambar akan ngikutin tulisan, gitu juga kalau tulisan dikit gambar juga akan dikit
Hapus