• Menu
  • Skip to right header navigation
  • Skip to main content
  • Skip to primary sidebar
  • Skip to footer

VANMY.NET

  • Home
  • WordPress
    • Plugins
    • Themes
  • SEO
    • Onpage
    • Offpage
  • Social Media
    • Google Plus
    • Facebook
  • Blogging
    • Domain
    • Hosting
    • Khác
  • Liên hệ
  • Site map
  • Home
  • WordPress
    • Plugins
    • Themes
  • SEO
    • Onpage
    • Offpage
  • Social Media
    • Google Plus
    • Facebook
  • Blogging
    • Domain
    • Hosting
    • Khác
  • Liên hệ
  • Site map
You are here: Home / Social Media / Facebook / Open Graph là gì?
Open graph là gì, open graph la gi
Open graph la gi

Open Graph là gì?

Đối với những webmaster thường hay tiếp xúc với mạng xã hội Facebook thì họ không còn lạ lẫm với Open Graph.

Giới thiệu về Open Graph

Open graph là gì, open graph la gi
Open graph la gi

Giao thức Open Graph được tạo bởi Facebook, với chức năng làm cho bất kỳ trang web nào cũng có thể có các chức năng tương tự như các đối tượng (object) trên Facebook, hay với chức năng làm cho nội dung của website chúng ta dễ dàng được nhận ra bởi các mạng xã hội, khi ai đó chia sẻ nội dung của chúng ta thì với việc sử dụng Open Graph, mạng xã hội có thể hiển thị thông tin chính xác về nội dung được chia sẻ.

Bạn có thể kiểm tra đầy đủ tại trang web của Open Graph.

Ví dụ về việc sử dụng Open Graph cho WordPress

Sử dụng Open Graph cho website WordPress như thế nào, dưới đây là một ví dụ về việc chúng ta sẽ lấy tiêu đề, trích đoạn (excerpt), URL và hình ảnh thumbnail của bài viết và sử dụng chúng như Metadata của Open Graph.

Nhưng đầu tiên giải thích tại sao chúng ta lại chọn ví dụ này, vì chức năng này khá quan trọng, mỗi lần chia sẻ thông tin thì Facebook sẽ hiển thị Title, URL, Thumbnail và trích đoạn chuẩn theo nội dung của bài viết gốc.

Chúng ta sẽ sử dụng các Open Graph metadata như sau:

function wptuts_opengraph_for_posts() {
    if ( is_singular() ) {
        global $post;
        setup_postdata( $post );
        $output = '<meta property="og:type" content="article" />' . "\n";
        $output .= '<meta property="og:title" content="' . esc_attr( get_the_title() ) . '" />' . "\n";
        $output .= '<meta property="og:url" content="' . get_permalink() . '" />' . "\n";
        $output .= '<meta property="og:description" content="' . esc_attr( get_the_excerpt() ) . '" />' . "\n";
        if ( has_post_thumbnail() ) {
            $imgsrc = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'medium' );
            $output .= '<meta property="og:image" content="' . $imgsrc[0] . '" />' . "\n";
        }
        echo $output;
    }
}
add_action( 'wp_head', 'wptuts_opengraph_for_posts' );

Đoạn code này sẽ chèn các Open Graph metadata vào trong cặp thẻ <head>.  Dán đoạn code trên vào vị trí cuối cùng của file functions.php của themes bạn đang dùng. Hãy xem mã nguồn trang web thay đổi (nằm trong cặp thẻ <head>) trước và sau khi dán đoạn code này vào.

Tiếp theo, chúng ta cập nhật phần thẻ mở <html> của WordPress

Phần thẻ <html> mặc định như sau:

<html <?php language_attributes(); ?>>

Chúng ta sẽ đổi thành:

<html <?php language_attributes(); ?> prefix="og: http://ogp.me/ns#">

Tiến hành Save lại.

Đến đây là xong rồi, các bài viết, page đã tương thích với Open Graph, đơn giản quá phải không. Bạn hãy thử test lại bằng việc chia sẻ một bài viết lên facebook và xem thử các thông tin Title, URL, Thumbnail và trích đoạn hiển thị đó có chuẩn (khác với lúc chưa sử dụng Open Graph) hay không :sexy:

Chúc bạn thành công!

Bài viết liên quan:

  1. Tăng cường sức mạnh của mạng xã hội cho WordPress
Previous Post: «hightlight comment wordpress Cách làm nổi bật màu nền comment trong WordPress
Next Post: Tăng cường sức mạnh của mạng xã hội cho WordPress Wordpress va mang xa hoi»

Reader Interactions

Comments

  1. BiBi

    April 29, 2013 at 11:46 am

    Link author bị dư cái chữ h ngay https kìa bạn:

    Mà sao web bạn lại không dùng Open Graph vậy? bạn có thể cho mọi người biết tại sao không.

    p/s: nếu có thể bạn email cho mình nhé, vì đôi lúc mình comment nhiều bài trên Internet, mình không thể nhớ hết các đã comment ở đâu để bậc xem lại được, hic 😥

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

Xem nhiều

Cách cấu hình và cài đặt WordPress trên host server

Cách sử dụng FileZilla FTP Client để upload file lên host

Cách cấu hình và cài đặt WordPress trên máy tính với Xampp

Cách nhắn tin sms miễn phí

Cách nhắn tin SMS miễn phí không tốn tiền

phat wifi tu laptop

Cách sử dụng wifi iphone từ wifi của laptop trên win 7

Wordpress

Phiên bản Wordpress 4.0

WordPress cho phép cập nhật phiên bản 4.0

Open graph là gì, open graph la gi

Open Graph là gì?

Cách tạo menu thả xuống cho themes WordPress

Facebook for WordPress Plugin

Facebook for wordpress plugin

Cài đặt các chức năng của plugin Facebook

SEO

copyer hay copywriter

Đừng là copier mà hãy là một copywriter bậc thầy

google cap nhat thuat toan panda penguin 2013

Google cập nhật thuật toán Panda, Penguin tháng 3-2013

test toc do website chinh xac nhat

5 tools kiểm tra tốc độ website chính xác nhất

phuong phap xay dung lien ket tu nhien

Phương pháp xây dựng liên kết tự nhiên khi SEO

seo nhu mot chiec banh

Cách seo vượt qua thuật toán ngựa vằn (zebra) của Google

Footer

Categories

  • Blogging
  • Domain
  • Facebook
  • Google
  • Google Plus
  • Hosting
  • Khác
  • Pagerank
  • Plugins
  • SEO
  • SEO Offpage
  • Social Media
  • Themes
  • Thư giãn
  • Tin tức
  • Tips
  • Wordpress

Bạn bè

  • Học seo
  • Hoc Thiet Ke Web
  • Nguồn Game
  • Thạch Phạm Blog

dịch vụ thành lập doanh nghiệp tại đà nẵng | Blog Giá Rẻ

Copyright 2009 by vanmy.net