--!>
Home » Widget » Cara Mudah Memasang Box Catatan/Blockquote di Post Blogger

Monday, July 03, 2017

Cara Mudah Memasang Box Catatan/Blockquote di Post Blogger

         Disqus  
Cara Mudah Memasang Box Catatan atau Blockquote di Post Blogger

Cara Mudah Memasang  Box Catatan atau Blockquote di Post Blogger | Halo Aibou (あいぼう). Hari ini saya akan memberikan tutorial cara memasang box catatan di post blogger.

Mungkin Anda telah sering melihat box catatan diatas yang sering dipake untuk menghiasi tampilan post blog agar keliatan lebih menarik.

Nah untuk pemasangannya sangatlah mudah cukup mengganti/menghapus kode CSS Blockquote default yang ada pada template Anda. Untuk menggantikan/menghapus silahkan ikuti cara berikut ini.

1.0 Memasang Box Catatan


  1. Seperti biasa,Anda harus masuk ke Dasbor Template/Tema ,lalu klik Edit Html
  2. Lalu selajutnya tambakan kode dibawah ini sebelum kode </Style>

/*Blockquote Catatan*/
.post blockquote {
   text-align: left;
   background: #6591c2;
   position: relative;
   display: block;
   padding: 55px 20px 20px;
   color: #fff;
   margin: 10px 0;
   border-radius: 3px;
}
.post blockquote:before {
   position: absolute;
   content: &amp;amp;#039;Catatan&amp;amp;#039;;
   background: rgba(255,255,255,1);
   right: 3px;
   left: 3px;
   top: 3px;
   padding: 5px 20px;
   display: block;
   font-weight: 700;
   border-radius: 3px 3px 0 0;
   color: #6591c2;

}
.post blockquote:after {
   position: absolute;
   content: &amp;amp;#039;f027&amp;amp;#039;;
   right: 10px;
   bottom: 5px;
   font-family: FontAwesome;
   font-style: normal;
   font-weight: normal;
   font-size: 160%;
   color: rgba(255,255,255,.6);
}
Jika Box Catatan Anda tidak muncul pada post, silahkan perhatikan Css Blockquote Default di Dasbor Template/Tema Anda. Contoh: .post blockquote menjadi .post-body blockquote (Default)
 Selanjutnya tinggal Save, Lalu masuk  ke Dasbor Pos untuk menampilkan Box Catatan.

2.0 Menampilkan Box Catatan


  1. Pertama Block Text terlebih dahulu.
  2. Kedua pilih Blockquote pada menu bar diatas disebelah kanan Anda.
Menampilkan Box Catatan

Nah, mungkin itu saja tutorial memasang Box Catatan. Sekian dari artikel ini, semoga bermanfaat dan sukses selalu buat kalian semua.lu buat kalian semua.


EmoticonEmoticon