Hiển thị custom fields ngoài loop WordPress

3 giờ ago, WordPress Themes, Views

Giới Thiệu Về Custom Fields và Vòng Lặp (Loop) Trong WordPress

WordPress, một nền tảng quản lý nội dung (CMS) phổ biến, cho phép người dùng tạo và quản lý các loại nội dung khác nhau, bao gồm bài viết, trang, và các loại bài viết tùy chỉnh (custom post types). Để mở rộng khả năng của WordPress và lưu trữ thông tin bổ sung cho mỗi bài viết hoặc trang, chúng ta sử dụng custom fields (trường tùy chỉnh).

Custom fields cho phép bạn thêm các trường dữ liệu bổ sung vào các bài viết hoặc trang, ngoài các trường mặc định như tiêu đề, nội dung và tác giả. Ví dụ: bạn có thể sử dụng custom fields để lưu trữ giá sản phẩm, đánh giá của khách hàng, hoặc thông tin liên hệ.

Vòng lặp (Loop) trong WordPress là một phần mã quan trọng được sử dụng để hiển thị danh sách các bài viết hoặc trang. Loop truy vấn cơ sở dữ liệu WordPress và lặp qua từng bài viết, hiển thị thông tin như tiêu đề, nội dung và các custom fields.

Tuy nhiên, đôi khi bạn cần hiển thị custom fields bên ngoài vòng lặp chính, chẳng hạn như trong sidebar, footer, hoặc header của trang web. Bài viết này sẽ hướng dẫn bạn cách thực hiện việc đó một cách chi tiết.

Tại Sao Cần Hiển Thị Custom Fields Ngoài Loop?

Có nhiều lý do tại sao bạn có thể muốn hiển thị custom fields bên ngoài vòng lặp:

Hiển thị thông tin tóm tắt: Bạn có thể hiển thị một tóm tắt của thông tin được lưu trữ trong custom fields trong sidebar hoặc footer để thu hút sự chú ý của người dùng.
Tạo các khu vực nội dung đặc biệt: Bạn có thể sử dụng custom fields để tạo các khu vực nội dung động, chẳng hạn như hộp thông tin sản phẩm hoặc khu vực quảng cáo.
Tích hợp với các plugin và dịch vụ khác: Bạn có thể sử dụng custom fields để tích hợp với các plugin và dịch vụ khác, chẳng hạn như plugin thương mại điện tử hoặc dịch vụ email marketing.

Việc hiển thị custom fields ngoài loop mang lại sự linh hoạt cao cho việc thiết kế và tùy biến giao diện trang web WordPress của bạn.

Các Phương Pháp Hiển Thị Custom Fields Ngoài Loop

Có một số phương pháp để hiển thị custom fields ngoài vòng lặp trong WordPress:

Sử dụng hàm get_post_meta(): Đây là phương pháp cơ bản và được sử dụng rộng rãi nhất. Hàm này cho phép bạn truy xuất giá trị của một custom field cụ thể cho một bài viết hoặc trang cụ thể.
Sử dụng các plugin hỗ trợ custom fields: Có rất nhiều plugin WordPress miễn phí và trả phí cho phép bạn tạo và quản lý custom fields một cách dễ dàng, cũng như cung cấp các hàm và shortcode để hiển thị chúng ngoài loop. Ví dụ: Advanced Custom Fields (ACF), Meta Box, Custom Field Suite.
Sử dụng WP_Query: Mặc dù WP_Query thường được dùng để tạo loop tùy chỉnh, bạn có thể sử dụng nó để truy xuất thông tin của một bài viết cụ thể và sau đó hiển thị các custom fields của bài viết đó.

Sử Dụng Hàm `get_post_meta()`

Hàm get_post_meta() là một hàm WordPress tích hợp sẵn được sử dụng để truy xuất giá trị của một custom field. Cú pháp của hàm này như sau:

get_post_meta( int $post_id, string $key = '', bool $single = false )

$post_id: ID của bài viết hoặc trang mà bạn muốn truy xuất custom field.
$key: Tên của custom field mà bạn muốn truy xuất.
$single: (Tùy chọn) Nếu được đặt thành true, hàm sẽ trả về một giá trị duy nhất. Nếu được đặt thành false (mặc định), hàm sẽ trả về một mảng các giá trị.

Ví dụ: Giả sử bạn có một custom field có tên là gia_san_pham cho bài viết có ID là 123. Để hiển thị giá trị của custom field này, bạn có thể sử dụng đoạn mã sau:

<?php
$gia = get_post_meta( 123, 'gia_san_pham', true );
if ( $gia ) {
    echo '<p>Giá sản phẩm: ' . esc_html( $gia ) . '</p>';
}
?>

Lưu ý: Hàm esc_html() được sử dụng để đảm bảo rằng giá trị của custom field được hiển thị một cách an toàn và không gây ra các vấn đề bảo mật.

Sử Dụng Plugin Advanced Custom Fields (ACF)

Advanced Custom Fields (ACF) là một plugin WordPress phổ biến cho phép bạn tạo và quản lý custom fields một cách dễ dàng. ACF cung cấp một giao diện trực quan để tạo các trường tùy chỉnh và các hàm đơn giản để hiển thị chúng.

Cách sử dụng ACF để hiển thị custom fields ngoài loop:

Cài đặt và kích hoạt plugin ACF.
Tạo một nhóm trường (field group) và thêm các trường tùy chỉnh bạn muốn sử dụng.
Gán nhóm trường này cho các loại bài viết (post types) hoặc trang mà bạn muốn sử dụng custom fields.
Sử dụng hàm get_field() hoặc the_field() để hiển thị giá trị của custom fields.

Ví dụ: Giả sử bạn có một custom field có tên là mo_ta_ngan (mô tả ngắn) được tạo bằng ACF. Để hiển thị giá trị của custom field này cho bài viết có ID là 456, bạn có thể sử dụng đoạn mã sau:

<?php
$mo_ta = get_field( 'mo_ta_ngan', 456 );
if ( $mo_ta ) {
    echo '<p>Mô tả ngắn: ' . esc_html( $mo_ta ) . '</p>';
}
?>

Hoặc sử dụng hàm the_field() để tự động hiển thị giá trị:

<?php
the_field( 'mo_ta_ngan', 456 );
?>

ACF cung cấp nhiều tính năng nâng cao, chẳng hạn như các loại trường khác nhau (text, textarea, image, select, etc.), logic có điều kiện (conditional logic), và khả năng tạo các block Gutenberg tùy chỉnh.

Sử Dụng WP_Query

Mặc dù WP_Query thường được sử dụng để tạo các vòng lặp tùy chỉnh, bạn cũng có thể sử dụng nó để truy xuất thông tin của một bài viết cụ thể và sau đó hiển thị các custom fields của bài viết đó.

Ví dụ: Để lấy custom field từ bài viết có ID là 789, bạn có thể sử dụng đoạn mã sau:

<?php
$args = array(
    'p' => 789, // ID của bài viết
    'post_type' => 'post', // Hoặc 'page', 'custom_post_type'
);

$the_query = new WP_Query( $args );

if ( $the_query->have_posts() ) {
    while ( $the_query->have_posts() ) {
        $the_query->the_post();
        $gia_tri_field = get_post_meta( get_the_ID(), 'ten_custom_field', true );

        if ( $gia_tri_field ) {
            echo '<p>Giá trị custom field: ' . esc_html( $gia_tri_field ) . '</p>';
        }
    }
    wp_reset_postdata();
} else {
    echo '<p>Không tìm thấy bài viết.</p>';
}
?>

Đoạn mã này tạo một đối tượng WP_Query để truy vấn bài viết có ID là 789.
Sau đó, nó lặp qua kết quả (mặc dù chỉ có một kết quả trong trường hợp này) và sử dụng hàm get_post_meta() để truy xuất giá trị của custom field.
Cuối cùng, nó hiển thị giá trị của custom field.
wp_reset_postdata() được gọi để khôi phục dữ liệu bài viết toàn cục (global post data) về trạng thái ban đầu.

Lời Kết

Hiển thị custom fields ngoài loop là một kỹ thuật hữu ích cho phép bạn tùy biến giao diện trang web WordPress của mình một cách linh hoạt. Bằng cách sử dụng các phương pháp được trình bày trong bài viết này, bạn có thể dễ dàng truy xuất và hiển thị thông tin bổ sung được lưu trữ trong custom fields ở bất kỳ vị trí nào trên trang web của bạn.

Hãy chọn phương pháp phù hợp nhất với nhu cầu và kỹ năng của bạn. Nếu bạn mới bắt đầu, việc sử dụng plugin ACF có thể là một lựa chọn tốt vì nó cung cấp một giao diện trực quan và các hàm đơn giản. Nếu bạn muốn có sự kiểm soát cao hơn, bạn có thể sử dụng hàm get_post_meta() hoặc WP_Query.

admin

#ezw_tco-2 .ez-toc-widget-container ul.ez-toc-list li.active::before { background-color: #ededed; } aa