Cách tạo trường lặp (Repeater Field) và nội dung linh hoạt (Flexible Content) với ACF

tin-tuc 0 lượt xem

Mở đầu

Advanced Custom Fields (ACF) là một trong những plugin mạnh mẽ giúp người dùng WordPress tạo ra các trường tùy chỉnh cho bài viết và trang. Trong bài viết này, chúng ta sẽ tìm hiểu cách tạo trường lặp (Repeater Field) và nội dung linh hoạt (Flexible Content) bằng ACF, từ đó giúp bạn tối ưu hóa nội dung trang web của mình.

Mục lục

Lợi ích của việc sử dụng ACF

  • Tăng cường khả năng tùy chỉnh: ACF cho phép bạn tạo ra các trường dữ liệu tùy chỉnh theo nhu cầu riêng của mình.
  • Giảm thiểu code: Thay vì viết code PHP phức tạp, bạn chỉ cần sử dụng ACF để thêm các trường mới.
  • Cải thiện trải nghiệm người dùng: Nội dung được tổ chức rõ ràng và dễ dàng chỉnh sửa cho người dùng không chuyên.

Điều kiện tiên quyết

  • Plugin ACF đã được cài đặt và kích hoạt trên trang WordPress của bạn.
  • Phiên bản WordPress tối thiểu yêu cầu là 4.9 trở lên.
  • Có quyền truy cập để chỉnh sửa các trường tùy chỉnh và bài viết.

Cách tạo trường lặp (Repeater Field)

  1. Truy cập vào mục Custom Fields trong bảng điều khiển WordPress.
  2. Nhấp vào Add New để tạo một nhóm trường mới.
  3. Đặt tên cho nhóm trường, ví dụ Thông tin sản phẩm.
  4. Nhấp vào Add Field và chọn Repeater làm loại trường.
  5. Điền các thông tin cần thiết cho trường lặp như tên trường, nhãn và hướng dẫn.
  6. Thêm các trường con cho trường lặp (ví dụ: tên sản phẩm, mô tả, giá).
  7. Cuối cùng, nhấn Publish để lưu lại.
<?php 
if( have_rows('thong_tin_san_pham') ): 
    while ( have_rows('thong_tin_san_pham') ) : the_row(); 
        $ten_san_pham = get_sub_field('ten_san_pham'); 
        $mo_ta = get_sub_field('mo_ta'); 
        $gia = get_sub_field('gia'); 
        echo '<h2>' . $ten_san_pham . '</h2>'; 
        echo '<p>' . $mo_ta . '</p>'; 
        echo '<p>Giá: ' . $gia . '</p>'; 
    endwhile; 
endif; 
?>

Cách tạo nội dung linh hoạt (Flexible Content)

  1. Trong nhóm trường, nhấp vào Add Field và chọn Flexible Content.
  2. Đặt tên cho trường, ví dụ Nội dung linh hoạt.
  3. Thêm các Layouts cho nội dung, mỗi Layout có thể chứa nhiều trường con khác nhau.
  4. Đối với mỗi Layout, bạn có thể thêm tên và các trường như tiêu đề, mô tả, hình ảnh.
  5. Nhấn Publish để lưu lại cấu hình.
<?php 
if( have_rows('noi_dung_linh_hoat') ): 
    while ( have_rows('noi_dung_linh_hoat') ) : the_row(); 
        if( get_row_layout() == 'tieu_de' ): 
            $tieu_de = get_sub_field('tieu_de'); 
            echo '<h2>' . $tieu_de . '</h2>'; 
        elseif( get_row_layout() == 'mo_ta' ): 
            $mo_ta = get_sub_field('mo_ta'); 
            echo '<p>' . $mo_ta . '</p>'; 
        endif; 
    endwhile; 
endif; 
?>

Kiểm tra và rollback

  • Trước khi áp dụng thay đổi, hãy kiểm tra xem các trường đã hoạt động đúng chưa bằng cách xem trước bài viết.
  • Nếu có vấn đề xảy ra, bạn có thể quay lại phiên bản trước đó trong mục Revisions của bài viết.

Lỗi thường gặp

  • Không thấy trường hiển thị: Kiểm tra xem nhóm trường đã được gán cho loại bài viết hay không.
  • Không thể lưu dữ liệu: Đảm bảo bạn đã cài đặt phiên bản ACF mới nhất.
  • Trường không hiển thị đúng định dạng: Kiểm tra lại mã PHP và đảm bảo các trường được gọi đúng cách.

FAQ

  • ACF có miễn phí không? – ACF có phiên bản miễn phí với những tính năng cơ bản. Tuy nhiên, để sử dụng các tính năng nâng cao như Repeater và Flexible Content, bạn cần mua phiên bản Pro.
  • Có thể sử dụng ACF trên các loại bài viết tùy chỉnh không? – Có, ACF hỗ trợ tạo trường tùy chỉnh cho tất cả các loại bài viết trong WordPress.
  • ACF có tương thích với các theme không? – ACF tương thích tốt với hầu hết các theme WordPress, nhưng bạn cần kiểm tra trước khi sử dụng.

Như vậy, bạn đã biết cách tạo trường lặp và nội dung linh hoạt với ACF. Việc này không chỉ giúp tổ chức nội dung tốt hơn mà còn tăng cường trải nghiệm người dùng. Hãy thử nghiệm ngay trên trang web của bạn để thấy những lợi ích mà ACF mang lại!

Bài viết liên quan

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *