Jenis Halaman di tema v1.3.3 Blogspot

Format template widget Blogspot

Bagi yang sudah profesional dengan tag <b:section> mungkin tidak ada ke khawatiran untuk mengkustom elemen didalamnya

Tapi bagi para pemula, hal ini beresiko tampilan halaman akan gagal dirender dan elemen body hanya ditampilkan layar kosong saja.
Tag pembentuk widget
<b:section class="" id="" maxwidgets="1" showaddelement="no">

  <b:widget id="" locked="true" title="" type="">

    <b:widget-settings></b:widget-settings>

    <b:includable id="main"></b:includable>

  </b:widget>

</b:section>

Jenis halaman pada tema versi 1.3.3 seperti Soho ataupun Emporio sudah tertera didalam template HTML nya. Biasanya terletak tepat dibawah tag <body> seperti dibawah ini.

  </head>
  <body>
    <b:class cond='data:view.isPreview' name='preview'/>
    <b:class cond='data:view.isHomepage' name='homepage-view'/>
    <b:class cond='data:view.isArchive' name='archive-view'/>
    <b:class cond='data:view.isLabelSearch' name='label-view'/>
    <b:class cond='data:view.isSearch and !data:view.isLabelSearch' name='search-view'/>
    <b:class cond='data:view.isPost' name='post-view'/>
    <b:class cond='data:view.isPage' name='page-view'/>
    <b:class cond='data:view.isMultipleItems' name='feed-view'/>
    <b:class cond='data:view.isSingleItem' name='item-view'/>
    <b:class name='version-1-3-3'/>

Berdasarkan data diatas, terdapat 9 jenis tipe halaman. Namun dalam aksesnya hanya dominan mengarah pada 4 halaman saja antara lain:

  1. Link https://namasitus.blogspot.com akan mengarah ke Halaman depan / beranda (Homepage)
  2. Link https://namasitus.blogspot.com/2022/02/judul-post.html akan mengarah ke Halaman postingan
  3. Link https://namasitus.blogspot.com/p/judul-post.html akan mengarah ke Halaman static
  4. Link https://namasitus.blogspot.com/search/ akan mengarah ke Halaman pencarian

Namun agar lebih detail, masing-masing type halaman tersebut penjelasannya ada dibawah ini.

Penjelasan Conditional
Halaman Pratinjau (Preview)
Preview atau halaman pratinjau adalah halaman yang bisa kita buka pada kondisi masih dalam mode edit atau postingan masih belum dipublikasikan. Halaman inilah yang berfungsi memperlihatkan tampilan postingan yang masih dalam pengeditan tersebut. Tombolnya terletak di pojok kanan atas seperti ini .
Namun untuk tampilan halaman ini biasanya tidak banyak menjadi perhatian karena hanya berfungsi untuk pratinjau saja.

<b:class cond='data:view.isPreview' name='preview'/>

  • Penerapan CSS
    Gunakan name:-nya:
    .preview drive_file_rename_outline {/*Letakkan kode CSS disini*/}
  • Penerapan HTML
    Tag conditional (cond:) :
    <b:if cond='data:view.isPreview'>
    <!--Letakkan kode HTML disini-->
    </b:if>
  • Beranda / Homepage
    Halaman Beranda (Homepage / feed-view)

    <b:class cond='data:view.isHomepage' name='homepage-view'/>

  • Penerapan CSS
    Gunakan name:-nya:
    .homepage-view drive_file_rename_outline {/*Letakkan kode CSS disini*/}
  • Penerapan HTML
    Tag conditional (cond:) :
    <b:if cond='data:view.isHomepage'>
    <!--Letakkan kode HTML disini-->
    </b:if>

  • MultipleItems :

    <b:class cond='data:view.isMultipleItems' name='feed-view'/>


    data:view.isMultipleItems, Multiple berarti banyak atau memuat lebih dari 1 postingan saja pada body halaman. Contohnya pada entri postingan terbaru dan biasanya entri tersebut selalu terdapat di halaman utama. Maka halaman utama (Homepage) termasuk halaman Multiple item dan umumnya dalam template banyak menggunakan name feed-view ini daripada homepage-view.
  • Penerapan CSS
    Gunakan name:-nya:
    .feed-view drive_file_rename_outline {/*Letakkan kode CSS disini*/}
  • Penerapan HTML
    Tag conditional (cond:) :
    <b:if cond='data:view.isMultipleItems'>
    <!--Letakkan kode HTML disini-->
    </b:if>

  • (Search)

    <b:class cond='data:view.isSearch and !data:view.isLabelSearch' name='search-view'/>

  • Penerapan CSS
    Gunakan name:-nya:
    .search-view drive_file_rename_outline {/*Letakkan kode CSS disini*/}
  • Penerapan HTML
    Tag conditional (cond:) :
    <b:if cond='data:view.isSearch'>
    <!--Letakkan kode HTML disini-->
    </b:if>

  • Halaman Post
    (Single item)
    data:view.isSingleItem, ini mencakup 2 halaman yaitu : post-view dan page-view Berdasarkan artinya, Single Item berarti hanya memuat satu postingan saja dalam body halaman.

    <b:class cond='data:view.isSingleItem' name='item-view'/>

  • Penerapan CSS
    Gunakan name:-nya:
    .item-view drive_file_rename_outline {/*Letakkan kode CSS disini*/}
  • Penerapan HTML
    Tag conditional (cond:) :
    <b:if cond='data:view.isSingleItem'>
    <!--Letakkan kode HTML disini-->
    </b:if>
  • <b:class cond='data:view.isPost' name='post-view'/>

    data:view.isPost (postingan) dan data:view.isPage (halaman statis) keduanya ini termasuk halaman Single Item Karena hanya memuat postingan single atau satu postingan saja.

  • Penerapan CSS
    Gunakan name:-nya:
    .post-view drive_file_rename_outline {/*Letakkan kode CSS disini*/}
  • Penerapan HTML
    Tag conditional (cond:) :
    <b:if cond='data:view.isPost'>
    <!--Letakkan kode HTML disini-->
    </b:if>

  • <b:class cond='data:view.isPage' name='page-view'/>


  • Penerapan CSS
    Gunakan name:-nya:
    .page-view drive_file_rename_outline {/*Letakkan kode CSS disini*/}
  • Penerapan HTML
    Tag conditional (cond:) :
    <b:if cond='data:view.isPage'>
    <!--Letakkan kode HTML disini-->
    </b:if>

  • Halaman Arsip
    (Archive)

    <b:class cond='data:view.isArchive' name='archive-view'/>


  • Penerapan CSS
    Gunakan class:-nya:
    .homepage-view drive_file_rename_outline {/*Letakkan kode CSS disini*/}
  • Penerapan HTML
    Tag conditional (cond:) :
    <b:if cond='data:view.isHomepage'>
    <!--Letakkan kode HTML disini-->
    </b:if>

  • Halaman Pencarian Label
    (LabelSearch)

    <b:class cond='data:view.isLabelSearch' name='label-view'/>

  • Penerapan CSS
    Gunakan class:-nya:
    .homepage-view drive_file_rename_outline {/*Letakkan kode CSS disini*/}
  • Penerapan HTML
    Tag conditional (cond:) :
    <b:if cond='data:view.isHomepage'>
    <!--Letakkan kode HTML disini-->
    </b:if>
  • Posting Komentar (0)
    Lebih baru Lebih lama