Bạn có muốn chèn thêm Facebook Open Graph Meta Data vào theme WordPress của mình không?
Facebook Open Graph Metadata giúp Facebook và các mạng xã hội khác dễ dàng quét các dữ liệu chính từ bài viết của bạn. Đồng thời bạn cũng có thể kiểm soát cách thức nội dung của bạn xuất hiện khi được chia sẻ trên Facebook.
Trong bài viết này, chúng tôi sẽ chỉ cho bạn cách dễ dàng chén thêm Facebook Open Graph Metadata vào các theme WordPress. Chúng tôi sẽ chia sẻ ba phương pháp khác nhau để bạn có thể chọn một phương pháp phù hợp nhất với mình.
Phương pháp 1. Thêm Facebook Open Graph Meta Data với All in One SEO
All in One SEO là một plugin WordPress SEO phổ biến, được sử dụng bởi hơn 2 triệu trang web trên toàn cầu. Nó cho phép bạn dễ dàng tối ưu hóa trang web của mình cho các công cụ tìm kiếm cũng như các nền tảng mạng xã hội như Facebook và Twitter.
Đầu tiên, bạn cần cài đặt và kích hoạt plugin All in One SEO . Để biết thêm chi tiết, hãy xem hướng dẫn của chúng tôi về cách cài đặt plugin WordPress .
Sau khi kích hoạt, bạn truy cập trang All in One SEO » Feature Manager. Từ đây, bạn cần kích hoạt tính năng Social Meta.
Tiếp theo, bạn truy cập All in One SEO » Social Meta. Tại đây, bạn chỉ cần điền dữ liệu metadata vào các ô có sẵn.
Bạn có thể bắt đầu bằng cách điền tiêu đề, hình ảnh và mô tả cho trang chủ.
Ở dưới, bạn có thể đặt một hình ảnh làm hình mặc định, dùng trong trường hợp bài viết không có hình đại diện. Bạn cũng có thể thiết lập chiều rộng và chiều cao của hình ảnh đó.
Nếu bạn cần thêm hướng dẫn trong việc chọn kích cỡ hình ảnh, hãy tham khảo bài viết tổng hợp các loại kích cỡ hình ảnh cho mạng xã hội, bao gồm cả Facebbook.
Nếu website của bạn đang sử dụng một Facebook app hoặc có một page trên Facebook, bạn có thể thiết lập Facebook app ID trong phần tiếp theo. Điều này sẽ giúp bạn có thêm dữ liệu cho Facebook insights.
Bên cạnh đó, bạn cũng có thể điều chỉnh các cài đặt cho Twitter và thực hiện quét để tránh các tag Open Graph bị trùng.
Khi đã hoàn tất, đừng quên nhấn nút Update Options để lưu lại các cài đặt.
Giờ bạn đã thiết lập Open Graph meta tag cho toàn bộ website, bước tiếp theo là cài đặt Open Graph Metadata cho từng bài viết và page.
Theo mặc định, All In One SEO sẽ sử dụng tiêu đề và mô tả của bài viết để làm dữ liệu cho Open Graph. Bạn cũng có thể thiết lập hình thumbnail cho Facebook thủ công cho từng bài viết và page.
Để làm điều này, chỉ cần chỉnh sửa bài viết hoặc page, sau đó kéo xuống dưới phần All In One SEO bên dưới trình chỉnh sửa. Từ đây, bạn chuyển sang tab Social và điền vào các dữ liệu metadata cho Open Graph. Bạn có thể thiết lập hình thumbnail cũng như tiêu đề và mô tả.
Phương pháp 2. Thiết lập Facebook Open Graph Meta Data bằng Yoast SEO
Yoast SEO là một plugin WordPress SEO tuyệt vời mà bạn có thể sử dụng để chèn thêm các dữ liệu open graph metadata vào WordPress.
Điều đầy tiên bạn cần làm là cài đặt và kích hoạt plugin Yoast SEO. Để biết thêm chi tiết, hay tham khảo hướng dẫn chi tiết của chúng tôi về cách cài đặt plugin WordPress .
Sau khi được kích hoạt, bạn cần truy cập SEO » Social và tích vào hộp Add Open Graph metadata.
Bạn có thể lưu cài đặt ngay hoặc tiếp tục cấu hình các thiết lập khác cho Facebook.
Bạn có thể nhập Facebook app ID của mình vào nếu bbanj sử dụng Facebook page và cần thêm dữ liệu cho Facebook insights. Bạn cũng có thể thay đổi dữ liệu Open Graph cho tiêu đề, mô tả và hình thumbnail cho trang chủ.
Cuối cùng, bạn có thể thiết lập một hình ảnh mặc định, hình ảnh này sẽ được dùng khi trong bài viết hoặc page không có ảnh đại diện nào.
Yoast SEO cũng cho phép bạn cài đặt Open Graph metadata cho từng bài viết và page cụ thể. Tương tự phần trên, bạn chỉ cần chỉnh sửa một bài viết hoặc page và kéo xuống phần SEO bên dưới trình editor.
Từ đây, bạn có thể đặt hình thumbnail của Facebook cho bài đăng hoặc trang đang được chỉnh sửa. Nếu bạn không đặt tiêu đề hoặc mô tả cho bài viết, plugin sẽ sử dụng tiêu đề và mô tả meta SEO của bạn.
Bây giờ bạn có thể lưu bài đăng hoặc trang của mình và plugin sẽ lưu trữ dữ liệu Open Graph metadata của bạn.
Phương pháp 3. Thêm dữ liệu Facebook Open Graph Meta Data vào theme WordPress một cách thủ công
Phương pháp này yêu cầu bạn chỉnh sửa các file trong theme của mình, do đó trước khi thực hiện hãy đảm bảo rằng bạn đã có một bản sao lưu dự phòng.
Sau đó, chỉ cần sao chép và dán đoạn mã này vào file functions.php của theme hoặc vào một site specific plugin đang sử dụng.
//Adding the Open Graph in the Language Attributes
function add_opengraph_doctype( $output ) {
return $output . ' xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml"';
}
add_filter('language_attributes', 'add_opengraph_doctype');
//Lets add Open Graph Meta Info
function insert_fb_in_head() {
global $post;
if ( !is_singular()) //if it is not a post or a page
return;
echo '<meta property="fb:app_id" content="Your Facebook App ID" />';
echo '<meta property="og:title" content="' . get_the_title() . '"/>';
echo '<meta property="og:type" content="article"/>';
echo '<meta property="og:url" content="' . get_permalink() . '"/>';
echo '<meta property="og:site_name" content="Your Site NAME Goes HERE"/>';
if(!has_post_thumbnail( $post->ID )) { //the post does not have featured image, use a default image
$default_image="http://example.com/image.jpg"; //replace this with a default image on your server or an image in your media library
echo '<meta property="og:image" content="' . $default_image . '"/>';
}
else{
$thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'medium' );
echo '<meta property="og:image" content="' . esc_attr( $thumbnail_src[0] ) . '"/>';
}
echo "
";
}
add_action( 'wp_head', 'insert_fb_in_head', 5 );
Lưu ý: Hãy nhớ thay đổi teen website của bạn ở phần Your Site Name Goes Here. Sau đó, thay đổi URL hình ảnh mặc định bằng hình ảnh của bạn. Cuối cùng, bạn cần thay Facebook app ID của mình vào trong đoạn mã. Nếu bạn không dùng Facebook app, hãy xóa dòng Your Facebook App ID đi.
Chúng tôi khuyên bạn nên đặt một hình ảnh mặc định với logo của bạn, khi đó các bài viết không có thumbnail sẽ sử dụng hình ảnh này.
Ngay sau khi bạn lưu file functions.php hoặc plugin, website của bạn sẽ bắt đầu chứa các dữ liệu Facebook open graph ở phần header của WordPress.
Chúng tôi hy vọng bài viết này đã giúp bạn biết cách thêm dữ liệu open graph metadata của Facebook vào WordPress. Bạn cũng có thể xem thêm bài tổng hợp của chúng tôi về các plugin mạng xã hội tốt nhất cho WordPress để tăng tương tác, và bài viết hướng dẫn khắc phục lỗi thumbnail của Facebook trên WordPress.
Nếu thích bài viết này, hãy đăng ký Kênh YouTube của chúng tôi để xem video hướng dẫn nhé. Bạn cũng có thể tìm thấy chúng tôi trên Twitter và Facebook để cập nhật các thông tin mới nhất từ CunghocWP.