Cara Membuat Tampilan Layout Grid di WordPress dengan Plugin Post Grid – Desain web dari tahun ke tahun selalu berubah, hal tersebut dikarenakan mengikuti tren dan kebutuhan. Sejak perangkat ponsel pintar atau smartphone mulai banyak digunakan, akses internet jauh lebih mudah hanya melalui genggaman dan bisa dilakukan melalui berbagai macam perangkat dengan ukuran layar yang berbeda-beda. Hal tersebut menjadikan lalu lintas web sebagian besar di akses melalui smartphone, bahkan sampai saat ini 30% lebih dari semua lalu lintas di web berasal dari perangkat smartphone.

Dengan mengetahui data tersebut, menjadikan kita sebagai pemilik website dan pengembang web harus ikut berubah mengikuti tren tersebut jika ingin tetap bersaing dan menampilkan web menjadi lebih user friendly terhadap pengguna smartphone. Saat ini banyak sekali website sudah mendukung tampilan responsive. Jika Anda pengguna WordPress akan sangat mudah untuk menemukan tema WordPress yang sudah mendukung responsive di library tema WordPress.org maupun pengembang tema pihak ketiga.

Seiring dengan berjalannya desain responsive juga muncul desain baru yang bertujuan untuk lebih memaksimalkan tampilan konten di smartphone yaitu layout dengan desain Grid. Tapi tidak semua tema WordPress mendukung tampilan jenis grid ini, ada sebagian tema yang sudah menerapkan layout grid dan ada yang belum. Tampilan dengan layout grid akan memberikan efek yang sangat bagus jika diterapkan pada website Anda dan ini akan sangat cocok untuk pengguna smartphone dan juga tetap tampil indah untuk pengguna desktop.

Jika Anda melihat blog centerklik ini, pada bagian homepage masih belum menggunakan tampilan dengan layout grid, tapi Anda akan menemukan halaman khusus untuk direktori tema WordPress ditampilkan dengan layout Grid. Anda bisa melihatnya disini ⇒ Centerklik Themes atau lihat gambar dibawah ini.

Saya membuat tampilan grid pada halaman tersebut agar terlihat lebih menarik untuk menampilkan berbagai macam tema WordPress dan itu dibuat dengan kustom secara manual yang membutuhkan pengetahuan coding. Tapi Anda bisa membuat halaman dengan layout semacam itu dengan sangat mudah menggunakan plugin bernama “Post Grid” dan bahkan bisa membuat layout grid yang jauh lebih bagus dari itu.

Baca : Cara Menjadikan Website WordPress Anda Mendukung Google AMP

Apa itu Post Grid?

Post Grid adalah plugin WordPress buatan Pick Plugin yang berfungsi untuk membuat tampilan layout grid yang indah dari postingan, jenis postingan kustom dan halaman. Anda bisa menampilkan layout grid di mana saja menggunakan shortcode. Post Grid dapat ditampilkan di halaman archive secara dinamis yang diambil dari kategori, tag, halaman taksonomi & kustom taksonomi, author, pencarian, tanggal dan sebagainya. Plugin post grid ini memiliki tata letak pre-build yang memungkinkan Anda membuat sendiri tampilan grid yang indah secara instan.

Dengan memiliki konten ditampilkan dengan layout grid ini, konten Anda akan terlihat lebih sempurna di perangkat smartphone dan layout grid akan lebih menonjolkan gambar sehingga konten Anda tampil lebih menarik. Selain itu dengan layout grid juga akan lebih menghemat ruang sehingga Anda bisa menampilkan lebih banyak konten.

Harga Post Grid

Plugin Post Grid adalah plugin gratis yang bisa Anda download langsung dari library plugin WordPress.org, dan plugin gratis ini sudah cukup untuk membantu Anda untuk menciptakan layout grid dengan indah di situs WordPress Anda. Tapi jika Anda ingin mendapatkan fitur yang lebih banyak lagi, plugin ini juga memiliki versi premium dengan harga sangat terjangkau yaitu :

• 1 Domain License ⇒ $29
• 10 Domain License ⇒ $99
• 100 Domain License ⇒ $199

Dengan plugin Post Grid versi Pro, Anda akan lebih banyak mendapatkan fitur-fitur yang menakjubkan sehingga Anda bisa menampilan grid dengan berbagai macam animasi yang keren.

Buy Post Grid

Fitur-Fitur Unggulan Post Grid

Post Grid selain bisa membuat tampilan grid dari berbagai jenis konten dari default WordPress, plugin ini juga mendukung untuk menampilkan data dari plugin pihak ke-3 seperti WooCommerce, EDD, WP eCommerce Product display dan tampilan post ratting via Rating-Widget, dan Query post berdasarkan meta query yang muncul dari Advanced Custom Fields.

Selain itu Post Grid juga bisa menampilkan posting jenis grid dari berbagai macam query post. Dan Anda juga menampilkan berbagai macam media pada pada thumbnail seperti dari YouTube, vimeo, dailymotion, soundcloud, mp3, gallery, font awesome dan juga kustom link pada gambar thumbnail.

Dan dibawah ini adalah rincian dari fitur-fitur plugin Post Grid :

• Fully responsive and mobile ready.
• Unlimited grid anywhere.
• Query any post type.
• Query from multiple post type.
• Skin & Layout based.
• Pagination support.
• Custom number grid post per page.
• Social share buttons.
• Custom grid width.
• Custom grid thumbnail height.
• 29+ ready skin. (Pro)
• Query post by taxonomy(multiple) & terms(multiple). (Pro)
• Support for WooCommerce, Easy Digital Downloads, WP eCommerce. (Pro)
• Display Meta Fields. Custom wrapper (HTML) for meta values display. (Pro)
• Display Short-code via Meta Fields. (Pro)
• Display YouTube, vimeo video, soundcloud, mp3, gallery, Font Awesome icons on thumbnail area. (Pro)
• Filterable Grid by custom taxonomy & terms. (Pro)
• Ajax load more. (Pro)
• Extend grid skin by filter hook. (Pro)
• Pagination custom Next , Previous text. (Pro)
• Add custom HTML(Shortcodes) via layout editor. (Pro)
• Create unlimited layout via layout editor. (Pro)
• Post grid for Archive page(category.php, tags.php , custom taxonomy & terms page). (Pro)
• Extra query parameter. (Pro)
• Create unlimited layout via layout editor. (Pro)
• Add custom HTML(Shortcodes) via layout editor. (Pro)
• Dan masih banyak lagi fitur keren lainnya.

Itulah beberapa fitur-fitur unggulan yang dibawa oleh plugin Post Grid yang bisa Anda dapatkan. Anda bisa melihat demo berbagai macam tampilan layout grid yang dihasilkan oleh plugin post grid dengan berbagai animasi yang keren secara lengkap disini ⇒ Post Grid Demo.

Baca : Cara Mudah Membuat Mega Menu di WordPress Dengan QuadMenu

Cara Membuat Layout Grid di WordPress dengan Post Grid

Untuk memulai, hal pertama yang perlu Anda lakukan adalah menginstal dan mengaktifkan plugin Post Grid. Untuk lebih jelasnya, lihat panduan langkah demi langkah tentang cara menginstall plugin WordPress.

Setelah plugin Anda aktifkan, Anda akan melihat item menu baru ditambahkan dengan nama “Post Grid”. Silahkan masuk pada Post Grid »New Post Grid, karena tidak ada hal yang perlu Anda konfigurasi pada halaman Settings. Setelah Anda membuka Newe Post Grid, Anda akan melihat kolom Title dan beberapa menu tab dibawahnya. Silahkan untuk mengisi judul pada kolom “Title” Sesuai dengan keinginan Anda.

Selanjutnya silahkan untuk masuk pada bagian menu tab “Query Post”, dimana bagian ini adalah untuk mengambil jenis posting apa yang ingin Anda tampilkan dalam bentuk layout grid. Secara default, ini akan menampilkan “Post” tapi Anda dapat memilih mengambil dari “Page” atau memilih jenis posting khusus.

Selanjutnya anda perlu klik pada menu tab “Layout”. Di sinilah Anda dapat memilih bagaimana Anda ingin menampilkan layout grid Anda. Plugin ini dilengkapi dengan beberapa pilihan seperti flat, flat centre, flat right, dll. Anda juga bisa mengklik tombol “Edit” dan itu akan membuka “Layout Editor” dimana Anda dapat membuat layout grid sesuai dengan keinginan Anda sendiri.

Plugin ini secara default sudah menyediakan 5 skin. Beberapa skin memiliki efek visual yang keren dengan animasi membalik atau memutar gambar saat pengguna mengarahkan mouse ke arah gambar thumbnail.

Jika Anda sudah selesai, sekarang Anda bisa berpindah ke menu tab “Layout Settings”. Terdapat banyak hal bisa Anda lakukan disini untuk menyesuaikan layout grid Anda seperti pilihan untuk mengaktifkan style mansory, lazy load, lebar dan tinggi item grid, background dan masih banyak lagi.

Selanjutnya Anda bisa berpindah ke menu tab “Navigations” dimana Anda dapat menyesuaikan style navigasi yang tersedia dan mengaktifkan fitur pencarian. Dan jika Anda memiliki kemampuan dalam coding JS dan CSS juga bisa menambahkan kode pada menu tab “Custom Script”.

Dan sekarang pembuatan layout grid sudah selesai, cukup klik pada tombol publish. Ini akan membuat grid posting Anda tersedia, dan Anda dapat menambahkannya ke halaman di mana Anda ingin menampilkan post grid.

Caranya, silahkan copy shortcode yang terdapat pada menu tab “Shortcodes”. Silahkan buat halaman baru atau edit halaman yang sudah ada untuk menampilkan grid pos Anda. Paste shortcode tersebut di dalam area konten di area yang Anda inginkan untuk menampilkan grid.

Selanjutnya, simpan halaman Anda dengan mengklik tombol update. Sekarang Anda dapat mengunjungi situs web Anda untuk melihat postingan Anda ditampilkan dalam layout grid yang indah.

Anda juga bisa menggunakan kode PHP jika ingin menambahkan post grid langsung ke file tema WordPress Anda.

Baca : Smart Footer System – Ubah Tampilan Footer WordPress Menjadi Lebih Keren

Dan itulah ulasan lengkap tentang plugin Post Grid, semoga artikel ini bermanfaat dan menjadikan solusi cepat dalam membuat tampilan grid pada situs WordPress Anda. Selamat mencoba 🙂

Anda Terbantu artikel ini? Silahkan bergabung dengan centerklik di Twitter dan Facebook+.

Daftar isi Tutorial WordPress Terlengkap Gratis