Cara Menyembunyikan Kolom Footer Artikel Yang Terdapat Pada Halaman Statis Blog

Sobat Blogger, dalam kondisi tertentu adakalanya kita memang tidak perlu menampilkan elemen tertentu dari halaman blog yang kita kelola apabila bagian yang dimaksud memang dirasa tidak perlu untuk ditampilkan. Sebagai contoh dari elemen atau bagian tersebut misalnya adalah post footer yang secara default akan selalu ditampilkan di bawah setiap artikel yang diterbitkan. Sementara itu post footer yang dimaksud di sini adalah salah satu kolom dalam halaman blog yang biasanya pada bagian ini menampilkan beberapa widget tertentu, diantaranya adalah widget berbagi, reaksi, tautan untuk membuat link artikel, jumlah komentar serta beberapa widget lainnnya (seperti yang tampak pada gambar di atas).

Nah, apabila berbicara mengenai cara menyembunyikan elemen atau bagian tertentu yang terdapat pada blog, maka sekaligus untuk menanggapi salah satu pertanyaan yang diajukan dalam artikel tanya jawab mengenai cara menyembunyikan elemen tertentu yang terdapat pada halaman posting (dalam hal ini misalnya seperti yang dapat dilihat di halaman statis untuk daftar isi), berikut ini adalah uraian teknik yang dapat digunakan untuk mengerjakannya.

Namun karena teknik ini tergolong agak rumit, maka sebelum mengerjakannya sangat disarankan agar Anda melakukan backup pada template terlebih dulu guna mengantisipasi adanya kesalahan pengerjaan yang mengakibatkan template menjadi error. Dan akan lebih baik lagi bila Anda mencoba menerapkannya pada blog atau template uji coba terlebih dulu, baru kemudian menerapkannya pada blog yang Anda kelola jika sudah benar-benar yakin dengan hasil yang didapatkan.

Selanjutnya bila hal tersebut telah dilakukan, maka untuk mengerjakannya Anda dapat melakukannya dengan cara menerapkan langkah-langkah berikut ini secara berurutan.

Pertama, buka editor template dengan cara mengeklik menu ‘Template’ > ‘Edit HTML’ > ‘Lanjutkan’ > ‘Expand Template Widget’.

Kedua, cari <div class='post-footer'> dan kemudian tambahkan atau sisipkan beberapa kode yang diberi keterangan dengan huruf kapital seperti yang tampak dalam rangkaian kode di bawah ini sesuai dengan keperluan.

Menyembunyikan post footer yang terdapat dalam semua halaman statis versi web.

<b:includable id='post' var='post'>
  <div class='post hentry'...> <!-- dan seterusnya -->
  
    <!-- rangkaian kode bawaan template -->
    
    <!—TAMBAHKAN KODE BERIKUT INI -->
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
    <b:else/> <!-- SAMPAI DENGAN KODE INI -->
    
      <div class='post-footer'>
      
        <!-- rangkaian kode bawaan template -->
        
      </div>
      
    </b:if> <!-- TAMBAHKAN KODE INI UNTUK MENUTUP FUNGSI IF SEBELUMNYA -->
    
  </div>
</b:includable>

Keterangan:

Karena teknik tersebut akan mengakibatkan hilangnya post footer yang terdapat dalam semua halaman statis, jika Anda hanya ingin menyembunyikan post footer dari halaman statis versi web tertentu saja, maka gunakan teknik yang terdapat dalam script di bawah ini.

Menyembunyikan post footer dari sebuah halaman statis versi web tertentu.

<b:includable id='post' var='post'>
  <div class='post hentry'...> <!-- dan seterusnya -->
  
    <!-- rangkaian kode bawaan template -->
  
    <!-- TAMBAHKAN KODE BERIKUT INI -->
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
      <b:if cond='data:post.url == &quot;http://eltelu.blogspot.com/p/sitemap.html&quot;'>
      <b:else/> <!-- SAMPAI DENGAN KODE INI -->
      
        <div class='post-footer'>
        
        <!-- rangkaian kode bawaan template -->
        
        </div>
        
      </b:if> <!-- TAMBAHKAN KODE INI UNTUK MENUTUP FUNGSI IF SEBELUMNYA -->
    </b:if> <!-- TAMBAHKAN KODE INI UNTUK MENUTUP FUNGSI IF SEBELUMNYA -->
    
  </div>
</b:includable>

Keterangan:

Penggunaan teknik seperti dalam contoh script tersebut akan mengakibatkan hilangnya post footer yang terdapat dalam halaman daftar isi saja. Sehingga jika Anda ingin menggunakan teknik ini maka silakan ganti terlebih dulu http://eltelu.blogspot.com/p/sitemap.html dengan URL halaman statis yang post footer-nya ingin disembunyikan.

Dan selanjutnya karena penggunaan salah satu dari kedua rangkaian script di atas hanya akan berdampak pada halaman statis versi web saja, maka jika ingin menyembunyikan elemen tertentu yang terdapat dalam halaman statis versi seluler, Anda dapat dapat mengerjakan dan atau menggunakan salah satu script seperti dalam contoh di bawah ini.

Menyembunyikan post footer yang terdapat dalam semua halaman statis versi seluler.

<b:includable id='mobile-post' var='post'>
  <div class='date-outer'>
  
    <!-- rangkaian kode bawaan template -->
  
    <div class='date-posts'>
      <div class='post-outer'>

        <div class='post hentry ...> <!-- dan seterusnya -->
  
          <!-- rangkaian kode bawaan template -->
  
          <div class='post-header'>
            <div class='post-header-line-1'/>
          </div>

          <div class='post-body entry-content' ...> <!-- dan seterusnya -->
            <data:post.body/>
            <div style='clear: both;'/> <!-- clear for photos floats -->
          </div>
          
          <!—TAMBAHKAN KODE BERIKUT INI -->
          <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
          <b:else/> <!-- SAMPAI DENGAN KODE INI -->

            <div class='post-footer'>
              <div class='post-footer-line post-footer-line-1'>
  
                <!-- rangkaian kode bawaan template -->
  
              </div>

              <div class='post-footer-line post-footer-line-2'>
  
                <!-- rangkaian kode bawaan template -->
  
              </div>

            </div>
          </b:if> <!-- TAMBAHKAN KODE INI UNTUK MENUTUP FUNGSI IF SEBELUMNYA -->
        </div>

        <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  
          <!-- rangkaian kode bawaan template -->
  
        </b:if>
      </div>
    </div>
  </div>
</b:includable>

Keterangan:

Karena teknik tersebut akan mengakibatkan hilangnya post footer yang terdapat dalam semua halaman statis tampilan versi seluler, jika Anda hanya ingin menyembunyikan post footer dari halaman statis versi seluler tertentu saja, maka gunakan teknik yang terdapat dalam script di bawah ini.

Menyembunyikan post footer dari sebuah halaman statis versi seluler tertentu.

<b:includable id='mobile-post' var='post'>
  <div class='date-outer'>
  
    <!-- rangkaian kode bawaan template -->
  
    <div class='date-posts'>
      <div class='post-outer'>

        <div class='post hentry ...> <!-- dan seterusnya -->
  
          <!-- rangkaian kode bawaan template -->
  
          <div class='post-header'>
            <div class='post-header-line-1'/>
          </div>

          <div class='post-body entry-content' ...> <!-- dan seterusnya -->
            <data:post.body/>
            <div style='clear: both;'/> <!-- clear for photos floats -->
          </div>
          
          <!-- TAMBAHKAN KODE BERIKUT INI -->
          <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
            <b:if cond='data:post.url == &quot;http://eltelu.blogspot.com/p/sitemap.html?m=1&quot;'>
            <b:else/> <!-- SAMPAI DENGAN KODE INI -->

               div class='post-footer'>
                <div class='post-footer-line post-footer-line-1'>
  
                  <!-- rangkaian kode bawaan template -->
  
                </div>

                <div class='post-footer-line post-footer-line-2'>
  
                  <!-- rangkaian kode bawaan template -->
  
                </div>

              </div>
            </b:if> <!-- TAMBAHKAN KODE INI UNTUK MENUTUP FUNGSI IF SEBELUMNYA -->
          </b:if> <!-- TAMBAHKAN KODE INI UNTUK MENUTUP FUNGSI IF SEBELUMNYA -->
        </div>

        <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  
          <!-- rangkaian kode bawaan template -->
  
        </b:if>
      </div>
    </div>
  </div>
</b:includable>

Keterangan:

Penggunaan teknik seperti dalam contoh script tersebut akan mengakibatkan hilangnya post footer yang terdapat dalam halaman daftar isi untuk tampilan versi seluler saja. Sehingga jika Anda ingin menggunakan teknik ini maka silakan ganti terlebih dulu http://eltelu.blogspot.com/p/sitemap.html?m=1 dengan URL halaman statis versi seluler yang post footer-nya ingin disembunyikan. Dan perlu diingat bahwa penulisan URL untuk halaman versi seluler harus ditambah dengan ?m=1 di bagian belakang.

Ketiga, setelah Anda menerapkan salah satu dari beberapa teknik yang terdapat dalam rangkaian script di atas, maka lakukan preview atau pratinjau halaman terlebih dulu. Jika muncul pesan kesalahan atau error saat dilakukan pratinjau halaman, maka dapat disimpulkan bahwa terdapat kekeliruan dalam penyisipan script. Sehingga pastikan bahwa tidak terdapat error atau kekeliruan, baru kemudian simpan template Anda.

Silakan klik di sini untuk melihat demo hasil penerapan teknik tersebut.

Semoga berguna serta bermanfaat. Dan apabila Anda mengalami kesulitan ketika mengimplementasikan teknik yang diuraikan dalam artikel ini, maka silakan ajukan pertanyaan mengenai kesulitan yang Anda alami dengan cara mengeposkan komentar dalam artikel ini, karena dengan senang hati saya akan membantu memberikan solusi sebatas kemampuan yang saya miliki.

Salam.