Tạo Theme Options tùy chỉnh nội dung với Plugin Advanced Custom Fields (ACF)

by admincp
129 Xem

Như tiêu đề thì trong bài viết này mình sẽ hướng dẫn cách tạo Theme Options cho website sử dụng Plugin ACF Advanced Custom Fields.

Theme Options là trang cho phép bạn thay đổi 1 số nội dung nhất định trên theme mà không cần phải sửa trong code như: thay đổi logo, thay đổi banner slide, thay đổi thông tin liên hệ, liên kết mạng xã hội, …. Giúp quản trị thay đổi nội dung dễ dàng và nhanh chóng.

Có thể bạn chưa biết, ACF là 1 plugin rất mạnh. và rất phổ biến để tạo thêm các trường tùy biến cho các nội dung trong quản trị wordpress (ví dụ: tạo trường ảnh cho chuyên mục, tạo trường giá cho bài viết, …), tuy nhiên ACF còn cung cấp cho chúng ta tính năng tạo 1 Theme Options Page cực kì chuyên nghiệp. Chi tiết cách cài đặt và cấu hình, mời bạn theo dõi tiếp bài viết.

Cài đặt plugin Advanced Custom Fields Pro

Trước khi cài đặt bạn cần phải có bản cài, do bắt buộc phải sử dụng bản Pro (bản trả phí) nên bạn có thể mua bản quyền từ nhà cung cấp, hoặc có thể tải bản Advanced Custom Fields Pro được Vinastar chia sẻ tại đây

Sau khi tải về thành công bạn có thể cài plugin trong trang Admin WordPress, hoặc upload trực triếp lên thực mục plugins rồi giải nén ra.

Cấu hình plugin Advanced Custom Fields làm Theme Options

Tạo Options Page

Bạn cần phải tạo 1 trang options để thêm các tùy chọn cấu hình cho website.

Chèn đoạn code sau vào cuối file functions.php của theme.

if( function_exists('acf_add_options_page') ) {
    acf_add_options_page(array(
        'page_title'    => 'Cấu hình website',
        'menu_title'    => 'Cấu hình website',
        'menu_slug'     => 'huydev-theme-settings',
        'capability'    => 'edit_posts',
        'redirect'  => false
    ));
}

Sau khi thêm xong, bạn tải lại trang quản trị, nếu thấy xuất hiện menu “Cấu hình website” thì bạn đã thêm đoạn code trên thành công.

Cấu hình Theme Options

Các bước cấu hình:

  • Bước 1: Ở menu Custom Fields chọn Add New.
  • Bước 2: Nhập tiêu đề.
  • Bước 3: Tạo các tùy chọn để cấu hình thay đổi nội dung, bạn tạo các tab cho mỗi phần nội dung để quản lý dễ dàng hơn.
  • Bước 4: Xổ ra và chọn Options Page.
  • Bước 5: Chọn Cấu hình website.
  • Bước 6: Bấm vào đăng để hoàn tất.

Sau khi tạo xong các cấu hình, bạn chọn vào menu Cấu hình website để nhập các thông tin vào.

Hiển thị ACF Theme Options

Để gọi hiển thị được các thông tin trong phần cấu hình web, bạn sử dụng đoạn code dưới đây.

<?php echo get_field('field_name', 'option'); ?>

Cần thay field_name cho đúng với tên trường đã tạo.

Vậy là mình đã giới thiệu xong cách cài đặt cũng như cấu hình plugin Advanced Custom Fields để làm Theme Options cho web site. Nếu có thắc mắc hoặc có ý kiến góp ý, bạn hãy bình luận ở phía bên dưới. Xin chân thành cảm ơn!

Bài viết liên quan

Leave a Comment