Tipe Halaman di Blog Blogspot yang Perlu Anda Ketahui ! - Mengelola Blog

Tipe Halaman di Blog Blogspot yang Perlu Anda Ketahui !

Mengelolablog.com - Saat pertama kali ngeblog dan mulai mencari tahu tentang desain template blog, sering kali saya membaca kutipan-kutipan seperti ini saat blogwalking,

"Buat tag judul unik untuk setiap halaman", "Berikan deskripsi unik yang sesuai konten di setiap halaman", atau yang seperti ini... "Buat konten yang unik dan orisinil di setiap halaman".

Entah kutipan tersebut ada dijudul artikel populer ataupun isi postingan. Intinya, setiap anjuran yang ada, selalu mengarah kepada tiap-tiap halaman.

Awalnya sih kutipan tersebut saya anggap biasa aja, toh yang tampil di setiap halaman blog paling isinya header blog, sidebar, blog post dan footer, baik itu di halaman beranda ataupun halaman postingan.

Ketika saya mulai sering membuat konten dan belajar sedikit-sedikit tentang cara memodifikasi template blog, ternyata blog di blogger memiliki tipe halaman yang berbeda-beda, dan tentunya setiap tipe halaman ini juga memiliki fungsi dan format yang berbeda pula.

Untuk mengelola blog supaya menjadi lebih baik lagi, maka Anda perlu mengetahui apa saja yang perlu dikelola. Selain update konten secara reguler dan teratur, tentu pengelolaan terhadap halaman-halaman yang ada di blog juga sangat diperlukan.


Apa saja manfaatnya jika kita mengetahui dan memahami tipe halaman blog Blogger?


  • 1. Membantu kita menjadi lebih kreatif saat mendesain template blog sehingga menjadi lebih unik dan berbeda dari yang lain.
  • 2. Membantu kita untuk membuat navigasi situs yang lebih baik bagi pengunjung maupun search engine.
  • 3. Menjadikan blog kita lebih mudah untuk dijelajahi.

Ya, mengetahui dengan baik tipe-tipe halaman pada blog blogger ini ternyata sangat membantu, khususnya saat kita bereksperimen dengan desain template blog. Misalnya ketika kita ingin menampilkan popular post hanya pada halaman posting, atau ketika kita tidak menginginkan tampilan iklan di halaman home page.


Mengenal 8 Tipe Halaman Blog di Blogspot


Dengan mengetahui tipe-tipe halaman, maka kita bisa memodifikasi apa dan widget mana yang harus tampil di halaman yang kita inginkan.

Sepanjang yang saya ketahui, ada 4 tipe utama untuk tipe halaman blog di blogger ditambah 4 tipe lagi pada halaman tipe indeks. Apa saja tipe halaman tersebut, yuk simak informasinya dibawah ini.


Bentuk Umum Tipe Halaman Pada Blog Blogger


Untuk lebih memudahkan Anda dalam memahami tipe halaman dalam blog, maka kita mencoba melakukan pendekatan dengan menggunakan contoh sebuah gelas yang biasa digunakan untuk tempat meminum air.

Setiap halaman dalam blog jika kita ibaratkan sebagai gelas, maka tipe halaman blog itu sendiri adalah jenis dari gelas tersebut.  Bisa berjenis  gelas plastik, gelas kaca, gelas melamin, gelas keramik dan lain sebagainya.

Artinya, meskipun hanya berupa gelas, namun tetap memiliki jenis gelas yang berbeda. Begitu pula halaman sebuah blog.  Sampai disini, saya harap Anda bisa memahami perumpamaan tersebut diatas.

Didalam blog pada umumnya, semua link yang ada akan merujuk pada sebuah halaman. Namun setiap halaman dalam blog memiliki tipe/jenis yang berbeda-beda. Adapun tipe-tipe halaman yang ada pada blog di Blogger.com adalah halaman tipe item,  static_page,  index dan terakhir adalah error page.

Pada template html blog, tipe halaman biasanya ditandai dengan tag pageType yang akan diiringi dengan sebuah nilai yaitu  item, static_page, index, atau error_page.

Umumnya, tag pageType berbentuk seperti ini
'data:blog.pageType=="item" (merujuk tipe halaman item, bisa diubah menjadi static_page, index, dan lainnnya)'

Tag pageType seringkali digunakan bersamaan dengan Tag Kondisional.  Berikut adalah bentuk umum tag kondisional tipe halaman blog di Blogger.com (sebagai contoh disini digunakan halaman tipe item)
<b:if cond='data:blog.pageType == "item"'>
<!--Item Page-->
</b:if> 

Keterangan
  • <b:if cond= ,sebuah tag pernyataan kondisi, yang berarti  "jika kondisinya adalah".
  • 'data:blog.pageType ,menyatakan bahwa data blog  yang akan ditampilkan adalah tipe halaman.
  • == ,menyatakan kondisi halaman yang akan digunakan berstatus sama dengan. 
  • "item"'> , menyatakan tipe halaman berjenis item.

Jika kode  berwarna biru pada tag kondisional tersebut diatas kita baca, maka akan terbaca seperti kalimat berikut
"Jika kondisi data tipe halaman adalah sama dengan tipe halaman jenis item, maka ...." 

Setiap halaman, baik itu item, static, maupun index , struktur dan susunan halamannya dapat diatur. Salah satu contoh yang saya perlihatkan dibawah ini adalah pengaturan kondisi untuk susunan struktur judul di halaman tipe  item.

Susunan struktur judul halaman pada halaman tipe item dapat diatur dengan menggunakan tag kondisional. Perhatikan potongan tag kondisional pada halaman tipe item dibawah berikut ini.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <title>
        <data:blog.pageName/> | <data:blog.title/>
    </title>
</b:if>

Jika kode html tersebut di terapkan, maka kode html diatas dapat dibaca seperti berikut :
"Jika kondisi data tipe halaman adalah sama dengan  halaman tipe item (Item Page Type),   maka struktur judul yang akan digunakan adalah data blog.pagename (Judul Posting) | data blog.title (Judul Blog) "

Artinya, jika Anda membuka halaman yang memiliki tipe item tersebut, maka judul (title) yang digunakan di setiap halaman item akan memiliki struktur judul seperti berikut

 Judul Postingan | Judul Blog

Dan untuk contoh hasilnya pada blog bisa Anda lihat melalui gambar dibawah.
Hasil format judul pada tipe halaman item



1. Tipe halaman  Item page type


Tipe halaman ini adalah tipe halaman yang paling umum  dikenali. Halaman yang saya yakin Anda sering kunjungi ketika sedang blogwalking.

Ya, Item page type ini tak lain adalah halaman postingan, halaman dengan konten berupa artikel, gambar, video, bahkan mungkin produk untuk dijual. Halaman posting blog disebut sebagai halaman tipe item karena nilai yang diberikan untuk tag pada pageTypenya adalah item.

Tipe halaman ini sangat berkaitan dengan waktu. Sehingga,  setiap halaman item yang selesai dibuat/ dipublish,  selalu memiliki kaitan dengan waktu pada saat halaman tersebut diciptakan. Hal ini bisa Anda lihat melalui link URL halaman posting yang akan selalu memiliki nilai waktu pada susunan url-nya. contohnya adalah sebagai berikut.

http://www.mengelolablog.com/2016/03/tips-membuat-navigasi-blog-yang-baik.html

Pada URL diatas, kita bisa melihat bahwa artikel tips membuat navigasi blog yang baik telah diterbitkan di situs mengelolablog.com pada tahun 2016 bulan ke-3 (maret). Tipe halaman item ini akan secara otomatis tercipta saat Anda mempublish sebuah konten terbaru yang dibuat pada menu new post di dashboard Blogspot.

Jadi, ketika Anda membuka halaman postingan pada sebuah blog, artinya Anda sedang berada di sebuah halaman dengan tipe Item pageType

Berikut adalah tag kondisional untuk  pageType yang digunakan pada halaman posting.
<b:if cond='data:blog.pageType == "item"'>
<!--Item Page-->
</b:if> 



2. Tipe halaman static_page


Tipe halaman static_page artinya adalah halaman statis.  Tipe halaman yang dapat berdiri sendiri tanpa terkait dengan waktu, hal inilah yang membedakan antara halaman statis dengan halaman item. Mari kita perhatikan susunan URL pada halaman statis


Untuk halaman statis, susunan URL halaman tidak mencantumkan waktu sebagaimana pada halaman item, melainkan menggunakan huruf p sebagai identifikasi yang akan menunjukkan bahwa halaman yang sedang dibuka tersebut bertipe statis.

Untuk penggunaannya secara umum, halaman statis sering dimanfaatkan untuk membuat halaman about, privacy policy, terms of service, dan lain sebagainya.

Halaman tipe statis ini dapat dibuat melalui sub menu New page pada menu Pages di dashboard Blogspot Anda.  Cara mengisi dan mempublish konten pada halaman tipe statis ini tidaklah jauh berbeda dengan pembuatan konten untuk postingan blog.

Berikut adalah tag kondisional untuk  pageType yang digunakan pada halaman statis.
<b:if cond='data:blog.pageType == "static_page"'>
<!--Static Page-->
</b:if>



3.Tipe halaman Index


Tipe halaman index merupakan tipe halaman yang menampilkan sejumlah daftar dan list posting (bisa linknya saja ataupun dengan penggalan kalimat di dalamnya).

Daftar dan list link yang ditampilkan dihalaman index ini biasanya disusun secara terurut berdasarkan waktu, dimana isi konten terbaru akan ditampilkan lebih dahulu kemudian diikuti isi konten yang lebih lama.

Berikut adalah tag kondisional untuk  pageType yang digunakan pada halaman index.
<b:if cond='data:blog.pageType == "index"'>
<!--index page-->
</b:if>

Beberapa contoh halaman index yang mudah untuk ditemukan adalah homepage, halaman label, halaman archive, dan halaman search query.

Namun, meskipun ke empat halaman tersebut (homepage, halaman label, halaman archive, dan halaman search query) masuk sebagai kategori halaman bertipe index, masing-masing memiliki format yang berbeda dalam penulisan pageType nya, berikut penjelasannya.

  • 3.1. Halaman Homepage
  • Homepage juga dikenal sebagai halaman beranda, sebuah halaman yang menjadi akar navigasi blog. Secara sederhana, homepage ini akan ditampilkan saat kita mengakses link dengan alamat domain utamanya saja. 

    Contohnya, ketika Anda mengunjungi blog saya, URL utamanya adalah http://www.mengelolablog.com/ . Maka secara otomatis Anda akan segera dibawa ke halaman Homepage  dari blog mengelolablog.com ini. 

    Untuk tipe halaman index dengan tujuan homepage, bentuk umum yang digunakan tidak lagi menggunakan pageType=="index" , namun akan tampak seperti berikut

     'data:blog.url==data:blog.homepageUrl' 

    Berikut adalah contoh tag kondisional untuk  pageType yang digunakan pada halaman Homepage. 
     <b:if cond='data:blog.url == data:blog.homepageUrl'> 
    <!--Homepage-->
     </b:if>

  • 3.2. Halaman Search Query
  • Halaman search query akan ditampilkan saat Anda menggunakan kotak  pencarian. Alamat URL yang digunakan untuk halaman tipe search query ini akan tampak seperti  contoh dibawah ini. 

    http://www.mengelolablog.com/search?q= 

    Seperti umumnya  halaman index, tipe halaman search query ini akan menampilkan hasil pencarian berdasarkan kata kunci yang diketikkan pada kotak pencarian dengan urutan konten terbaru lebih dahulu, kemudian diikuti dengan konten sebelumnya. 

    Halaman search query ini biasanya sudah ada didalam blog blogger secara otomatis, Anda hanya tinggal menambahkan gadget pencarian melalui menu layout > add a gadget>pilih widget search box di dashboard Blogspot Anda. 

    Bentuk tag tipe halaman Search query adalah sebagai berikut 
    <b:if cond='data:blog.searchQuery'>
     <!--Search Page--> 
    </b:if>

  • 3.3. Halaman Label
  • Halaman label ini bisa ditemukan dengan menambahkan  gadget label pada add widget di menu layout, atau Anda dapat menambahkannya secara manual link label setelah mengetahui alamat url label / kategori yang akan digunakan di blog Anda. 

    Ketika Anda mengakses halaman label, maka didalam halaman label tersebut akan menampilkan daftar list konten berdasarkan kategori label yang disematkan pada konten tersebut. 

    Susunan daftar list pada halaman tipe label ini tetap sama dengan halaman tipe search query yaitu diurut berdasarkan waktu, dimana konten terbaru selalu tampil lebih dulu. 
    Alamat URL yang digunakan untuk menampilkan halaman label akan nampak seperti ini 


    URL diatas akan menuju ke halaman label dengan kategori blogging di blog mengelolablog.com ini.  Sedangkan bentuk tag tipe halaman Label adalah sebagai berikut 
    <b:if cond='data:blog.searchLabel'> 
    <!--Label Page--> 
    </b:if>

  • 3.4. Halaman Archive
  • Seperti halaman search query dan label, halaman archive ini bisa diakses dengan menambahkan gadget archive melalui add a gadget pada menu layout di dashbard Blogspot Anda. 

    Bentuk URL halaman archive ini akan tampak seperti berikut 

    http://www.mengelolablog.com/2016_03_01_archive.html 

    URL diatas akan menuju ke halaman archive blog di mengelolablog.com untuk artikel yang telah diterbitkan pada tahun 2016 bulan maret. 

    Sedangkan untuk  tag konditional halaman tipe archive ini akan terlihat seperti berikut 
    <b:if cond='data:blog.pageType == "archive"'> 
    <!--Archive Page--> 
    </b:if>



4. Tipe Halaman error page


Pengguna, terkadang menemukan link tautan yang sudah dihapus ataupun salah dalam mengetik url tujuan. Hal ini akan menyebabkan pengguna tidak menemukan halaman yang mereka cari.

Biasanya setiap terjadi kesalahan tersebut, blog akan menampilkan halaman error page dengan kode 404. Dengan begitu, maka pengunjung akan mengetahui bahwa halaman yang mereka cari tidak dapat ditemukan.

Untuk menyetting halaman error page yang lebih baik demi kenyamanan pengunjung, Anda dapat melakukannya pada menu setting > Search preferences >Error and redirections kemudian edit pada bagian Custom Page Not Found.

Bentuk umum untuk tag tipe halaman error ini adalah seperti berikut
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<title>Page not found</title>
</b:if>


Kesimpulan.


Tipe halaman yang ada dan bisa digunakan pada blog Blogspot berjumlah 8 tipe halaman, yaitu 4 tipe halaman utama dan 4 tipe halaman index dengan jenis yang berbeda.

Sesuai dengan manfaat yang sudah dijelaskan pada artikel ini, maka untuk mendesain sebuah template blog,  tentu bisa lebih mudah untuk diterapkan jika kita memahami tipe-tipe halaman yang ada pada blog Blogspot (digunakan bersamaan dengan tag kondisional).

Sehingga kita bisa memberikan variasi pada tampilan halaman sesuai dengan widget yang kita butuhkan. Demikianlah artikel tentang tipe halaman blog di Blogspot  ini saya informasikan, semoga bermanfaat.

9 comments:

  1. Wah bermanfaat Banget aku baru 2 minggu belajar hampir 1 bulan ngeblog masih banyak memerlukan referensi

    ReplyDelete
    Replies
    1. Semoga bisa membantu gan, thanks sudah berkunjung ya.

      Delete
  2. wah manfaat banget nih bang. terima kasih atas infonya.

    ReplyDelete
  3. Terima kasih banyak mas, materinya lengkap banget.

    ReplyDelete
    Replies
    1. Sama sama gan, thanks dah berkomentar n semoga bisa bermanfaat. :)

      Delete
  4. Nah ini yg di cari sebuah pemahamannya dan cara menggunakan, klo else atau include apa bang??.. tutor ngebuat template blog dong bang dari awal sampe jadi dan dijelaskan setiap kodenya seperti di atas, bingung klo liat di blog lain, kode nongol tapi ga dijelasin apa" suruh kopy aja.

    ReplyDelete
    Replies
    1. Untuk tutor buat template dari awal hingga jadi saat ini rasanya belum bisa saya gan, ada beberapa hal yang saya juga masih perlu belajar.

      Untuk pemahaman kode memang agak panjang gan soalnya terkadang penyampaian yang kita sampaikan belum tentu bisa diterima dengan baik. lagi pula Saat ini saya baru bisa sebatas memodifikasi template saja.

      Untuk fungsi else biasanya digunakan untuk memilih pilihan jika fungsi if tidak memenuhi syarat , contohnya
      "Jika (if) halaman yang dibuka adalah halaman A maka hasilnya gambar gajah, (else) selain halaman A maka hasilnya gambar kelinci"

      Sedangkan untuk fungsi Include, digunakan untuk mengikutsertakan sebuah kondisi yang sudah ada ( contoh kondisi B) pada kondisi yang sedang terjadi (kondisi A).
      Misalnya;
      "Halaman yang dibuka adalah A, (include) sertakan gambar gajah kedalam halaman A"

      Delete
  5. Sesuai dengan alamat blognya, https://www.mengelolablog.com/
    Keep blogging gan...

    ReplyDelete