Cara Resize Gambar di Home page Magazine Template R.1.2

Sambil larak-lirik posisi Kampanye Damai Pemilu Indonesia 2009 di om google, mending ngebahas yang lain biar tidak bosan. Sudah beberapa kali kang Rohman menerima keluhan tentang Magazine Template R.1.2, keluhannya yaitu tentang tampilan gambar yang ada di bagian home page yang terlihat kecil.

Bagaimana cara resize gambar di home page magazine Template magazine R.1.2 ?

Jika anda merasa kurang nyaman dengan tampilan gambar yang ada pada home page magazine Template R.1.2, anda bisa me resize nya dengan cara berikut :

 

• Login ke blogger dengan ID anda.
• Klik Tata Letak.
• Klik tab Edit HTML

• Cari kode berikut :

   

  .post-body img{
        max-width:70px;
        padding:1px;
        float:left;
        margin:0 5px 1px 0;
        border: 1px solid #cadaef;
  }

  
  
  

   

  
  



• fokus pada kode :
  

   

  
  
  

  max-width:70px;

  
  
  

   

  
  



• 
  

  Gantilah nilai pixelnya dengan yang lebih tinggi, di sarankan tidak lebih dari 300px, misal :

  
  
  

   

  
  
  

  max-width:300px;

  
  
  

   

  
  



• 
  

  Sehingga kodenya akan menjadi seperti dibawah ;

  
  
  

   

  
  
  

  .post-body img{
        max-width:300px;
        padding:1px;
        float:left;
        margin:0 5px 1px 0;
        border: 1px solid #cadaef;
  }

  
  



• Klik tombol Simpan template



• Selesai

Keterangan tambahan :

Max-width artinya maksimal lebar gambar yang ditampilkan. Mudah bukan?

 

Selamat mencoba!

Buat Kolom Dibawah Header Pada Magazine Template 2

Jika sebelumnya kang Rohman telah membuat tutorial tentang cara membuat kolom di atas kolom posting pada template magazine 2, maka pada kesempatan kali ini mencoba alternatif lain yaitu membuat kolom dibawah kolom header. Ini tentunya berguna bagi anda yang suka menyimpan iklan langsung di bawah header.

Jika menilik pada desain asli magazine template 2, maka anda tentu saja tidak dapat menyimpan iklan atau apa saja langsung di bawah header. Berikut desain asli dari magazine template 2 :

 

Dan kita akan membuatkan kolom baru yang langsung berada di bawah kolom header, berikut contoh ilustrasi dari penempatan iklan langsung di bawah kolom header :

 

Tertarik ingin membuat kolom langsung di bawah header? berikut adalah cara lengkapnya :

1. Silahkan login ke Blogger dengan ID anda.
2. Klik Tata Letak
3. Klik tab Edit HTML.
4. Klik tulisan Download Template Selengkapnya.
5. Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula.
6. Cari kode ]]></b:skin>.
7. Copy paste kode berikut persis di atas kode  ]]></b:skin>.

   .adscolumn{
   width:933px;
   padding:10px 3px;
   background:#fff;
   margin:5px 10px 0px 10px;
   text-align:center;
   border:1px solid #C0C0C0;
   }

   .adscolumn .widget{
   }

8. Lihat ke bagian bawah, lalu cari kode berikut :

   <div id='main-wrapper'>

9. Copy paste kode berikut persis di atas kode <div id='main-wrapper'> :

   <b:section class='adscolumn' id='adscolumn' preferred='yes'/>

10. Klik tombol SIMPAN TEMPLATE.

11. Selesai.

 

Langkah selanjutnya, silahkan klik tab Elemen Halaman, maka anda akan melihat tata letak template menjadi seperti contoh gambar berikut :

 

Sekarang anda sudah bisa memasukan apa saja langsung di bawah kolom header.  Selamat mencoba!

Jangan lupa juga untuk mengunjungi para sponsor Blog Kang rohman yang ada di bawah kolom header serta di bawah posting ini agar kang Rohman rajin membuat tutorial baru !

Buat Kolom Diatas Kolom Posting Pada Magazine template 2

Tutorial kali ini khusus Kang Rohman tujukan bagi anda para pengguna template magazine 2 yang ingin menambahkan kolom baru di atas kolom posting. Ini di sebabkan setelah melakukan inspeksi ke beberapa pengguna template magazine 2, ternyata banyak diantaranya yang sering memasang iklan atau apa saja di atas kolom posting, namun tampilannya menjadi kurang enak untuk di lihat. Coba perhatikan gambar di bawah ini :

 

 

Coba bandingkan dengan gambar berikut :

 

 

Di lihat dari segi fungsi, kedua duanya memiliki fungsi yang sama yaitu memasang iklan di atas kolom posting, tidak ada yang salah dengannya. Namun, secara estetika gambar yang kedua jauh lebih baik. Disamping memiliki fungsi memasang iklan, nilai keindahan dari template tersebut tidak menjadi rusak ( itu menurut kang Rohman lho ).

Untuk menciptakan seperti gambar yang kedua seperti contoh di atas, anda perlu membuat kolom baru di atas kolom posting. Bagi yang berminat, silahkan ikuti langkah-langkah berikut ini :

 

1. Silahkan login ke Blogger dengan ID anda.
2. Klik Tata Letak
3. Klik tab Edit HTML.
4. Klik tulisan Download Template Selengkapnya.
5. Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula.
6. Cari kode ]]></b:skin>.
7. Copy paste kode berikut persis di atas kode  ]]></b:skin>.

    

   .topcolumn{
   width: 578px;
   padding:10px 0px 10px 10px;
   background:#fff;
   margin:0px 0px 10px 0px;
   text-align:left;
   border:1px solid #C0C0C0;
   }

   .topcolumn .widget{
   }

    

8. Lihat ke bagian bawah, lalu cari kode berikut :

    

   <div id='main-wrapper'>

    

9. Copy paste kode berikut persis di bawah kode <div id='main-wrapper'> :

    

   <b:section class='topcolumn' id='topcolumn' preferred='yes'/>

    

10. Klik tombol SIMPAN TEMPLATE.

11. Selesai.

 

Langkah selanjutnya, silahkan klik tab Elemen Halaman, maka anda akan melihat tata letak template menjadi seperti contoh gambar berikut :

 

 

Sekarang anda sudah bisa memasukan apa saja di atas kolom posting anda tanpa harus mengganggu keindahan dari template anda.

 

Selamat mencoba! serta jangan lewatkan, posting selanjutnya adalah tentang cara menambahkan kolom baru di bawah kolom header untuk template magazine 2. Jangan sampai terlewatkan!.