Cara Mengubah Code Blockquotes menjadi Keren Di Blog

No comments
Kali ini saya akan mengshare sebuah tutorial blogger. kali ini saya akan membahas tentang :
Cara membuat blockquote blog menjadi keren
Cara membuat blockquote blog menjadi keren dengan sentuhan css.
Tapi sebelum itu, kita harus mengetahui Terlebih dahulu apa fungsi dari blockquote itu..?
Blockquote atau quote berguna untuk memasukkan kode kode html atau untuk kata kata kutipan di postingan atau laman blog. Untuk lebih jelasnya, di bawah ini adalah contohnya :


Demo Blockquote

 yang diatas itu contoh Blockquote 



Pertama kita harus memodifikasinya terlebih dahulu cara-cara nya akan saya jelaskan di bawah ini :
1.  Pertama, masuk ke dasboard blog kalian
2.  Buka Template, dan pilih Edit HTML
3. cari kode ]]></b:skin> kalau sobat tidak mau pusing-pusing mencari kode tersebut sihlahkan sobat tekan Ctrl+F secara bersamaan atau tekan F3 pada keyboard sobat masing-masing .. nanti akan muncul sebuah kotak pencarian dan masukan kode ]]></b:skin> pada kotak teresebut
4. masukan kode di bawah ini tepat diatas kode ]]></b:skin>  tadi 

.post blockquote { margin : 0 20px; padding: 70px 20px 20px 20px; background : #E7E5DC url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEii0OYyA5QufrgANCxkrkaIISekYxkET8IJCTELK7oKdIYboplbRGOut2VIIyh4hR3X8niCe2FqPe1V3ONGQesl8FYUI72oLwx_62TXU89ySNGO12SynlLGLFM6NaUkneYd_r3gci4iI/s1600/block333.gif) no-repeat top; font: normal 1em "comic sans ms",Helvetica, Courier,"Times New Roman", Times, serif; color : #000000; border-bottom : 7px solid #FF0000; } .post blockquote p { margin: 0; padding-top:10px; }
 5. Terakhir tinggal sobat save / disimpan templatenya..

Keterangan :
1. Ganti link / url yang berwarna Biru dengan link / url blockquote yang sobat inginkan

jika soba bingun mencari nya silahkan sobat liat url di bawah ini
1. https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwMBN4MSL-76M7DWQF9I48BV7qBp-mKBLW6ox73PFytYGzTyJiQMLL7AMY8yEM_5BLzVvDr55lDXK5Beq4x-SOLH3LhCH5byq9rZmzcBwU439BCGIPz8K5n4jcXmkcWoQ01NkyFo5Lyd7p/s1600/quote.png
2. https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisf85fPYefiBWjbdFMk4jDZWBB1CDD0Rfqqnptl9j9OCqWUMgCCgCazHX90ebY56zbYQcEjdPzD1vu0u6HdOfEdI-TQQjENwf8OgTvnOGUMDopBQCcwjrHzlANJ1M8Q7jQXrLRQiZsoko/s400/head-bottom3.gif
3. https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMNjh-JXgDOXwRppnNSFENStocrMmjPAywlMJGoZ2A84vw5Wn9Cs4SWTvFv5ycl2Fdt_sO0QsD5umwlUrRg1ovmf2gZqPVdQbCMH0WIVb__V0HsSCEkelKc2pq-aftgkPmGcEXFTJjZPs/s400/block3331.gif
4. https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmTVqtmBKA2G0WanXnbg3oI1BVwRBzkfo9rXZYQoH9Rd6cGByAUwC9Xdi9FCWyz-wolPDOUKtcfhUsaYLP7a-FfV0dkYzCxCqLDdwRgjdWRRkzivNeb-mVpZeQI29iUusZ53VITZ2AHpY/s1600/BLOCK1-TOP.gif
5. https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwuD5Uv5IU0szXNlkf9vhE0wO6W-XGY_iKDjZd84jL0GCfcK6edcbPnHJKOKlVeukMLsK94TzQE9ss8wGHtcen73_B9fSvgSFCSVSMcaPv3Wrftg7E6vOlCK2c0rJetKV9yoCTlRISKiQ/s400/comma2-left.gif
6. https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhgNwM_jSURotGPtv897rSKMy0oiGoKOtVgLp0poYM0l95oulxa0Q40iK42Oxy7reS_Sfc11mg9cW-Tu4rcS3FcwJ6-XITb81nTIl_kebgEYwGpxQCKl0Y1sHYJ1wPw19k_St9c_jH3W0/s400/left.gif
7. https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8XjHV6p7eygP6FkMpEe-vm30tePbKhM75F2U7MSYfZdD834IyJwSw2UVHy7-UOatAPx5tc2pSxQ6Ph-9W1mscFex1ziuPSksTOTqJnjoXQHFyLQW4Pk4CWre2GcGYCmYvtOVvlK6nEtQ/s400/angular-right.gif

sekarang cara membuat blockquote nya cukup Mudah , saat sobat ingin membuat postingan atau laman yang ingin sobat masukan ke kotak blockquote tadi , 
sobat tingal blog text tersebut lalu sobat klik tanda kutip biru yang ada di bagian atas satu grup dengan "Link, Insert Image, Insert a Video, dan lainnya"

Semoga artikel Saya kali ini. bisa bermanfaat. untuk sobat yang ingin memperbagus blockquote nya
Jika ada yang kurang jelas silakan kalian tanyakan di komentar :)
saya siap melayani komentar atau pertanyaan sobat yang sesuai dengan postingan saya kali ini :)

No comments :