Advanced Custom Fields Là Gì ? Hướng Dẫn Cách Làm Theme Options Bằng Plugin Advanced Custom Fields PRO

Advanced Custom Field viết tắt là (ACF), là một plugin hỗ trợ mạnh mẽ trong wordpress. Với plugin này sẽ cho phép người thiết kế website wordpres dễ dàng tạo các meta box với những thao tác đơn giản. Chỉ vào thao tác cài đặt plugin Advanced Custom Field bạn hoàn toàn thấy quá đơn giản trong việc làm tùy biến cho wordpress

Xem thêm bài viết khác:

• Hướng Dẫn Cấu Hình SMTP Gmail Với Plugin WP SMTP WordPress
• Tìm 3 plugin tăng tốc wordpress thường được sử dụng
• Hướng dẫn sử dụng Plugin PolyLang làm website wordpress đa ngôn ngữ

Advanced Custom Field tải và cài đặt như thế nào ? Tìm hiểu các trường trong AFC hiện có

Plugin Advanced Custom Field có cung cấp tất tầng tật về tài liệu hướng dẫn sử dụng khá chi tiết. Trong bài viết này, Công ty thiết kế website chuyên nghiệp Tùng Phát Seo sẽ làm bài hướng dẫn giới thiệu cơ bản về chức năng của Plugin ACF.

Đội ngũ nhân viên chúng tôi sẽ hướng dẫn tư việc thực hiện cài đặt Plugin Advanced Custom Field đến việc làm một theme options cơ bản nhất bằng cách sử dụng plguin Advanced Custom Fields PRO này

Bắt đầu tải và cài đặt Plugin ACF

Lập trình viên wordpress cần tìm hiểu như sau: Hiên nay  có 2 phiên bản đó là phiên bản advanced custom fields wordpress miễn phí  và advanced custom fields pro

Bản miễn phí bạn sẽ tải:  tải về từ đây.

Phiên bản advanced custom fields pro bạn cần mua tại đây, Đây là phiên bản đầy đủ giúp cho người lập trình wordpress dễ dàng tùy chỉnh hơn. Sau khi đã tạo và cài đặt được plugin AFC rồi. Công việc tiếp theo bạn cần tìm hiểu Group Field và Field nhé.

Khởi tạo field

Việc đầu tiên bạn cần làm là khởi tạo các field. Trong Bảng quản trị, bạn tìm menu “Custom Fields” và chọn “Field Groups”. Click “Add New” để thêm mới một field group mới.

Field Groups là gì?

Đây là tập hợp các field sẽ hiển thị trong backend theo một điều kiện nào đó. Ví dụ cụ thể nhé:

Ta muốn nếu là Posts (Bài viết), thì ở trong mỗi bài viết đều hiển thị một mục tên là “Nguồn tin” (loại field là text bình thường), và thêm một field để nhập “Tác giả” thay vì tên tác giả của WordPress.

Như vậy, đây là 2 fields có cùng một điều kiện là hiện trên Single Post. Nó sẽ nên nằm cùng Field Group để bạn set điều kiện đúng không nào? Đó là cách Field Groups hoạt động!!!

Tìm hiểu các trường Field là gì?

Field chính là một loại nhập dữ liệu đầu vào như ta thường thấy. Field trong ACF (đặc biệt là bản Pro) cung cấp rất nhiều kiểu (document gọi là Field Type). Dưới đây là các field thường được sử dụng:

FIELD TYPE CƠ BẢN

• Text
• Number
• Email
• Textarea
• Select
• Radio Button
• True/False

FIELD TYPE LÀM VIỆC VỚI WP_QUERY

• Page Link
• Post Object
• Relationship
• Taxonomy
• User

FIELD TYPE CHỨA CÁC FIELD HOẶC LỚP CON (NHIỀU TẦNG DỮ LIỆU)

• Repeater
• Flexible Content
• Field Type chỉ hiển thị trong backend
• Message
• Tab

Nhìn chung tổng quan plugin advanced custom fields pro wodpress đã có hầu hết các trường và các chức năng. Công việc còn lại của bạn là phải nắm hết các chức năng này. Để từ đó áp dụng vào việc triển khai trên từng dụng án thiết kế website wordpress của mình sao cho hiệu quả nhất.

Hướng dẫn từng bước làm theme option với Plugin advanced custom fields pro chi tiết nhất

Tiến hành làm Theme options Plugin advanced custom fields pro. Với chức năng này trong wordpress đây là một nơi mà người lập trình viên muốn điều chỉnh một số nơi trên theme WordPress. Chẳng hạn như cho phép người dùng có thể thay đổi logo, các thông tin lên hệ, thay đổi màu sắc của website… Với chức năng này sẽ hỗ trợ người dùng không cần phải vào chỉnh sửa lại code trên website

Các bước làm theme option bằng Plugin advanced custom fields

1. Bước 1 tiến hành cài đặt them đoạn code này vào file functions.php của website

if( function_exists(‘acf_add_options_page’) ) {

acf_add_options_page(array(

‘page_title’ => ‘Theme options’, // Title hiển thị khi truy cập vào Options page

‘menu_title’ => ‘Theme options’, // Tên menu hiển thị ở khu vực admin

‘menu_slug’ => ‘theme-settings’, // Url hiển thị trên đường dẫn của options page

‘capability’ => ‘edit_posts’,

‘redirect’ => false

));

}

Tiến hành thêm Group Field và File vào chức năng tùy chỉnh

Sau đây các lập trình viên website wordpress sẽ học thêm cách tùy biến cụ thể nhất của Plugin advanced custom fields pro

• Thêm sửa logo website
• Thêm sửa địa chỉ
• Thêm sửa email

Các bước thao tác thục hiện

Bước 1: Bạn tìm đến menu Custom Fields chọn Add New

Bước 2: Trong khu vực Add New Field Group các bạn tiến hành thêm tên group field và thêm các field mong muốn.

• Với chức năng tùy chỉnh logo: Tên field là logo kiểu của field là image
• Với chức năng tùy chỉnh địa chỉ: Tên field là address kiểu field là text
• Với chức năng tùy chỉnh email: Tên field là email kiểu là text

Xem hình phía dưới để hiểu rõ hơn nhé:

=> Với những thao tác thêm chức năng bạn sẽ có ngay những field mà bạn mong muốn

Bước 3: Tiếp theo ở trong khu vực location các bạn chọn Options Page như hình phía dưới.

Sau khi đã hoàn thiện đầy đủ các Group field và Field bạn chọn Đăng bài viết bên góc phải.

Và đây là kết quả sau khi bạn đã thực hiện đúng các bước nhưng mình đã hướng dẫn.

Tìm hiểu cách lấy dữ liệu các field vừa thêm vào ra ngoài trang chủ

Sau khi đã hoàn thành thêm nội dung cần hiển thị ở các trường các bạn sẽ tập làm quen với những code hiển thị của AFC

Code Get dữ liệu ra giao diện: Chúng ta sẽ sử dụng cú pháp sau để get dữ liệu:

<?php

   the_field({field_name}, ‘option’);

?>

lưu ý {field_name} là tên field khi chúng ta tạo các field nhé. Cụ thể trong ví dụ mà chúng ta đang làm sẽ như sau:

Code Get logo:

hoặc

Code Get địa chỉ:

Code Get email:

<p>

<strong>Email:</strong>

<?php the_field(’email’, ‘option’); ?>

==> Đây là những đoạn code cơ bản mà đội ngữ nhân viên thiết kế website chuyên nghiệp Tùng Phát hay dùng để tùy biến thường gặp khi sử dụng Plugin Advanced Custom. Ngoài ra với Plugin Advanced Custom Pro bạn sẽ đọc thêm những hướng dẫn chi tiết về cách sử dụng plugin AFC này. Hy vọng bài viết này sẽ giúp ít nhiều cho các bạn khi tập làm quen với chức năng làm theme option wordpress bằng Plugin Advanced Custom Pro. Chúc các bạn thực hành thành công !