earth

Guestbook

/* Iklan google ads */
Seringkali kita merasa kesel lantaran saat meng-upload foto kedalam blog memakan waktu yang lumayan lama. Sebenarnya ada cara mudah untuk memasukkan foto kita kedalam blog, apalagi foto tersebut berasal dari album foto yang terdapat dalam Picasa, Flickr, Photobucket, Tinypic, Spacelive, atau foto/gambar dari situs lain.

Berikut adalah langkah-langkanya:
  • Login terlebih dahulu blog kamu.
  • Pada halaman dashboard, klik Entri Baru (New Post, jika postingan baru) atau Edit Entri (Edit Post, jika postingan lama)
  • Pada halaman Edit Entri, klik Edit HTML
  • Pada kotak Editing masukan kode:

Untuk foto sisipan di sebelah kiri:
<img style="float: left; margin: 0 10px 10px 0; width: 200px; height: 150px;" src="URL foto/gambar" border="0"/>
Untuk foto sisipan di sebelah kanan:
<img style="float: right; margin: 0 0 10px 10px; width: 200px; height: 150px;" src="URL foto/gambar" border="0"/>
Untuk foto sisipan di tengah:
<img style="display: block; text-align: center; margin: 0px auto 10px; width: 200px; height: 150px;" src="URL foto/gambar" border="0"/>
Perbedaan antara foto sisipan kiri, kanan, dan tengah terletak pada float dan posisi margin. Foto sisipan kiri memiliki margin: 0 10px 10px 0, magin foto sisipan kanan: 0 0 10px 10px, dan magin foto sisipan tengah: 0px auto 10px. Margin wpx xpx ypx zpx menunjukkan margin atas wpx, kanan xpx, bawah ypx, dan kiri zpx (mengikuti arah putaran jarum jam).

Ukuran foto sisipan pada script di atas adalah ukuran foto kecil dengan posisi landscape dengan width: 200px; dan height: 150px. Jika foto tersebut berbentuk potrait maka ukurannya dibalik menjadi width: 150px; dan height: 200px. Untuk ukuran foto yang lebih besar maka ubah saja ukuran lebar dan panjangnya. Ukuran foto sedang: width: 320px; height: 240px, dan ukuran foto besar: width: 400px; height: 300px.

Pusing ya dengan angka-angka itu? Gampangnya gini aja deh. Kamu ubah saja ukuran width-nya dengan persentase dan hapus ukuran height-nya. Misalnya: width: 35%. Ini artinya gambar yang ditampilkan akan sebesar 35% dari ukuran widget posting. Jika widget-nya 500px, maka gambar yang akan ditampilkan sebesar 0,35 x 500px = 175px.
Atau kamu juga bisa mengubah ukuran width dan height-nya dengan auto. Jadi ukuruannya akan seperti ini: width: auto; height: auto. Hanya saja kelemahannya setiap gambar yang dimasukkan akan ditampilkan sebesar gambar aslinya. Mudah kan?
  • Selanjutnya, bukalah foto yang akan kamu masukkan ke dalam blog. Tujukan pointer mouse pada foto tersebut lalu klik kanan. Pada kotak dialog, pilih Salin URL gambar (Copy Image Location) kemudian paste pada lokasi URL foto/gambar.
  • Untuk menambahkan tulisan setelah sisipan foto/gambar tersebut, klik Tulis (Compose), setelah itu silahkan curat-coret semau kamu.
Jika kamu ingin menambahkan link (tautan) untuk gambar tersebut, masukkan kode berikut sebelum kode untuk sisipan foto di atas:
<a href="Lokasi foto/gambar" title="Judul foto/gambar" target="_blank">

Nah, mudah kan? Kamu bisa mencobanya. Tapi awas, jangan sampai ukuran (size) foto pada URL foto/gambar lebih kecil dari ukuran lebar dan panjang foto pada kode sisipan. Kalo kamu ngambil fotonya dari Picasa, sebaiknya kamu gunakan size: s288, s400, s512, atau s800.

Namun jika tidak terbiasa dengan bahasa HTML sebaiknya kamu gunakan fasilitas insert image pada menu bar posting.

Selamat mencoba...
  • Artikel Terkait Dengan Blog Tutorials

    Terimakasih sudah membaca artikel SC Community's Blog

    20 komentar

    kode ntu dmn letak nya mas

    9 Juli 2009 pukul 13.58  

    sipplah ntar d coba. mudah2an sukses.

    16 Juli 2009 pukul 23.58  

    saya suadah nencoba klik kanan pada foto tapi ga ada tulisan URLnya di mana sih,,

    16 Agustus 2009 pukul 17.57  

    gmn ya mas, udah tak ikuti printahx tapi kokmasih ak bisa.
    aq cari 'copy image location' gak ada, yang ada cuma
    'copy link location'.
    tapi kalau tak paksakan pakai copy link location maka gambarx gak tampil, cuma link aja yang tampil..
    gmn dong ?

    18 Agustus 2009 pukul 21.01  

    Eeuuh... euweuh kanyaho sarua jeung urang. Ceuk kang eNeS mah, mousenya kudu di tujuin ke gambar, baru klik kanan. Nah ntar ada copy image location klo pake firefox, klo pake chrome ada Copy URL gambar. Kitu ceunah

    18 Agustus 2009 pukul 22.57  

    tks ya infonya... visit my blog. www.ahmadridho-ahmadridho.blogspot.com

    29 Oktober 2009 pukul 14.43  

    Terimakasih banyak infonya, mas. Kami akan coba sesuai tutornya di atas. Sekali lagi terimakasih. Maklum nih kami masih newbie. Kami disuruh kemari oleh bang Ivan.

    30 Januari 2010 pukul 16.23  

    numpang baca makasieh infonya

    4 April 2010 pukul 08.05  

    salam kenal..
    masa aku dah nyoba tapi kok ga bisaa, knapa ya??
    maen-maen ke blog ku mas
    www.kiplisamodra.blogspot.com

    7 Juli 2010 pukul 12.05  

    bingun mas,,
    He he,, maklum msih baru,

    Mksih uda d'bolehkan numpang baca,

    2 Mei 2011 pukul 23.49  

    makasih gan mudah di mrngerti

    21 Oktober 2011 pukul 23.29  

    terima kasih gan,,berhasil...

    26 Desember 2012 pukul 20.39  

    Gmn carax untuk download templete jnengan kie gAn ..??
    Trims,

    19 Oktober 2013 pukul 10.39  

    masih bingung gan....gmn klo ngobrolnya di fb aja gan...kita bahas rame" sama yg masih nubie gan...

    6 Februari 2015 pukul 17.58  

    Mantap infonya ,sangat bermamfaat buat saya yg masih newbe

    31 Oktober 2015 pukul 11.57  

    Tambahkan Komentar

    • Dimohon untuk tidak mencantumkan link aktif pada komentar sobat.
    • Gunakan Ruang Tanya pada TabView Menu, jika ingin menanyakan sesuatu yang tidak ada kaitannya dengan artikel di atas.
    Kang eNeS

    Terimakasih atas semua apresiasi yang sobat berikan.

    10 Artikel Terbaru

    10 Artikel Terpopuler