Bantuan » Serbaneka » posisi gambar di samping text

  • mau nanya nih..
    bagaimana meletakkan gambar di samping text / isi artikel, dalam artian sejajar dengan naskahnya, soalnya selama ini saya cuman bisa meletakkan di tengah atas, samping kanan dan samping kiri saja.
    mohon penjelasannya

Melihat 13 balasan - 1 sampai 13 (dari total 13)
  • Moderator Huda Toriq

    (@hudatoriq)

    Bisa kok. Pake WP versi berapa? Di versi yang baru-baru ini di WP disediain menu untuk mengatur alignment gambar. Tapi dia hanya memberikan atribut ke gambar, misalnya: <img class=”alignleft” … />. Jadi di tema juga harus dibuatkan properti2 untuk kelas ini.

    Kalau bisa masalahnya diperjelas, misalkan dengan menyertakan URL atau screenshot (diunggah ke suatu tempat di web dan ditempelkan di sini).

    Pencetus Utas mas_zen

    (@mas_zen)

    Contohnya seperti ini mas :

    The Best Sources of Content for WordPress Users

    di artikel itu logo wordpress khan posisinya sejajar dengan tulisan disampingnya, bagaimana cara melakukan itu.

    trima kasih

    itu pake <img style=”float:right”>

    Pencetus Utas mas_zen

    (@mas_zen)

    kok gak mau yah mas, coba di liat di blog aku.

    http://arifin.web.id/2008/09/pantai-watu-ulo/

    mohon pencerahannya lagi.
    makasih

    Pencetus Utas mas_zen

    (@mas_zen)

    kayaknya dak bisa mas, tampilan pada waktu aku ada dalam posis edit post ama hasil publish dak sama, contohnya bisa diliat disini.

    http://arifin.web.id/wp-content/uploads/2008/09/edit.JPG

    dan hasil setelah di publish jadi seperti ini
    http://arifin.web.id/2008/09/apple-prepping-a-32gb-iphone-update-bringing-back-at-home-activation/

    kenapa yah, aku pake wp Version 2.6.2 pake automatic update, apa da yag salah ??

    kasih penjelasan donk 🙁

    Moderator Huda Toriq

    (@hudatoriq)

    Interface rich text editor di WP versi-versi belakangan ini (saya lupa tepatnya versi berapa) memang agak berubah. Biasanya kalau kita (lewat interface visual editor) atur gambar supaya rata kiri atau rata kanan, WP memberikan atribut html seperti ini:

    align="left"

    atau

    align="right"

    Sedangkan untuk versi-versi terakhir, yang diberikan kepada elemen gambar ialah class, yang dipakai untuk selector CSS. Contoh class yg diberikan:

    class="alignleft"

    atau

    class="alignright"

    Nah, theme agar dikatakan kompatibel dengan versi WP yg baru, seharusnya menerjemahkan class ini ke dalam properti-properti CSS. Namun yang saya lihat, theme yg sdr pakai tidak kompatibel. Solusinya, coba sisipkan kode CSS berikut ke style.css theme yg sdr pakai:

    img.centered {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    	}
    
    img.alignright {
    	padding: 4px;
    	margin: 0 0 2px 7px;
    	display: inline;
    	}
    
    img.alignleft {
    	padding: 4px;
    	margin: 0 7px 2px 0;
    	display: inline;
    	}
    
    .alignright {
    	float: right;
    	}
    
    .alignleft {
    	float: left
    	}

    Semoga membantu

    ^ itu udah saya alami sejak WP 2.3 😀

    Pencetus Utas mas_zen

    (@mas_zen)

    makasih mas udah saya tambahin, makasih ya.

    trus mo nanya lagi neh, soal xml google maps plugin.
    gimana cara masukin mapnya ke postingan ?? aku udah masukin api key nya. tapi kok gak ada menu buat input map nya yah.

    mohon penjelasannya.
    makasih

    masuk ke menu Penataan > XML-Sitemap

    Moderator Huda Toriq

    (@hudatoriq)

    @mas_zen

    Monggo jangan sungkan2 bikin topik baru untuk permasalahan baru mas.
    Btw, yg dimaksud di sini itu plugin google sitemap atau google map?

    gimana cara masukin mapnya ke postingan ??

    Google Sitemap tidak bisa dimasukkan ke postingan. Yang ada, postingan yg dimasukkan (secara otomatis) ke google sitemap.

    Maafkan pertanyaan saya. Hanya ingin mengantisipasi, soalnya saya pernah berkali2 bertemu dengan pengguna WP yg mengira google sitemap = google map 😛

    Pencetus Utas mas_zen

    (@mas_zen)

    ups maaf kurang jelas yah maksutnya, yg saya maksut google map bukan sitemap om huda.

    makasih

    mas,, terima kasih ..sekarang text-nya udah bisa wrap..

    tapi saya masih menemui masalah dengan list item.. nomornya tumpang tindih dengan wp-caption,,
    ada solusi??

    permasalahan bisa dilihat di sini… bukan promosi lho.. 😀

    sebenernya bs make CSS yg huda pake..
    yg alignleft-right maksudnya mungkin supaya lbh semantik x/html ya, hud, dkk cmiiw 🙂

    ut kasus terakhir, coba ditambahin margin-right:30px di berkas x/html-nya:

    <div id="attachment_189" class="wp-caption alignleft" style="width:310px; margin-right:30px;">

    class ama style tumpang tindih ya…
    tp saya hanya nyoba di fx 3.x, blm di IE6.

    bukannya lbh enak diatur sekalian di CSS, inline style="..." di berkas x/html diapus (utk memudahkan ngedit desain/layout tanpa ngedit berkas x/html-nya)–entah jika editor WYSIWYG WP membuat kode style tersendiri, terutama terkait pemuatan gambar.. 🙁
    mis. tambahin CSS (arrgh IE6.. perlu margin-left krn make float:left ya cmiiw):

    .wp-caption-left {
    float:left;
    width:310px;
    margin-top:5px;
    margin-right:30px;
    margin-bottom:5px;
    margin-left:0;
    padding:5px;
    border:dotted #b30908 2px;
    background-color:#250601;
    display:inline;
    text-align:center;
    }

    cmiiw

Melihat 13 balasan - 1 sampai 13 (dari total 13)
  • Topik ‘posisi gambar di samping text’ tertutup untuk balasan baru.