Cara Membuat Blockquote Keren Di Blog | Hai sob...... Pada kesempatan kali ini kita akan memahas tutorial kali ini berbeda pada sebelumnya. kita akan memasang Cara Membuat Blockquote Keren Di Blog. pastinya kalian tahukan blockquote itu apa ? blockquote atau quote berguna untuk memasukkan kode kode html, atau untuk kata kata kutipan dan masih banyak yg lain untuk kegunaan yg lain.
Biasanya kalau blockquote biasanyakan nggak ada istimewanya dan terlalu standar. untuk itu saya akan beberapa blockquote yang mantap ni hehehe.pastinya gampang untuk diterapin seperti di bawah ini :
Blockquote Dengan Border dan Gambar Burung Hantu
blockquote { margin : 0 20px;
padding: 60px 30px 40px 20px;
background : #F1F8FE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1cRj_GYm2K6vqActGhFD9neimMcbgD0Pvfz5-mv5xTH5GqFOM0qJghjUiVi4CsCkxE2-MpR9emzgMOcssw6MAAzv3a_IlHKcrRLby8usLMn9K0E-ZCe55mNqFwnJ4JueJJKhi7NA9RzE/s400/owl.png) no-repeat 350px 5px;
font: normal .9em "comic sans ms", Courier,"Times New Roman", Times, serif;
color : #000;
border-left: 8px dotted #DAB547;
}
blockquote p {
margin: 0;
padding-top:10px;
}
Blockquote dengan label di pojok kanan kiri atas dan border di bawah dengan warna ungu :
.post blockquote {
margin : 0 20px;
padding: 70px 20px 20px 40px;
background : #E4EAFE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1wz4KLrILWsaXQ08GRnbJLw7d9F1yBUxCbXLgI6-LHHyeoEqEo_3GLVGF0dY-qypY6jH_ZTT5glxCEULlohB3dHxdh8hxxGPYzj1KmJ7BxcIXTgNVJ8JCJSIiFTe8Q9fNtdYHSDhC2Ag/s400/angular-purple.gif) no-repeat top left;
font: bold 1em Helvetica, verdana, Georgia, "Times New Roman", Times, serif;
color : #000;
border-bottom : 5px solid #435388;
}
.post blockquote p {
margin: 0;
padding-top:10px;
}
.post blockquote {
margin : 0 20px;
padding: 10px 20px 25px 20px;
background : #9FCFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5hvPKWB9A5-qfwi7POGpG2MH-s-WGqHZw33wZbO2xu16arN9tKI_D6R0rZhRVowD9fKv1usxu6Kg9LLCRXHk0OnWKOOHMfDdwsC7ht5_yiklbbOESz5_0X0O40xtcmFB40jyeT2ys7rU/s400/block22.gif) no-repeat right bottom;
font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia;
color : #484848;
border: 5px dashed #fff;
}
.post blockquote p {
margin: 0;
padding-top:10px;
}
.post blockquote {
background: #F3F3F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzihrPTOHAw_h1kgjipoENx8uSit5cwtr1zJM0apMIw5VvF9WLJU86yTF83761Cpy5_Z566JfbEDae-TrTdLBZQ3FoDOBJ7K3FZqMYHfIwX3CZt0wdn44ck2TQo588Fbml7C9UaYrLU-Y/s1600/comma-side-orange1.gif) ;
background-position:;
background-repeat:repeat-y;
margin: 0 20px;
padding: 20px 20px 10px 45px;
font-size: 0.9em;
font: italic 1.2em Georgia, "Times New Roman", Times, serif;
}
.post blockquote p {
margin: 0;
padding-top: 10px;
}
Kode Blockquote adalah :
=========================================================
blockquote { background: #484B52 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVCCb7BH79PgtAE2bEqcU1p34tl_F27x_ChOY_h8A3-Zr9VqxBF62fJnjJNzAGAGNZUeDCxBf4XuprIk_MD7TMcJogyM_OeoylCINHB6nuHqN8qqnp7gXrHgD2XlERlq1hzIo3wMJJF7M/s1600/green-black-side.gif) ; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 20px 50px; color:#C7CACF; font: normal 0.9em Helvetica, verdana, serif, Georgia, "Times New Roman"; } .post blockquote p { margin: 0; padding-top: 10px; }
Cara Memasang kode blockquote di dalam blog :
Masuk ke blog kalian
Klik menu ''Template''
Pilih ''Edit HTML''
Cari kode ]]></bskin> , Gunakan tombol (CTRL+F ) untuk mempermudah pencarian
Setelah ketemu taruhlah salah kode di atas yg sudah di pilih dan taruhlah di atas kode ]]></bskin>
Simpan Template
==========================================================
Cara Menerapkan di dalam artikel :
Klik ''Entri Baru''
blok kode atau kutipan yang ingin di blockquote dan klik quote yang bergambar seperti kutip
Selengkapnya...
