Rabu, 29 Januari 2014



.      Pertama, kita harus mencari letak elemen gambar slideshow pada HTML
-          Pertama kita masuk ke dalam dasbor blogger kita > lalu pilih template > lalu pilih edit HTML
-          Lalu untuk mempermudah pencarian pada kotak dialog elemen kita tekan Ctrl+F lalu isikan dalam pencarian judul title pada gambar di blog (Lihat gambar)

-         
-          Copykan tulisan :: This is featured post 1 title :: pada kotak pencarian tadi.
-          Setelah itu kita akan tahu letak elemen slideshow.

2.       Poin kedua yaitu kita cari ukuran gambar agar selaras dengan slideshow
-          Kita kembali pada blog kita, lalu kita klik kanan pada gambar slideshow, lalu copy alamat URL gambarnya dan pastekan pada tab baru lalu enter dan kita akan tahu berapa ukuran dari gambar tersebut. Misal 300x200
-          Setelah itu agar kita bisa merubah gambar yang ingin kita jadikan slideshow agar selaras, maka kita ubah ukuran gambar tersebut sesuai ukuran pada slideshow. Kita bisa memakai aplikasi picture pada PC (seperti photoscape, adobe photoshop, dll) atau dengan aplikasi pada internet seperti www.resizepic.com. Di web ini kita bisa mengupload foto lalu mengatur Height (Tinggi) dan Width (Lebar) pada foto atau gambar yang akan kita upload. (Lihat gambar)
-         


3.       Poin ketiga yaitu mengganti alamat gambar slideshow bawaan template dengan gambar yang akan kita upload pada dasbor blogger.
-          Untuk memperoleh alamat gambar atau foto yang akan kita upload pada slideshow blog kita, pertama kita harus mengupload gambar / foto kita pada web yang menyediakan wadah untuk upload foto. Seperti www.photobucket.com, www.picasa.com, dll.
-          Misalnya kita disini akan memilih photobucket.com untuk mengambil alamat gambar kita. Pertama kita harus sign in terlebih dahulu pada photobucket.com (bila belum punya akun kita harus log in terlebih dahulu), lalu kita upload foto atau gambar kita, setelah di upload lalu kita klik gambar tersebut, lalu klik kanan pada gambar dan kita pilih salin alamat URL / copy alamat URL tersebut.
-          Setelah itu kita kembali pada dasbor > template > edit HTML. Disini kita kembali pada poin pertama, yaitu mencari elemen slideshow. Lalu kita akan menemukan elemen seperti tulisan dibawah ini (contoh)
<div class='fp-post'>
<div class='fp-thumbnail'><a href='featured-post-1-url-here'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3gQV9kgn5reJ8eIt0vC5Ob9o2la4N5I3-S9d1KrC_1PllPIB6KY6AAft331EbHTKCr3IGs-cEMCkXzO179cgCDTn_1FzCBLGTc_07jAIssgO6ziv4awM6MBkb3h2QbbPe96lG1Symzy9f/s0/3.jpg'/></a></div>
<h3 class='fp-title'><a href='featured-post-1-url-here'>This is default featured slide 1 title</a></h3>
<p>Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.</p>
</div>
-          Pada tulisan BIRU kita ganti dengan alamat URL gambar/foto yang kita ambil tadi dari photobucket.com
-          Pada tulisan MERAH bisa diganti untuk menggan judul pada slideshow.
-          Pada tulisan HIJAU untuk mengganti deskripsa gambar pada slideshow.
-          Langkah terakhir kita klik Simpan Template, lalu kita lihat hasilnya pada blog.
-          Lalu lakukan hal yang sama untuk mengganti gambar pada-pada slide-slide berikutnya.

0 komentar:

Posting Komentar