Cara Membuat Layar Grid Posting Thumbnail di Tema WordPress
Saat membuat tata letak situs WordPress, apakah Anda pernah memiliki kebutuhan untuk membuat kisi pos? Tata letak kisi berfungsi dengan baik untuk situs yang berfokus pada media seperti galeri WordPress kami atau situs jenis etalase lainnya. Kerangka tema seperti Genesis sudah memiliki sistem Grid Loop bawaan. Namun, jika Anda mencoba menampilkan kisi di tema WordPress kustom Anda, maka kami di sini untuk membantu. Pada artikel ini, kami akan menunjukkan kepada Anda cara membuat tampilan loop grid thumbnail di tema WordPress Anda.
Catatan: Anda harus memiliki pemahaman yang adil tentang CSS dan cara kerja loop WordPress.
Sebelum kita mulai, mari kita lihat apa yang ingin kita capai:
Jika Anda perhatikan, posting di halaman ini ditampilkan dalam kotak. Ada pembatas pada tiang di sisi kiri, tapi tidak di sisi kanan. Dengan loop posting normal semua posting mengikuti gaya yang sama sehingga Anda akan memiliki batas kanan pada kedua posting yang akan terlihat aneh. Perhatikan juga bahwa ruangnya cukup simetris. Yang lagi-lagi tidak mungkin dengan loop normal untuk melakukan sesuatu seperti ini. Sekarang Anda dapat melihat apa yang ingin kami capai, mari kita lihat bagaimana mencapainya.
Hal pertama yang harus dilakukan adalah memastikan tema Anda memiliki thumbnail untuk posting WordPress yang diaktifkan. Anda juga harus memikirkan bagaimana Anda ingin mengubah ukuran gambar WordPress Anda karena Anda akan membutuhkannya.
Setelah Anda mengatur thumbnail dan ukuran, mari kita mulai dengan ini. Kami akan mengonfigurasi kueri berulang kami:
