Mungkin sebagian visitor blog gue ada yang kangen dengan postingan-postingan tutorial gue. Bahkan mungkin ada yang belum tau kalau di blog gue ada postingan tutorial. Tutorialnya bermacam-macam, ada yang berhubungan dengan video maker, design blog, dll. Penasaran? klik disini.
Kali ini gue bakal membahas tutorial singkat alias nggak susah-susah banget yang berhubungan dengan design blog. Semoga tutorial gue jelas dan mudah dimengerti oleh kalian. Kalau masih nggak ngerti, gue bakal praktekin dengan video juga. Dan, mungkin untuk postingan tutorial gue seterusnya bakal di lengkapi dengan video.
Di postingan ini, gue bakal bahas tutorial "Bagaimana caranya agar readmore kita berupa gambar". Mungkin ada yang belum tau apa sih maksudnya Readmore pakai gambar?..
Readmore adalah fitur blogger yang mempunyai fungsi mempersingkat postingan kita di halaman utama blog (Yang kita kenal dengan "Selengkapnya/Selanjutnya"). Biasanya kan pakek text doang tuh, tapi disini diganti dengan berupa gambar.
Contohnya begini:
Bagaimana cara bikinnya? Cekidot!
Cara Bikin Readmore Pakai Gambar
Sebelumnya, siapkan dulu gambar yang ingin dijadikan Readmore. Bisa diambil dari google image atau kalian design/bikin sendiri di photoshop dengan ukuran yang pas.
Oke, pertama-tama kita login blogger dulu. Kalau nggak login, kalian nggak bisa apa-apain blog kalian. Setelah login, jangan lupa klik tab template, disitu kalian akan melihat tampilan seperti dibawah ini.
Oke, pertama-tama kita login blogger dulu. Kalau nggak login, kalian nggak bisa apa-apain blog kalian. Setelah login, jangan lupa klik tab template, disitu kalian akan melihat tampilan seperti dibawah ini.
Di gambar, ada tombol "Edit HTML". Kalian klik aja.. Setelah itu tampilan akan berubah lagi menjadi seperti ini..
Kalau blogger awam pasti mikir ini adalah bagian sulit dan nggak dimengerti. Sama, gue juga nggak ngerti tentang ginian. Yang gue tahu ini namanya kode HTML. Kalau kalian penasaran dengan penjelasan lengkapnya, check aja google.
Ya udah, lanjut saja~
Pada tampilan kode HTML, kalian cari kode <a expr:href='data:post.url + "#more"'> (Jangan lupa pakek CTRL+F dahulu agar pencarian kode semakin mudah dan cepat).
Masih di gambar, dibawahnya ada kode <img alt='read more' src='http://i.imgur.com/JEiCLKE.png'/> kan? Nah, itu kodenya. Kalau kodenya nggak ada di blog, tambahkan aja..
Perhatian, disana gambarnya adalah gambar readmore gue. Kalau kalian mau ganti gambar, silahkan ubah pada kode src='http://i.imgur.com/JEiCLKE.png'/ dengan kode gambar kalian sendiri.
Masih bingung dengan dapetin kode gambar gimana? silahkan upload gambar readmore versi kalian di imgur.com dan ambil kode gambar yang kalian upload tadi disana. Trus, ganti deh kodenya..
Nah, sekarang blog kalian agak sedikit menarik dari sebelumnya. Kalau masih belum jelas dan tulisan gue terlalu ribet, silahkan nikmati videonya dibawah ini..
Oke, kalau masih belum ngerti juga, Silahkan bertanya melalui komentar, Facebook, dan Twitter gue. Kalian juga bisa cari tutorial jenis ini di google, banyak kok.
Selamat mengobrak abrik template blog!
Ps: Khusus untuk pengguna blogger/blogspot.
Sumber Gambar Postngan Readmore By www.allblogtools.com