Cara Mengonfigurasi Custom Widget Post

Ishar Yulian Satriani

March 02, 2023

Updated: May 22, 2023

Vulia Theme kini telah menambahkan fitur baru Custom Widget Post dengan 4 posisi berbeda dan 2 pilihan style Grid dan Carousel.

Table of Contents

Fitur ini hanya aktif di widget tertentu, berikut widget yang dapat diaktifkan:

Custom Widget Post 1
Custom Widget Post 2
Custom Widget Post 3
Custom Widget Post 4

Custom Widget Post Style Grid

Masuk ke Dashboard Blogger > pilih menu Tata Letak.
Cari bagian yang berjudul Custom Widget Post 1, Custom Widget Post 2, Custom Widget Post 3, dan Custom Widget Post 4.
Klik tombol edit (ikon pensil) di (Gadget HTML/JavaScript).
Akan muncul pop up konfigurasi Widget.
Pada kolom Judul, isikan sesuai nama label.

Pada kolom Konten isikan kode di bawah ini:

<div class='cwg' data-label='NAMA LABEL'>
  <ul class="skeleton_loading">
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_label"></div>
      <div class="skeleton_loading_title"><div></div><div></div></div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_label"></div>
      <div class="skeleton_loading_title"><div></div><div></div></div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_label"></div>
      <div class="skeleton_loading_title"><div></div><div></div></div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_label"></div>
      <div class="skeleton_loading_title"><div></div><div></div></div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_label"></div>
      <div class="skeleton_loading_title"><div></div><div></div></div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_label"></div>
      <div class="skeleton_loading_title"><div></div><div></div></div>
    </li>
  </ul>
</div>

Pada bagian NAMA LABEL ganti dengan nama label huruf besar kecilnya harus sama.

Setelah semuanya dikonfigurasi, klik tombol SIMPAN di bagian bawah.
Selesai

Custom Widget Post Style Carousel

Masuk ke Dashboard Blogger > pilih menu Tata Letak.
Cari bagian yang berjudul Custom Widget Post 1, Custom Widget Post 2, Custom Widget Post 3, dan Custom Widget Post 4.
Klik tombol edit (ikon pensil) di (Gadget HTML/JavaScript).
Akan muncul pop up konfigurasi Widget.
Pada kolom Judul, isikan sesuai nama label.

Pada kolom Konten isikan kode di bawah ini:

<div class='cwg c' data-label='NAMA LABEL'>
  <ul class="skeleton_loading">
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_post_bottom">
        <div class="skeleton_loading_label"></div>
        <div class="skeleton_loading_title">
          <div></div>
          <div></div>
        </div>
      </div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_post_bottom">
        <div class="skeleton_loading_label"></div>
        <div class="skeleton_loading_title">
          <div></div>
          <div></div>
        </div>
      </div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_post_bottom">
        <div class="skeleton_loading_label"></div>
        <div class="skeleton_loading_title">
          <div></div>
          <div></div>
        </div>
      </div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_post_bottom">
        <div class="skeleton_loading_label"></div>
        <div class="skeleton_loading_title">
          <div></div>
          <div></div>
        </div>
      </div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_post_bottom">
        <div class="skeleton_loading_label"></div>
        <div class="skeleton_loading_title">
          <div></div>
          <div></div>
        </div>
      </div>
    </li>
    <li>
      <div class="skeleton_loading_thumb"></div>
      <div class="skeleton_loading_post_bottom">
        <div class="skeleton_loading_label"></div>
        <div class="skeleton_loading_title">
          <div></div>
          <div></div>
        </div>
      </div>
    </li>
  </ul>
</div>

Pada bagian NAMA LABEL ganti dengan nama label huruf besar kecilnya harus sama.

Setelah semuanya dikonfigurasi, klik tombol SIMPAN di bagian bawah.
Selesai

Jika Anda ingin melaporkan beberapa bug, Anda dapat menuliskannya di bagian komentar pada halaman Bug Report dan jika Anda ingin meminta fitur baru atau ingin memberikan umpan balik, silakan tuliskan di bagian komentar pada halaman Request dan Feedback.