Cara Buat Block Quote Dengan Efek Keren di Blogger

D-Copy Blog | Jika Anda sering mengunjungi blog terkenal yaitu My Blogger Tricks maka Anda akan melihat blogquote yang akan kita bahas ini. Pada postingan sebelumnya yaiut cara buat block quote Facebook di Blogger maka kali ini saya memposting tentang Blockquote dengan efek bergantian bila disorot mouse.

Ok langsung saja :

1. Buka akun Blogger Anda
2. Masuk ke Menu Edit HTML
3. Temukan blockquote Anda bila Anda telah menggunakan blockqute standard atau editan di blog Anda, kode nya akan mirip seperti ini :

.post blockquote {
background: -------------------
url(------------------------------;
margin:------------;
padding:---------------------;
border-top:---------------------------------;
border-right:-------------------------;
border-left: ------------------------;
border-bottom: ----------------------;
font-size:--------------------------;
}

    4.  Ganti kode diatas dengan kode dibawah ini :

.post blockquote {
background: #F2F1F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg28gTf6277fU9S8tZct3DMN_FokH8ZfwpcvNsH_6Hm2BPd66PmXdnAwM-h4gunIK0-I3eOAp3u2rB-aRW5cJuQTywu0b231Vi2R-Ij_N8YluxWud02bNHI0Zsfohq-aYC6KFSWQcxYTug/s400/quote1.gif)top left repeat-y;
margin: 0 20px;
padding: 10px 20px 10px 45px;
border-top: 1px solid #DDD;
border-right: 1px solid #666;
border-left: 1px solid #DDD;
border-bottom: 1px solid #666;
font-size: 0.9em;
}
.post blockquote p {
margin: 0;
padding: 0 0 15px;
}
.post blockquote:hover {
background: #F2F1F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXra3ItkUPMIMQqdlkCa3XWXtVMk8u9A8tEYT8SHHChxTWSVMhyendYWdBpReqMX-10MKOaWvFcYmkjUD5lQJlk-WNqM-Ff9hoPAw7wLWvjXm6KlWMiN22JRwFJdmD_ayE67YN-zHgnDs/s400/quote2.gif)top left repeat-y;
}

Keterangan :

• Ganti kode merah diatas dengan URL sesuai dengan gambar yang Anda inginkan.

     5.  Save Template Anda.