Tutorial : Cara Membuat Scroll Quote di Blog
Hai, ingatkah Anda dengan tool disamping? Kemarin kita membahasnya sedikit di dalam menu bar. Ya, itu namanya Quote. Biasanya digunakan untuk menuliskan kata-kata penting untuk diperhatikan. Quote di blog berfungsi untuk menempatkan teks/gambar yang ingin ditonjolkan selain itu juga bisa membuat blog jadi lebih indah dipandang. Tapi karena Quote/ tanda kutip yang disediakan blogger nampaknya kurang menarik, maka kali ini saya akan berbagi tentang cara membuat quote yang ada scrollnya. Simak caranya yuk:
- Masuk ke www.blogger.com
- Masukkan email dan kata sandi Anda → MASUK
- Klik POS
- Klik gambar pensil (BUAT ENTRI BARU)
- Tulis Judul Pos dan Klik Edit HTML
- Copy + Paste kode script berikut ini : tekan (Ctrl+C) → (Ctrl + V) : <div style="border: 5px solid rgb(238, 238, 238); height: 150px; overflow: auto; padding: 10px; text-align: left; width: 500px;">
<blockquote class="tr_bq">Taruh disini teks, gambar atau media lain yang akan diquote</div>
- Ganti tulisan “Taruh disini teks, gambar atau media lain yang akan diquote”dengan text yang ingin Anda quote. DELETE → Ctrl+C→ Ctrl+V (misalnya Yeremia 29:11 Sebab Aku ini mengetahui rancangan-rancangan apa yang ada pada-Ku mengenai kamu, demikianlah firman TUHAN, yaitu rancangan damai sejahtera dan bukan rancangan kecelakaan, untuk memberikan kepadamu hari depan yang penuh harapan)
- Klik COMPOSE → PERBARUI
Ketr: No.7 dan 8 - Atau cara kedua, pastenya setelah klik COMPOSE, ganti tulisan “Taruh disini teks, gambar atau media lain yang akan diquote”
- Lalu tekan Ctrl + V → SIMPAN → PRATINJAU → PUBLIKASIKAN
- Ketik Judul → Share
- Lihat Blog
- Hasilnya seperti ini :
Dibawah ini juga contoh quote di blog saya :
Keterangan : sumber http://remajasampit.blogspot.com
<div style="border: 5px solid rgb(238, 238, 238); tebal border height: 150px; tinggi scroll overflow: auto; padding: 10px; text-align: left; width: 500px;"> lebar scroll <blockquote class="tr_bq">Taruh disini teks, gambar atau media lain yang akan diquote</div>
Categories:
TUTORIAL
0 comments:
Post a Comment