Để tối ưu hóa chia sẻ trên Facebook, bạn có thể dễ dàng thêm Facebook Open Graph meta data vào các theme WordPress. Điều này giúp Facebook hiểu và hiển thị đúng thông tin khi bài viết của bạn được chia sẻ. Để hiểu rõ hơn về vấn đề này, hãy cùng Vietnix tìm hiểu thông qua bài viết “cách thêm Facebook Open Graph meta data vào các theme WordPress”.
1. Thêm Facebook Open Graph meta data vào các theme WordPress bằng AIOSEO
All in One SEO là một plugin SEO phổ biến được sử dụng bởi hơn 3 triệu trang web WordPress. Chúng 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 truyền thô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, xem hướng dẫn từng bước của chúng tôi về cách cài đặt plugin WordPress.
Xem thêm: Hướng dẫn cách cài đặt plugin WordPress
Sau khi kích hoạt, bạn cần truy cập vào trang All in One SEO > Social Networks . Ở đây, bạn có thể nhập URL trang Facebook và tất cả các mạng xã hội khác.
Tiếp theo, nhấp vào tab Facebook ở phía trên trang, và bạn sẽ thấy rằng Open Graph Markup được bật mặc định.
Bạn có thể nhấp vào nút Upload or Select Image để chọn một hình ảnh Open Graph mặc định nếu một bài viết không có hình ảnh Open Graph.
Nếu bạn kéo xuống, bạn có thể tùy chỉnh tên trang web, mô tả và nhiều cài đặt khác. Đừng quên nhấp vào nút Save Changes màu xanh sau khi hoàn tất.
Bây giờ bạn đã thiết lập các thẻ Open Graph cho toàn bộ trang web, bước tiếp theo là Open Graph metadata cho từng bài viết và trang riêng biệt.
AIOSEO 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ể thay đổi thumbnail Facebook cho mỗi trang và bài viết một cách thủ công.
Để làm điều này, bạn 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, hãy chuyển sang tab Social, và bạn sẽ thấy một bản xem trước của thumbnail.
Bạn có thể thiết lập hình ảnh cho mạng xã hội ở đây, cũng như tiêu đề và mô tả.
Chỉ cần kéo xuống đến field Image Source. Bạn có thể chọn sử dụng featured image, tải lên hình ảnh tùy chỉnh hoặc sử dụng các tùy chọn khác.
2. Thêm Facebook Open Graph meta data vào các theme WordPress bằng Yoast SEO
Yoast SEO là một plugin SEO WordPress khác mà bạn có thể sử dụng để thêm Facebook Open Graph metadata cho bất kỳ trang web WordPress nào.
Điều đầu tiên bạn cần làm là cài đặt và kích hoạt plugin Yoast SEO. Sau khi kích hoạt, bạn cần truy cập vào SEO > Social và chọn tùy chọn Enabled dưới Add Open Graph meta data.
Bạn có thể lưu các thiết lập hoặc tiếp tục và cấu hình các tùy chọn xã hội khác của Facebook.
Bạn có thể cung cấp một ID ứng dụng Facebook nếu bạn sử dụng nó cho trang Facebook và insights của mình. Bạn cũng có thể thay đổi tiêu đề, mô tả và hình ảnh meta Open Graph trang chủ.
Cuối cùng, bạn có thể đặt một hình ảnh mặc định sẽ được sử dụng khi không có hình ảnh nào được đặt cho một bài viết hoặc trang.
Yoast SEO cũng cho phép bạn đặt Open Graph metadata cho từng bài viết và trang cụ thể. Đơn giản chỉnh sửa một bài viết hoặc trang và cuộn xuống phần Yoast SEO dưới trình soạn thảo.
Từ đây, bạn có thể đặt một hình ảnh xem trước Facebook cho bài viết hoặc trang cụ thể đó. Nếu bạn không đặt tiêu đề hoặc mô tả cho bài viết, thì plugin sẽ sử dụng tiêu đề và metadata SEO.
Bạn có thể lưu bài viết hoặc trang của mình, và plugin sẽ lưu trữ Facebook Open Graph metadata.
3. Thêm Facebook Open Graph meta data vào các theme WordPress bằng code
Phương pháp này yêu cầu bạn chỉnh sửa các file theme của mình, vì vậy hãy đảm bảo bạn sao lưu các file theme trước khi thực hiện bất kỳ thay đổi nào. Để hiểu thêm về cách làm, bạn có thể tham khảo bài viết sau:
Sau đó, chỉ cần sao chép và dán code này vào file functions.php của theme hoặc thêm đoạn code bằng cách sử dụng plugin WPCode.
Đầu tiên, cài đặt và kích hoạt plugin WPCode. Sau khi kích hoạt, bạn có thể truy cập Code Snippets > + Add Snippet từ bảng điều khiển WordPress. Bạn cần di chuột qua đoạn code đầu tiên được ghi là Add Your Custom Code (New Snippet) và nhấp vào nút Use snippet.
Điều này sẽ tạo một snippet mới, nơi bạn sẽ cần nhập tiêu đề và chọn loại code PHP Snippet. Sau đó, bạn cần dán code sau vào phần Code Preview:
//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 );
Hãy nhớ thêm tên trang web của bạn vào line 17, nơi có chữ “Your Site Name Goes Here“. Sau đó, bạn nên thay đổi URL ảnh mặc định ở line 19 bằng một trong các URL ảnh.
Vietnix đề xuất đặt một hình ảnh với logo của bạn ở đó, để khi bài viết của bạn không có thumbnail, thì nó sẽ hiển thị logo của trang web.
Bạn cũng cần thêm Facebook App ID của riêng vào line 13. Nếu không có Facebook App, thì bạn có thể loại bỏ line 13 khỏi code.
Sau khi bạn hoàn tất cập nhật code, bạn cần chuyển chế độ của đoạn code sang Active và nhấp vào nút Save Snippet. Bây giờ, theme của bạn sẽ bắt đầu hiển thị Facebook Open Graph metadata trong phần header của WordPress.
Ngoài ra thêm Facebook Open Graph meta data vào các theme WordPress, bạn cũng có thể tham khảo thêm bài viết sau:
Lời kết
Tóm lại, việc thêm Facebook Open Graph meta data vào các theme WordPress là một cách hiệu quả để tối ưu hóa chia sẻ trên Facebook và làm cho trang web của bạn trở nên chuyên nghiệp và hấp dẫn hơn đối với người dùng. Hy vọng bài viết này đã giúp bạn thêm dữ liệu Open Graph của Facebook vào WordPress. Ngoài ra, bạn cũng có thể tham khảo thêm các bài viết khác như sửa lỗi oEmbed của Facebook và Instagram trong WordPress hoặc cách sửa lỗi hiển thị hình ảnh trên Twitter trong WordPress dễ dàng tại Vietnix.vn để biết thêm nhiều kiến thức hữu ích, chúc bạn thành công!