March 18, 2012

Memperbesar Tampilan Gambar di Slideshow Blogger

Seperti kita ketahui secara default tampilan gambar pada fasilitas slideshow di widget blogger sangat kecil, mungkin memang didesain untuk menampilkan gambar pada sidebar, tetapi jika kita mempunyai keperluan menampilkan gambar yang ukurannya lebih besar akan terasa sangat sulit, untuk itu bisa dicoba menambahkan css untuk merubah ukuran gambar tersebut. Langkah-langkahnya adalah:

Login ke blogger anda, masuk ke Design, Template Designer, Advanced , Add CSS, tambahkan kode dibawah ini dan ingat untuk menekan enter setelah kode terakhir, kemudian klik Apply to Blog.

.slideshow-container{
width: 250px;
height: 300px;
}
.slideshow-container div a img {
min-width: 250px !important;
height: auto !important;
}

Cara kedua bisa juga dilakukan melalui menu Design, Edit HTML, klik Expand Widget Templates, kemudian carilah kode dibawah:
]]>
</b:template-skin>

dan tambahkan kode tadi tepat sebelumnya, jadi terlihat seperti dibawah, kemudian save template.

.slideshow-container{
width: 250px;
height: 300px;
}
.slideshow-container div a img {
min-width: 250px !important;
height: auto !important;
}
]]>
</b:template-skin>

Anda bisa merubah ukuran gambar sesuai dengan keinginan, caranya adalah dengan merubah width dan height pada kode diatas, misalnya width: 300px , height: 250px.

Untuk menambah Slide Show Widget, masuk ke menu Design, Page Elements, lalu klik Add a Gadget, dan temukan SlideShow Widget, untuk jelasnya bisa dilihat pada gambar di bawah:

slideshow
Tinggal kita klik slideshow, lalu tentukan sumber gambarnya, simpan dan anda akan melihat tampilan slideshow dengan ukuran yang diinginkan di blog anda.

Terima kasih.
Semoga membantu.

13 comments:

  1. SAYA SUDAH COBA ISI KAN KE CSS. TAPI SAYA BUTUH SETTING ULANG DI UKURANNYA. TRUS GIMANA CARANYA BOS

    ReplyDelete
    Replies
    1. Untuk mengubah ukurannya, ubah bagian ini

      .slideshow-container{
      width: 250px;
      height: 300px;
      }

      Caranya masuk ke design, edit html, check expand widget, dan cari tulisan tersebut diatas biasanya sebelum tulisan , lalu ganti sesuai dengan keinginanmu

      Delete
  2. terimakasih atas infonya...
    aq sudah coba dan berhasil...

    ReplyDelete
  3. sob gaman cara mengganti gambar slide dengan ukuran semula, sy udah cba ganti gmbr dr web picasa ternyata setelah tampil gmbarnya berukuran kecil tidak penuh seperti gambar bawaaan template, pencerahannya sob...salam kenaldan trims.

    ReplyDelete
    Replies
    1. maksudnya gmn ya sob, mungkin bisa dicoba langkah dalam tulisan ini, ukurannya kan bisa di set sesuai keinginan, untuk gambar di picasa tidak perlu diubah.

      atau coba cari di edit HTML, kode seperti dibawah:
      div class='slideshow-container' , pastikan tidak ada style untuk merubah ukuran pada penutupnya.

      atau coba sobat hapus saja dulu slideshow widgetnya, trus tambahin lagi yang baru mungkin ukurannya bisa kembali ke default, selamat mencoba ya


      Delete
  4. Makasih.. cara dua aku coba ternyata berhasill trims

    www.wildanppob.com

    ReplyDelete
  5. makasih ilmunya,,,,smoga mendapat balasan dari yang Maha Kuasa amiiin,,,,

    ReplyDelete
  6. saya mau pasang slide show foto dari flickr kenapa fotonya pecah ya? :(

    ReplyDelete
  7. fotonya pecah bos...pas di gedein ke size yang ane pengen....apakah ada cara supaya gak pecah?tks

    ReplyDelete
    Replies
    1. coba perbesar ukuran (resolusi) gambarnya juga sob.

      Delete