Cara Ganti Blockquote Modifikasi Di Blogger

 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger
Di dalam posting blogger pada hidangan ada tombol ibarat di atas. Tombol tersebut ialah hidangan untuk menciptakan blockquote. Apasih blockquote itu? Menurut sejuta trik blogger blockquote berarti petikan posting. Blockquote memperjelas apa yang kita posting di blogspot. Misalnya kita memposting beberapa sub judul. Dalam sub judul itu kita sanggup memperjelas dengan petikan posting yang kita sebut sebagai blockquote. Mari kita bahas cara ganti blockquote modifikasi di blogger
Secara default atau bawaan, blockquote di tunjukkan kurang lebih ibarat ini

 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger

Dari gambar di atas, instruksi dalam menciptakan blockquote bawaan kurang lebih ialah di bawah ini

.blockquote {
margin: 10px 10px 10px 20px;
padding: 10px 15px 10px 15px;
line-height: 1.6em;
color: #000000;
background: #e0ffff;
border: 2px solid #4aa02c;
border-left: 20px solid #4aa02c
}

…….

Dan pada dikala posting (Posisi Edit HTML) ialah

<blockquote style=”overflow:auto;height:200px;padding:10px;background:black;color:lime;”>
Disini Text Anda
</blockquote>

Jika sobat tidak suka dengan blockquote bawaan blogger dan ingin merubah blockquote bawaan blogspot dengan style modifikasi berikut ini caranya

1. Login di blogspot

 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger

2. Sahabat akan di bawa ke dashboard.

 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger

3. Klik Menu Design ibarat gambar di bawah ini :

 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger

4. Klik Template

 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger

5. Backup dulu template sobat dengan klik tombol ibarat di bawah ini

 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger

6. Klik edit HTML

 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger

7. Klik Proceed

8. Centang  Expand Widget Template

9. Cari instruksi blockquote ibarat ini  (Biasanya 2 baris) :

.blockquote {
margin: 10px 10px 10px 20px;
padding: 10px 15px 10px 15px;
line-height: 1.6em;
color: #000000;
background: #e0ffff;
border: 2px solid #4aa02c;
border-left: 20px solid #4aa02c
}

…….

10. Hapus semua instruksi tersebut dan ganti dengan pilihan instruksi berikut :

a. Blockquote dengan background kertas bergaris

.post blockquote {
background: #fff url(http://3.bp.blogspot.com/_7wsQzULWIwo/Swb5kiMw3zI/AAAAAAAACQM/amZu50-o8aE/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%;
}
.post blockquote p {
margin: 0;
}

Ket : ubah instruksi yang ditandai dengan warna-warni di atas sesuai selera sobat.  Untuk ganti background gambar, Tinggal klik kanan dan klik simpan lokasi gambar. Dan berikut pilihan backgroundnya  :
 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger
 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger
 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger
 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger
 Di dalam posting blogger pada hidangan ada tombol ibarat di atas Cara Ganti Blockquote Modifikasi di Blogger
b. Blockquote pengaruh timbul dan shadow

.post blockquote {
    border:5px #dcdcdc solid;
    background:#f6f6f6 url(http://www.opendrive.com/files/7045660_cNVdE/quote.png) 0px 0px no-repeat;
    padding:7px;
    padding-left:65px;
    margin:20px 0;
    }

    blockquote:hover {
    border:5px #f2f2f2 outset;
    color:#000
    background:#f2f2f2 url(http://www.opendrive.com/files/7045660_cNVdE/quote.png) 10px 15px no-repeat;
    -moz-box-shadow: 0 0 40px #B0C4DE;-webkit-box-shadow: 0 0 40px #B0C4DE;box-shadow: 0 0 40px #B0C4DE;
    color:#000;
    }

    .post blockquote p {
    margin: 0;
    padding-top:10px;
    }

c. Blockquote dengan scrool

Untuk blogquote dengan scrool, cara pembuatannya ialah manual ibarat menciptakan text area. Yaitu dengan instruksi berikut ini pada posisi Edit HTML dikala posting.

<blockquote style=”overflow:auto;height:200px;padding:10px;background:black;color:lime;”>
Disini Text Anda
</blockquote>

Keterangan :
Image by : Drupal.org
Trick by  : My Blogger Trick

Saya lebih suka Cara Ganti Blockquote Modifikasi di Blogger untuk menampilkan instruksi html dengan blockquote dari pada dengan text area. Mohon maaf tidak disertai dengan demo nyata. So, silakan tentukan pilihan sobat.

Happy Blogging!
by. Sejuta Trik Blogger
Thanks for reading ! 

Close Menu