Dalam tutorial WordPress kali ini, kita akan membuat Sticky Sidebar di Tema Astra WordPress tanpa menggunakan plugin.
Juga dalam hal ini, kita akan mencoba menggunakan plugin untuk membuat Sticky Sidebar .
Di sini, Sobat dapat membuat sticky sidebar kiri atau kanan dengan kode sederhana atau metode plugin.
Untuk plugin, kita akan menggunakan Q2W3 Fixed Widget for WordPress oleh Tim Thomas Maier, Max Bond.
Dan untuk metode lain, kita akan menggunakan kode CSS hanya melalui Customizer. Sobat hanya perlu menyalin & menempelkan kode tersebut.
Sidebar Sticky di Tema Astra tanpa plugin
Jika Sobat menggunakan Astra WordPress Theme versi gratis atau pro maka metode ini akan berhasil. Atau Sobat juga bisa mendapatkan Astra Pro murah di Jasa Instal Astra Pro Lifetime
Ini adalah salah satu metode sederhana & termudah untuk membuat sticky widget di Tema Astra.
Pada dasarnya, Sobat dapat menggunakan widget terakhir untuk tujuan yang berbeda. Nanti kita akan belajar tentang penggunaan widget terakhir di sidebar.
Pertama, mari kita pergi ke proses secara detail.
- Buka Dashboard > Plugins > Add New.
- Sekarang, Pergi ke CSS Tambahan.
- Copy & Paste kode CSS di bawah ini.
- Terakhir, tekan tombol Publikasikan.
- Sekarang, Anda akan dapat melihat widget terakhir yang lengket di Tema Astra
@media (min-width: 769px) {
.ast-container {
display: flex;
}
.sidebar-main {
height: 100%;
}
.sidebar-main aside:last-child {
position: -webkit-sticky;
position: sticky;
top: 50px;
}
}Aku telah menguji kode untuk sidebar kiri dan sidebar kanan di Astra.
Selain itu, menggunakan kueri media @media (lebar minimum: 769px), kami telah mengaktifkan kode di layar dengan lebih dari 769 piksel. Yaitu jika ukuran layar lebih dari 769 px, kode hanya akan berfungsi.
Jadikan Sidebar Sticky di Tema Astra menggunakan Plugin
Aku sedang menguji versi terbaru dari versi Widget Q2W3 dari plugin yang kompatibel dengan Editor Blok. Versi lama plugin ini hanya berfungsi dengan Editor Klasik.
Proses versi Editor blok agak berbeda dari pada Editor Klasik. jadi mari kita lakukan di Tema Astra, Sobat dapat menggunakan metode ini dengan tema lainnya.
Plugin ini menggunakan jQuery jadi jika Anda tidak ingin menambahkan permintaan tambahan ke situs Anda, Anda dapat menggunakan solusi CSS.
- Pertama, Buka Dasbor > Plugin > Tambah Baru
- Cari Q2W3 Fixed Widget for WordPress
- Instal dan Aktifkan.
- Sekarang kunjungi frontend, dan periksa widget terakhir dari sidebar & salin ID widget> (Ikuti Screenshot di bawah).
- Buka Appearance > Fixed Widget Options
- Tempelkan ID bilah sisi atau nama Kelas ke dalam kotak Custom Fixed Elements.
- Tekan Save Changes.
Kasus Penggunaan Sticky Widget di WordPress
Dengan banyak kasus penggunaan sticky widget di bilah sisi, Aku akan membuat daftar beberapa manfaatnya.
Sobat dapat mempromosikan banner afiliasi di sidebar dengan membuatnya Sticky.
Sobat dapat mempromosikan tools yang Sobat gunakan seperti yang saya rekomendasikan kepada pengunjung.
Jika Sobat ingin mengumpulkan email maka Anda cukup membuat kotak pelanggan lengket (sticky) dengan bantuan kode di atas.
Sobat juga dapat menampilkan posting unggulan atau posting populer untuk meningkatkan klik dengan memperbaikinya di bilah sisi.
Karena ada manfaat tak terbatas dari membuat perbaikan, Anda dapat mencobanya dan beri tahu saya apa yang Anda promosikan.
Hasil akhir
Ini adalah keseluruhan proses untuk membuat sticky sidebar di Tema Astra, kode di atas adalah untuk membuat sticky widget terakhir di Tema WPAstra.
Kode di atas berfungsi jika Anda menggunakan sidebar atau sidebar kanan di Tema Astra. Semoga bermanfaat
