Cara Membuat Gambar Posting Sejajar Horizontal

Asalamualaikum sobat . .
Dimalam hari ini saya ingin berbagi artikel menarik yang mungkin sobat blogger ada yang belum tahu, saya sendiri yang sudah satu tahun bergelut di dunia ngeblog juga baru tahu wkwkwkwk.. ya maklum sob, saya kurang aktif di blog's lagi pula saya juga belum kepikiran tentang trik ini jadi saya tidak berusaha mencari tahu hehehehe..
Memang apa yang akan saya share dimalam hari yang dingin ini??
Sesuai dengan judul diatas, "Cara Membuat Gambar Postingan Blog Berjejer Di Halaman Posting"
Cara ini cukup bagus untuk di terapkan, karena tidak hanya foto foto anda akan berjejer tapi anda juga akan bisa mengatur ukuran gambar secara manual baik itu tinggi foto maupun lebar foto ..
Anda juga bisa menambahkan link kesetiap gambar yang anda unggah, anda juga bisa menjejerkan foto lebih dari dua foto. Sebagai contoh silahkan anda lihat koleksi foto saya di bawah ini, ya mungkin kurang ganteng sih untuk di pampang disini tapi gak apa apalah hehehe


Bagaimana sobat,, apakah anda tertarik dengan gambar di atas?? Ups salah.. maksut saya apakah anda tertarik dengan script foto berjejer di atas? hehehe
Jika tertarik silahkan anda copy saja script dibawah ini OKE?
<table  border="1"><br /><tr>
<td><a href="URL-POSTING-SOBAT-DISINI" target="_blank"><img src="URL_FOTO-SOBAT-DISINI" style="width:200px;height:200px"/></a></td><br />
<td><a href="URL-POSTING-SOBAT-DISINI" target="_blank"><img src="URL_FOTO-SOBAT-DISINI" style="width:200px;height:200px"/></a></td><br />
<td><a href="URL-POSTING-SOBAT-DISINI" target="_blank"><img src="URL_FOTO-SOBAT-DISINI" style="width:200px;height:200px"/></a></td><br />
</tr><br /></table>
Keteranganya sob..
1. Teks warna Merah URL POSTING adalah URL yang bisa anda masukkan, tapi jika anda tidak menginginkanya bisa dengan menghapusnya mulai dari <a href="URL-POSTING-SOBAT-DISINI" target="_blank">
2. Teks warna Merah URL FOTO adalah URL wajib yang sobat harus pasang contohnya seperti https://m.ak.fbcdn.net/sphotos-b.ak/hphotos-ak-ash3/s720x720/599600_380564708704479_1605365350_n.jpg
3. Teks warna Biru adalah Link New Tab atau script tambahan yang apabila di klik akan muncul di tab baru, jika sobat tidak menginginkanya bisa sobat hapus saja 
4. Teks warna Hijau Tua adalah lebar dan tinggi gambarnya, ganti angka 200 menjadi angka pilihan anda
width adalah lebarnya sedangkan height adalah tingginya
5. Script diatas adalah untuk yang 3 foto, jika sobat ingin memasang dua foto maka sobat hapus saja <td><a href="URL-POSTING-SOBAT-DISINI" target="_blank"><img src="URL_FOTO-SOBAT-DISINI" style="width:200px;height:200px"/></a></td><br />
(((((((THE END))))))
Seperti itulah cara singkatnya, saya rasa apa yang saya tuliskan diatas semuanya sudah jelas, semoga dapat membantu.. Jika masih ada pertanyaan silahkan tulis di kotak komentar ..
Wassalamualaikum wr..wb..

URL

6 Tanggapan » Lihat

sangat bermanfaat gan bagi saya, , ,saya cari tutorial ini gan, , ,terimakasih gan,, ,sobat pengen cerita lucu di sini tempatbya di blog saya gan, ,http://arifinbercerita.blogspot.com/

iya gan sama-sama .. terimakasih telah berkunjung dan sudi untuk berkomentar ..
Setelah ada waktu pasti saya kunjungi situs agan..

makasih banyak min...... sangat membantu banget ,,,,,,,,,......

kang, kasih tau bikin gambar berjejer kesamping tapi yang responsive dong..
udah ngubeg2 gak nemu2 kang :(

Untuk membuatnya jadi responsive, kita perlu menambahkan CSS MEDIA SCREEN

Misalnya seperti ini

<style>
@media screen and (max-width: 600px) {
td img{width:150px;height:100px}
}
</style>

yang diatas itu hanya akan ditampilkan untuk layar lebar maksimal 600pixel dan untuk yang lebarnya dibawah 600px akan terpengaruh..

Semoga terbantu

Komentar yang bermanfaat mendapat Rating*****oleh Admin blog ini