Membuat Halaman Homepage Berbeda Dengan Halaman Post

Tehnik ini memang benar-benar ribet.  Sebab dari semua blog yang saya googling, terlalu banyak penjelasan dan keterangan kode-kode, sehingga saya benar-benar bingung, dan tidak berhasil.

Sampai akhirnya saya berhasil memikirkan dan mencobanya sendiri, dan yap.. itu sangat memuaskan.

Oke inilah yang saya maksud, Halaman Muka atau Homepage hanya satu Colom, sementara halaman posting 2 atau 3 colom.

Caranya:


1. Silahkan anda buat blog anda menjadi 2 atau 3 kolom, dari  Designer Template

2. Setelah itu, kita akan menyembunyikannya di Homepage, sehingga halaman itu hanya muncul dihalaman postingan.

Anda cari ke 2 kode ini (kode yang berwarna merah)

<b:template-skin>
      <b:variable default='960px' name='content.width' type='length' value='1160px'/>
      <b:variable default='0' name='main.column.left.width' type='length' value='0px'/>
      <b:variable default='310px' name='main.column.right.width' type='length' value='310px'/>

      <![CDATA[
      body {
        min-width: $(content.width);
      }

      .content-outer, .content-fauxcolumn-outer, .region-inner {
        min-width: $(content.width);
        max-width: $(content.width);
        _width: $(content.width);
      }

      .main-inner .columns {
        padding-left: $(main.column.left.width);
        padding-right: $(main.column.right.width);
      }



      .main-inner .fauxcolumn-center-outer {
        left: $(main.column.left.width);
        right: $(main.column.right.width);
        /* IE6 does not respect left and right together */
        _width: expression(this.parentNode.offsetWidth -
            parseInt("$(main.column.left.width)") -
            parseInt("$(main.column.right.width)") + 'px');
      }

      .main-inner .fauxcolumn-left-outer {
        width: $(main.column.left.width);
      }

      .main-inner .fauxcolumn-right-outer

{
        width: $(main.column.right.width);
      }

      .main-inner .column-left-outer {
        width: $(main.column.left.width);
        right: 100%;
        margin-left: -$(main.column.left.width);
      }

      .main-inner .column-right-outer {
        width: $(main.column.right.width);
        margin-right: -$(main.column.right.width);
      }

      #layout {
        min-width: 0;
      }

      #layout .content-outer {
        min-width: 0;
        width: 800px;
      }

      #layout .region-inner {
        min-width: 0;
        width: auto;
      }
      ]]>
    </b:template-skin>

-----------------------------------------------------------------------------------------------------------------------


Lalu letakkan kode ini  <b:if cond='data:blog.pageType == &quot;item&quot;'>

diatas kode     <b:template-skin>





Kemudian letakkan kode ini    </b:if>

Dibawah kode   </b:template-skin>



Save, dan yap... selamat bersenang-senang...!!