Advanced Custom Fields (ACF) adalah plugin WordPress yang sangat populer untuk menambahkan field kustom ke dalam website. Dengan ACF, kita dapat mengelola data tambahan secara terstruktur tanpa harus membuat sistem manual atau coding yang kompleks. Plugin ini sangat berguna untuk website company profile, blog, portfolio, hingga website berbasis data dinamis.

Apa Itu ACF?

Advanced Custom Fields adalah plugin yang memungkinkan pengguna WordPress menambahkan input data tambahan (custom fields) seperti teks, gambar, angka, pilihan, dan lainnya ke dalam post, page, maupun custom post type.

Contoh penggunaan ACF:

  • Profil tim (nama, jabatan, foto)
  • Detail produk (harga, spesifikasi, galeri)
  • Event (tanggal, lokasi, jam)
  • Testimoni (nama, foto, ulasan)

Mengapa Menggunakan ACF?

Beberapa keunggulan ACF:

  • Manajemen data lebih rapi dan terstruktur
  • Mudah digunakan (user friendly)
  • Mendukung data dinamis
  • Terintegrasi baik dengan Elementor
  • Cocok untuk website skala kecil hingga besar

Jenis-Jenis Field di ACF

ACF menyediakan berbagai tipe field, di antaranya:

  • Text
  • Textarea
  • Number
  • Email
  • URL
  • Image
  • Gallery
  • File
  • Select
  • Checkbox
  • Radio Button
  • True / False
  • Date Picker
  • Repeater (Pro)
  • Flexible Content (Pro)

Cara Instalasi ACF

  1. Masuk ke Dashboard WordPress
  2. Pilih menu Plugins → Add New
  3. Cari Advanced Custom Fields
  4. Klik Install lalu Activate

Membuat Field Group di ACF

Field Group adalah kumpulan field yang ditampilkan pada halaman tertentu.

Langkah-langkah:

  1. Masuk ke Custom Fields → Add New
  2. Beri nama Field Group
  3. Tambahkan field sesuai kebutuhan
  4. Atur Location Rules (misalnya Post Type = Page)
  5. Simpan Field Group

Location Rules

Location Rules menentukan di mana field akan muncul.

Contoh:

  • Post Type = Post
  • Post Type = Page
  • Page = Home
  • Post Type = Custom Post Type

Dengan location rules, field hanya muncul di halaman yang relevan.

Menampilkan Data ACF

1. Menggunakan Elementor

Elementor dapat menampilkan data ACF secara dinamis:

  • Dynamic Text
  • Dynamic Image
  • Dynamic Link

Langkah singkat:

  1. Tambahkan widget (Heading, Text, Image)
  2. Klik ikon Dynamic Tags
  3. Pilih ACF Field
  4. Pilih nama field yang diinginkan

2. Menggunakan Kode (PHP)

ACF juga bisa ditampilkan menggunakan kode PHP di theme:

  • the_field()
  • get_field()

Biasanya digunakan pada custom theme atau template khusus.

ACF Free vs ACF Pro

ACF Free:

  • Field dasar
  • Cocok untuk website sederhana

ACF Pro:

  • Repeater Field
  • Flexible Content
  • Clone Field
  • Options Page

ACF Pro sangat direkomendasikan untuk website kompleks dan dinamis.

ACF & Custom Post Type

ACF sering digunakan bersama Custom Post Type untuk membangun CMS:

  • Portfolio
  • Produk
  • Artikel khusus
  • Tim perusahaan

Kombinasi CPT + ACF + Elementor memungkinkan pembuatan website tanpa batas desain.

Facebook
WhatsApp
Twitter
LinkedIn
Pinterest
About Author
Amri Sayyida

A Profesional Web Developer with over 5 years of experience. I am ready to collaborate with you!

Follow us on