Cara Membuat Blockquote (Kutipan) Berbeda Dalam Postingan Blog

Apa itu Blockquote dan apa fungsinya ?, Blockquote adalah penekanan pada kata atau kalimat tertentu dalam sebuah tulisan, yang ditampilkan secara mencolok dibanding keseluruhan tulisan agar kehadirannya menyita perhatian pembaca.

Fungsinya sendiri adalah untuk menginformasikan pada pembaca bahwa teks yang ditampilkan berbeda tersebut adalah sebuah pesan penting. Bentuknya sendiri bisa berupa sebuah paragraf singkat, penggalan kata/ kalimat. Intinya ada penekanan khusus dibanding tampilan batang tubuh tulisan secara keselurahan.

Blockquote sendiri sebenarnya dan biasanya sudah ada dalam berbagai jenis template blogger, namun tentu saja terkadang bentuk model, ukuran, tampilan dan penempatan terkadang tidak sesuai dengan keinginan.

Masih bingung dan belum terbayang ? 🤔. Baiklah, mungkin sahabat bisa lihat Demo biar lebih jelas.

Gimana sekarang sudah tahukan ?, terus gimana cara membuat dan memasangnya di blog?, berikut

Tutorial Cara Membuat Blockquote (Kutipan) Berbeda Dalam Postingan Blog.

1. Budayakan membaca dan mencoba sebelum sahabat berkomentar.
2. Tutorial yang saya bagikan sudah 100% berfungsi di template Blogger bawaan ataupun template modifikasi pada umumnya (tergantung pada template yang sahabat gunakan).
3. Selamat mencoba dan tetap semangat...

• Direkomendasikan ikuti langkah demi langkah terlebih dahulu tanpa harus merubah/ mengganti sebagian atau seluruh kode CSS, JS atau HTML. Modifikasi dilakukan setelah kode tersebut berhasil diterapkan pada template.

• Backup Template sebelum merubah sebagian atau seluruh dari isi template, guna menghindari terjadinya kesalahan / ketidak sesuaian/ erorr saat merubahnya nanti. Berikut dibawah ini cara backup template bagi yang belum mengetahuinya.

×

1 / 4

2 / 4

3 / 4

4 / 4

❮ ❯

• Pelajari dan pahami element HTML tag <blockquote> dan </blockquote>, sebagai referensi bisa lihat Disini. Kode tersebut diatas adalah kode dasar untuk memanggil/ menampilkan blockquote pada postingan blog.

• Login Blogger > Menu Theme > Edit HTML
• Cari kode </style> atau </body> pada template, untuk mempercepat dan mempermudah gunakan shortcut Ctrl + F
• Copy kode CSS dibawah ini kemudian
  
  
  
• Paste tepat diatas atau sebelum kode </style> atau </body> tersebut.


• Save Template


• Untuk modifikasi tampilan bisa dirubah pada CSS kode ini.

• Login Blogger > Posts > Pilih New Posts atau Edit Posts > terdapat menu Compose dan HTML mode Pilih HTML
• Tulis atau pasang kode blockquote ini <blockquote blockq1> dan dibawahnya tulis bebas apa saja kemudian tutup dengan kode ini</blockquote> atau Copy contoh penulisan dibawah.
• Lihat hasilnya sementara dahulu di Preview. Jika sudah merasa yakin semua berjalan dengan baik di template sahabat, silahkan Update untuk postingan edit atau Publish untuk postingan baru.

• Lakukan seleksi dari Versi 1 s/d 7 blockquote mana yang sesuai dengan gaya theme dan akan sahabat gunakan atau Bisa Saja sahabat ingin menggunakan semua versi blockquote tersebut bersamaan dalam satu postingan.
• Lakukan modifikasi untuk tampilan sesuai dengan selera sahabat pada CSS kode diatas.
• Versi blockquote 1 s/d 7 dibuat dengan properties CSS yang bisa sahabat kembangkan kembali menjadi model blockquote yang lebih menarik dan bagus tentunya.
• Besar kemungkinan jika sahabat mengikuti setiap langkah diatas akan berhasil, lihat hasilnya (Result).
• Download file lengkap .txt tutorial ini sebagai media pembelajaran.

Silahkan sahabat memodifikasi lanjut untuk penempatan, ukuran, warna, dan model gambar disesuaikan dengan gaya template sahabat. Hindari memodifikasi yang berlebihan terkadang malah jadi menggangu baik tampilan maupun fungsi.

Demikian semoga membantu...

Please Share

• style='margin-right: 30px' target='-blank'>

Artikel Lainnya Terkait Costumized