Pengertian Widget WordPress dan Cara Membuatnya

Tags: php | wordpress

Last updated Mar 27, 2023

Tutorial Membuat Custom Post Type Wordpress

Apa itu Widget WordPress?

Widget WordPress adalah elemen kecil yang dapat ditambahkan ke bagian sidebar atau footer halaman situs WordPress. Widget digunakan untuk menambahkan fitur dan konten ke halaman situs Anda, seperti menu navigasi, kotak pencarian, daftar posting terbaru, daftar kategori, dan banyak lagi. Anda dapat menyesuaikan tampilan widget dan menambahkan konten ke dalamnya melalui menu “Appearance” dan “Widgets” pada dashboard WordPress. Widget juga dapat ditambahkan melalui kode dengan menggunakan fungsi register_sidebar pada file functions.php theme Anda. Dengan menggunakan widget, Anda dapat memperkaya konten dan fungsionalitas halaman situs Anda tanpa perlu menulis kode secara manual.

Kapan Menggunakan Widget?

Widget WordPress digunakan untuk menambahkan fitur dan konten ke halaman situs Anda tanpa perlu menulis kode secara manual. Anda dapat menggunakan widget untuk:

  1. Menambahkan navigasi situs yang mudah diakses ke halaman Anda.
  2. Menampilkan daftar posting terbaru atau posting populer pada halaman sidebar atau footer.
  3. Menampilkan widget pencarian di halaman situs Anda.
  4. Menampilkan daftar kategori atau tag untuk membantu pengunjung menemukan konten yang mereka cari.
  5. Menampilkan konten yang disematkan, seperti video YouTube atau posting Instagram.
  6. Menampilkan kotak email newsletter untuk mengumpulkan email dari pengunjung.
  7. Menampilkan kalender acara untuk membuat pengunjung mengetahui jadwal acara yang akan datang.

Anda dapat menyesuaikan tampilan dan lokasi widget pada situs WordPress Anda dengan mudah, dan juga dapat menambahkan widget melalui kode dengan menggunakan fungsi register_sidebar pada file functions.php theme WordPress Anda. Dengan menggunakan widget, Anda dapat memperkaya konten dan fungsionalitas halaman situs Anda dan membuat situs Anda lebih menarik bagi pengunjung.

Cara Membuat Widget

Anda dapat mengikuti langkah-langkah berikut:

  1. Buka file functions.php dalam theme yang digunakan.
  2. Tambahkan kode berikut untuk mendaftarkan widget section baru:
function my_custom_widget_section() {
    register_sidebar( array(
        'name'          => __( 'Nama Widget Section', 'text_domain' ),
        'id'            => 'nama_widget_section',
        'description'   => __( 'Deskripsi Widget Section', 'text_domain' ),
        'before_widget' => '<div>',
        'after_widget'  => '</div>',
        'before_title'  => '<h2 class="widget-title">',
        'after_title'   => '</h2>',
    ) );
}
add_action( 'widgets_init', 'my_custom_widget_section' );


Pastikan untuk mengganti “Nama Widget Section” dan “Deskripsi Widget Section” dengan nama dan deskripsi widget section yang ingin Anda buat.

  1. Simpan file functions.php.
  2. Buka dashboard WordPress Anda dan pilih menu “Appearance” dan pilih “Widgets”.
  3. Anda akan melihat widget section baru yang telah didaftarkan dengan nama yang sama dengan id yang Anda buat pada fungsi di atas.
  4. Seret widget yang ingin Anda tampilkan ke dalam widget section baru tersebut.
  5. Lihat situs Anda dan pastikan widget section sudah ditampilkan dengan benar.

Anda juga dapat menyesuaikan tampilan widget section dengan menambahkan CSS khusus pada file style.css theme Anda.

Popular

Google Pouts, USD to IDR Conversion No Longer Appears!

As a freelancer who often deals with currency conversion, we certainly rely on accurate information. However, recently, an interesting incident shook freelancers, especially those who frequently monitor the USD to IDR exchange rate. Google, which is usually the main...

Google Ngambek, Konversi USD ke IDR Tidaklah Tampil Lagi!

Sebagai seorang freelancer yang sering berurusan dengan konversi mata uang, tentunya kita selalu bergantung pada informasi yang akurat. Namun, baru-baru ini, ada kejadian menarik yang mengguncang para freelancer, khususnya yang sering memantau nilai tukar USD ke IDR....

Samsung Galaxy S25 dan Apa Saja Yang Perlu Anda Ketahui

Hai teman-teman! Semakin dekat nih dengan acara Galaxy Unpacked tanggal 23 Januari, bocoran tentang Galaxy S25, S25+, dan S25 Ultra semakin bertebaran. Sekarang, kita sudah mulai mendapatkan gambaran yang lebih jelas soal spesifikasi dan fitur dari unggulan premium...

Samsung Galaxy S25 Everything You Need to Know

Hey guys! As we get closer to the Galaxy Unpacked event on January 23, leaks about the Galaxy S25, S25+, and S25 Ultra are popping up everywhere. Now, we’re finally getting a clearer picture of the specs and features of Samsung’s upcoming premium flagship lineup. So,...

Tutorial Cypress Pemula

Jadi, kali ini saya baru saja nyobain salah satu framework automation testing namanya Cypress. Kalo yang udah pernah pake selenium, tugasnya ini mirip - mirip cuma beda bahasa pemograman aja kali ya. Setelah cobain, saya jadi pengen bikin tutorial Cypress untuk...

Install dan Konfigurasi Drupal

Jadi, pada topik Install dan Konfigurasi Drupal, kita bisa install menggunakan berbagai macam cara ya. Untuk install dan konfigurasi drupal di lokal, kalian bisa memakai XAMPP, LAMP, MAMP karena platform tersebut sudah menyertakan apachenya. Instalasi Drupal Unduh...

Introduction Drupal

Hello friends, I would like to provide an introduction to Drupal because, in September, I obtained a Drupal certification due to my office needs. I want to share the skills I have gained, hoping they will be useful for all of you. I also have experience with WordPress...

Perkenalan Drupal

Halo teman - teman, saat ini saya ingin perkenalan drupal dikarenakan pada bulan september saya sudah mendapaktan sertifikat Drupal dikarenakan kebutuhan kantor. Jadi saya ingin berbagi skill yang telah saya pelajari, semoga saja bisa bermanfaat untuk kalian semua....

Password Wifi McD Terbaru 2024

Di era digital yang serba terhubung, internet telah menjadi kebutuhan mendasar bagi banyak orang. Dari mencari informasi, bekerja secara remote, hingga berkomunikasi dengan orang terdekat, semuanya bergantung pada koneksi internet yang stabil. Namun, tidak semua orang...

Menerapkan Desain Grid dengan CSS Grid dan Flexbox

Desain grid dalam konteks web development merujuk pada penggunaan struktur grid 2 dimensi untuk menyusun dan menata elemen-elemen di halaman web. Hal ini memungkinkan pembagian tata letak menjadi baris dan kolom, menciptakan area yang lebih terstruktur dan...

Read More

Related Posts

Learn More

About the Author

Tubagus Putra Kencana

Saya telah mengerjakan beberapa proyek dalam berbagai bahasa. Karena sebagian besar pengalaman saya, bekerja di Konsultan IT yang harus bisa menyediakan apa yang dibutuhkan client. Jika tertarik untuk memberikan proyek atau peluang kerja yang membiarkan saya tetap dirumah jangan sungkan untuk kontak di linkedin saya.