Cách Thêm Hộp Meta Tùy Chỉnh Vào Bài Viết Và Loại Bài Viết Trong WordPress

Mục lục

Bạn có muốn tạo hộp meta custom cho bài đăng, trang và loại bài đăng custom trên WordPress của mình không?

WordPress tự động thêm meta vào content của bạn, chẳng hạn như ngày xuất bản, category và tag. Tuy nhiên, bạn cũng có thể muốn thêm meta custom của riêng mình.

Trong bài viết này, WPBeginner Việt Nam sẽ chỉ cho bạn cách dễ dàng thêm thông tin độc đáo vào content của bạn bằng cách tạo hộp meta custom trong WordPress.

Cách thêm hộp meta custom vào bài đăng và loại bài đăng trên WordPress

Custom Meta Box trong WordPress là gì?

Khi bạn tạo bài đăng và trang hoặc loại bài đăng custom trong WordPress, content đó thường có meta riêng. Siêu dữ liệu này là thông tin liên quan đến content như ngày và giờ, tên tác giả, tiêu đề, v.v.

Bạn cũng có thể thêm meta của riêng mình bằng cách sử dụng hộp custom field mặc định.

Thêm hộp meta custom vào bài viết WordPress

Mẹo chuyên nghiệp: Bạn không thấy hộp Trường custom trong trình chỉnh sửa bài đăng? Vậy hãy xem hướng dẫn của WPBeginner Việt Nam về cách khắc phục custom field không hiển thị trong WordPress.

Hộp Custom Fields là giải pháp tốt nếu bạn chỉ muốn thêm meta custom vào một vài bài đăng. Tuy nhiên, nếu bạn có plan thêm nhiều thông tin độc đáo vào content của mình, thì việc tạo hộp meta custom là hợp lý.

Trên thực tế, nhiều plugin WordPress phổ biến thêm các hộp meta custom vào màn hình Chỉnh sửa cho các bài đăng và trang. Trong hình ảnh sau, bạn có thể thấy việc thêm thông tin SEO vào bài đăng của mình dễ dàng như thế nào, bằng cách sử dụng hộp meta custom do AIOSEO.

Plugin WordPress All in One SEO (AIOSEO)

Sau khi đã nói như vậy, chúng ta hãy xem làm thế nào bạn có thể dễ dàng thêm hộp meta custom vào bài đăng và loại bài đăng trên WordPress.

Cách Thêm Hộp Meta Tùy Chỉnh Vào Bài Viết Và Loại Bài Viết Trong WordPress

Cách dễ nhất để thêm hộp meta custom vào WordPress là sử dụng Các custom field nâng cao. Plugin này cho phép bạn đính kèm mọi loại thông tin bổ sung vào bài đăng và trang của mình, sau đó hiển thị dữ liệu đó cho người dùng bằng shortcode.

Điều đầu tiên bạn cần làm là cài đặt và kích hoạt plugin Advanced Custom Fields. Để biết thêm chi tiết, hãy xem hướng dẫn từng bước của WPBeginner Việt Nam về cách cài đặt plugin WordPress.

Tạo một hộp Meta custom

Sau khi kích hoạt, hãy truy cập ACF » Nhóm thực địa trang từ sidebar quản trị WordPress.

Tại đây, nhấp vào nút ‘Thêm mới’.

Thêm custom field vào website WordPress của bạn

Bây giờ bạn có thể tạo các custom field sẽ xuất hiện trong hộp meta.

Để bắt đầu, bạn cần nhập tiêu đề vào trường mặc định hiển thị ‘Field Group Title’. Tiêu đề này sẽ xuất hiện trong trình chỉnh sửa content WordPress và được sử dụng làm tiêu đề cho hộp meta của bạn.

Tuy nhiên, bạn nên sử dụng content mô tả, đặc biệt nếu bạn quản lý blog WordPress có nhiều tác giả hoặc chia sẻ dashboard với người khác.

Cách dễ dàng thêm meta custom vào website hoặc blog của bạn

Sau khi hoàn tất, bạn đã sẵn sàng thêm trường đầu tiên vào hộp meta của mình.

Thêm custom field vào hộp Meta của WordPress

Để bắt đầu, hãy mở danh sách dropdown ‘Loại trường’ và chọn loại trường bạn muốn thêm, chẳng hạn như Bộ chọn ngày, Hộp kiểm hoặc Trường văn bản.

Thêm các custom field vào trình chỉnh sửa content WordPress

Sau đó, nhập nhãn cho trường.

Trường custom nâng cao sẽ hiển thị nhãn này trước trường, giúp người dùng hiểu thông tin họ cần nhập.

Plugin Advanced Custom Fields WordPress

Advanced Custom Fields sẽ tự động tạo ‘Tên trường’, do đó bạn có thể để trống trường này.

Sau khi thực hiện xong, bạn có thể muốn nhập ‘Giá trị mặc định’. Giá trị này sẽ được tự động thêm vào trang, bài đăng hoặc loại bài đăng custom nếu người dùng không thêm thông tin của riêng họ.

Thêm giá trị mặc định vào các custom field của WordPress

Bạn có thể thấy nhiều option hơn tùy thuộc vào loại trường bạn đang tạo. Ví dụ: nếu bạn chọn ‘Hình ảnh’ từ danh sách dropdown ‘Loại file’, thì bạn có thể chọn định dạng hình ảnh.

Hầu hết các option này đều có giải thích rõ ràng nên bạn có thể làm theo hướng dẫn trên màn hình để cấu hình custom field.

Khi bạn đã hài lòng với cách thiết lập trường, hãy nhấp vào nút ‘Đóng trường’ để thu gọn phần đó.

Thêm dữ liệu custom vào website hoặc blog

Bây giờ bạn có thể thêm nhiều trường hơn vào hộp meta custom bằng cách nhấp vào nút ‘Thêm trường’.

Sau đó, chỉ cần cấu hình trường bằng cách làm theo quy trình tương tự được mô tả ở trên.

Lưu nhóm custom field

Thêm Hộp Meta Tùy chỉnh vào Trình chỉnh sửa Nội dung WordPress

Khi bạn đã hài lòng với cách thiết lập hộp meta custom, bạn sẽ cần xác định vị trí và thời điểm hộp meta sẽ xuất hiện.

Để thực hiện việc này, hãy cuộn đến phần ‘Cài đặt’ rồi nhấp vào tab ‘Quy tắc vị trí’.

Kiểm soát nơi content custom xuất hiện trong trình chỉnh sửa content WordPress

Advanced Custom Fields có thể thêm hộp vào mọi loại content. Ví dụ, bạn có thể hiển thị hộp meta trên các loại bài đăng, category, phân loại, menu điều hướng cụ thể, v.v.

Chỉ cần sử dụng dropdown menu để chọn nơi hộp meta sẽ xuất hiện trong dashboard WordPress của bạn. Ví dụ, nếu bạn chấp nhận bài đăng của khách thì bạn có thể muốn thêm hộp vào tất cả các bài đăng trong category ‘Bài đăng của khách’.

Tạo quy tắc content bằng cách sử dụng plugin WordPress

Sau đó, nhấp vào tab ‘Trình bày’.

Tại đây, bạn có thể chọn kiểu hộp meta, vị trí hộp meta sẽ xuất hiện trên blog WordPress của bạn và vị trí nhãn và hướng dẫn sẽ xuất hiện.

Cài đặt trình bày của ACF trong dashboard WordPress

Nếu bạn dự định thêm nhiều hộp vào cùng một vị trí, bạn có thể thay đổi thứ tự xuất hiện của chúng bằng cách nhập vào trường ‘Số thứ tự’.

Ví dụ, việc hiển thị các hộp meta quan trọng nhất ở đầu màn hình có thể cải thiện quy trình biên tập của bạn.

Nếu bạn không chắc chắn, bạn có thể để trường này ở giá trị 0.

Sắp xếp lại các trường trong trình chỉnh sửa content WordPress

Trên màn hình này, bạn cũng sẽ thấy danh sách tất cả các trường mà WordPress thường hiển thị trên màn hình chỉnh sửa bài đăng.

Nếu bạn muốn ẩn một trường, chỉ cần đánh dấu vào ô của trường đó. Ví dụ, nếu bạn đang sử dụng các custom field để tạo hộp thông tin tác giả, thì bạn có thể muốn ẩn trường ‘Tác giả’ mặc định.

Ẩn các trường trong trình chỉnh sửa bài đăng WordPress

Khi bạn hài lòng với những thay đổi đã thực hiện, hãy nhấp vào ‘Lưu thay đổi’ để áp dụng nhóm trường đó.

Bây giờ bạn đã tạo thành công một hộp meta custom cho bài đăng, trang hoặc loại bài đăng custom trên WordPress của mình. Tùy thuộc vào cài đặt của bạn, giờ đây bạn có thể truy cập trình chỉnh sửa bài đăng để xem hộp meta custom đang hoạt động.

Một ví dụ về hộp meta custom, được tạo bằng plugin WordPress miễn phí

Hiển thị dữ liệu hộp Meta custom của bạn trong theme WordPress

Bây giờ bạn đã thêm thành công một hộp meta custom vào dashboard WordPress. Bất kỳ thông tin nào người dùng nhập vào hộp meta sẽ được lưu trữ trong cơ sở dữ liệu WordPress khi họ lưu hoặc xuất bản bài đăng. Tuy nhiên, thông tin này sẽ không xuất hiện trên website của bạn theo mặc định.

Với suy nghĩ đó, hãy đảm bảo meta custom xuất hiện trong theme WordPress của bạn để người dùng có thể nhìn thấy.

Bạn có thể thực hiện việc này bằng cách sử dụng shortcode hoặc chỉnh sửa file theme WordPress của mình.

Cách Hiển thị Siêu dữ liệu Tùy chỉnh bằng Mã ngắn

Thêm shortcode vào WordPress là phương pháp dễ nhất và cho phép bạn kiểm soát chính xác vị trí thông tin xuất hiện trên website của mình.

Ví dụ, nếu bạn đã tạo trường ‘Xếp hạng sao’, thì bạn có thể hiển thị thông tin này sau tiêu đề bài đăng, bên trong content, ở chân trang hoặc bất kỳ nơi nào khác chỉ bằng cách thêm shortcode.

Tuy nhiên, bạn sẽ cần phải thêm shortcode vào từng trang, bài đăng hoặc loại bài đăng custom theo cách thủ công. Điều này có thể tốn nhiều thời gian và công sức, đặc biệt là nếu bạn có nhiều content.

Để lấy shortcode của một trường, hãy đi tới ACF » Nhóm thực địa. Sau đó, di chuột qua nhóm trường mà bạn muốn hiển thị và nhấp vào link ‘Chỉnh sửa’ khi nó xuất hiện.

Chỉnh sửa nhóm trường meta

Bây giờ bạn sẽ thấy tất cả các trường tạo nên nhóm này.

Đối với mỗi trường bạn muốn hiển thị, hãy ghi chú giá trị vào trường ‘Tên’.

Cách hiển thị dữ liệu custom trong theme WordPress của bạn bằng cách sử dụng shortcode

Sau khi thực hiện xong, hãy đến trang, bài đăng hoặc loại bài đăng custom mà bạn muốn hiển thị meta custom.

Bây giờ bạn có thể nhấp vào icon ‘+’ và nhập ‘Mã ngắn’.

Thêm shortcode vào trang hoặc bài đăng WordPress

Khi block bên phải xuất hiện, hãy nhấp để thêm vào layout của bạn.

Bây giờ bạn có thể thêm shortcode sau vào block, đảm bảo thay thế "article_byline" với tên trường bạn muốn hiển thị.

Thêm meta custom vào theme WordPress

Bây giờ bạn có thể lặp lại các bước này để thêm nhiều custom field vào bài đăng.

Khi bạn hài lòng với những thay đổi đã thực hiện, hãy nhấp vào nút ‘Xuất bản’ hoặc ‘Cập nhật’. Bây giờ, chỉ cần truy cập website WordPress của bạn để xem meta custom đang hoạt động.

Một ví dụ về meta custom, được hiển thị bằng shortcode

Cách Hiển thị Siêu dữ liệu Tùy chỉnh bằng cách Chỉnh sửa Chủ đề WordPress của Bạn

Nếu bạn muốn hiển thị meta custom ở cùng một vị trí trên mọi trang, bài đăng hoặc loại bài đăng custom, thì bạn có thể thêm code vào file theme WordPress của mình.

Điều này có thể giúp bạn tiết kiệm thời gian về lâu dài, nhưng không phải là phương pháp tối ưu nhất với người mới bắt đầu. Bạn cũng sẽ mất tất cả code custom vào lần tiếp theo bạn cập nhật theme WordPress, đó là lý do tại sao WPBeginner Việt Nam khuyên bạn nên tạo một theme con. Sau đó, bạn có thể thêm code custom của mình vào theme con.

Nếu bạn chưa từng chỉnh sửa file theme của mình trước đây, hãy xem hướng dẫn dành cho người mới bắt đầu về cách sao chép và dán code trong WordPress.

Bạn sẽ cần chỉnh sửa file mà bạn muốn hiển thị meta custom. Điều này sẽ khác nhau tùy thuộc vào theme của bạn, nhưng bạn thường sẽ cần chỉnh sửa file single.php, content.php hoặc page.php của website.

Khi bạn đã có đúng file, bạn sẽ cần thêm code vào loop WordPress. Để tìm loop này, chỉ cần tìm kiếm code sau trông giống như thế này:

Sau đó, bạn có thể dán code của mình sau dòng này và trước dòng kết thúc loop:

Ví dụ, code custom field của bạn sẽ trông giống như thế này:

Lưu ý cách WPBeginner Việt Nam bọc code trong tiêu đề h2 bằng lớp CSS. Điều này cho phép WPBeginner Việt Nam định dạng và tạo kiểu cho custom field sau bằng cách thêm CSS custom vào theme của WPBeginner Việt Nam.

Đây là một ví dụ khác:

Khi thêm code vào theme của bạn, đừng quên thay thế tên trường.

Sau khi hoàn tất, bạn có thể truy cập bất kỳ bài đăng nào mà bạn đã nhập dữ liệu vào các custom field. Bây giờ bạn sẽ thấy meta duy nhất của mình đang hoạt động.

Cách thêm custom field vào theme WordPress

Chúng tôi hy vọng bài viết này giúp bạn biết cách thêm hộp meta custom vào bài đăng và loại bài đăng trên WordPress. Bạn cũng có thể muốn xem hướng dẫn của WPBeginner Việt Nam về cách tạo quy trình làm việc tự động trên website WordPress của bạn hoặc xem lựa chọn chuyên gia của WPBeginner Việt Nam về các plugin và công cụ SEO tốt nhất mà bạn nên sử dụng.

Nếu bạn thích bài viết này, vui lòng đăng ký theo dõi WPBeginner Việt Nam Kênh Youtube cho các video hướng dẫn về WordPress. Bạn cũng có thể tìm thấy WPBeginner Việt Nam trên TwitterFacebook.

5/5 - (170 bình chọn)
Facebook
Twitter
LinkedIn
Telegram
Email
Đội Ngũ Biên Tập
WordPress

Cách Thêm Schema FAQ vào WordPress (2 Phương pháp)

Bạn có muốn thêm schema FAQ vào WordPress không? Việc thêm schema FAQ có thể giúp tăng thứ hạng SEO và tỷ lệ nhấp chuột tự nhiên bằng cách hiển thị trực tiếp các câu hỏi thường gặp trong kết quả tìm kiếm của Google. Trong bài viết này, WPBeginner

Đọc tiếp »