adf.ly

Minggu, 18 Januari 2009

Memasang Caption Pada Gambar

Sebenarnya caption atau titel pada gambar banyak digunakan oleh pengguna Wordpress. Dengan adanya caption, gambar yang ditampilkan menjadi lebih menarik. Selain itu caption juga membuat pembaca mengerti apa gambar yang ditunjukkan kepada mereka. Di blogspot, kita harus memasang caption ini secara manual, dengan mendeklarasikan css pada html blog. Anda juga bisa mengatur setingan caption. Coba Lihat gambar dibawah ini:


  • Sebelum



  • Sesudah


    Planet Mars



  • Jika ingin memasangnya silakan buka "Dasbor/Tata Letak/Edit html". Lalu masukkan kode dibawah ini di atas ]]></b:skin>

    .imgcontainer {
    position:relative;
    float:none;
    }
    .caption {
    font: normal 1em/1.3em arial;
    background:#fff;
    color:#000;
    position:absolute;
    bottom:0;
    left:0;
    margin-bottom:20px;
    text-align:center;
    width:100%;
    opacity:.75;
    filter:alpha(opacity=85);
    }

    Kemudian simpan template. Lalu buka "Posting/Buat/Tab edit html". Masukkan kode seperti ini dipostingan untuk menampilkan caption.

    <div class="imgcontainer">
    <img src="http://i209.photobucket.com/albums/bb124/tisani/MARS1-1.jpg"/>
    <div class="caption">nama gambar</div>
    </div>

    http://i209.photobucket.com/albums/bb124/tisani/MARS1-1.jpg adalah link gambar saya. Ganti dengan link gambar anda.

    Kemudian tekan "Terbitkan Entri". Jika Caption belum tampil digambar, coba pindahkan pendeklarasian captionnya yang terdapat pada HTML template anda. Pindahkan kode tersebut kebagian css yang mengatur postingan. Masih diatas kode ]]></b:skin> Lalu simpan. Lalu klik "lihat blog". Coba dilihat kembali gambar yang dipasang caption. Ya...moga caption sudah terpasang di gambar.

    Tidak ada komentar:

    Posting Komentar

    Catatan: Hanya anggota dari blog ini yang dapat mengirim komentar.