16 September, 2025
What Is Open Graph? How to Check and Set It Up

Have you ever shared a link on Facebook only to see the wrong image or title? That is exactly when you need Open Graph. So what is Open Graph and why is it so important? This article from MONA Media will help you understand the benefits of Open Graph and give detailed steps to check and set up Facebook Open Graph, so your website looks professional and SEO-ready on social platforms.
What is Open Graph?
Open Graph is an HTML protocol that lets you SEO Expert control how your articles display when posted to social networks like LinkedIn and Facebook,… making them look polished and professional. In other words, you can decide the title, description and thumbnail through Open Graph meta tags (OG Tags), instead of letting Facebook or other platforms pick them at random.
For example: if you want to share an article about how to use Chat GPT for SEO, you can create Open Graph tags like this:
<meta property=”og:title” content=”How to Use Chat GPT for SEO and Prompts for SEO-Standard Writing” />
<meta property=”og:description” content=”Updated 2026 guide to GPT SEO, helping you work more efficiently and grow your website traffic sustainably.” />
<meta property=”og:image” content=”https://domain.com/uploads/seo-gpt.jpg” />
Where:
- og:title: The title you want to show when shared.
- og:description: A short, appealing description.
- og:image: A featured image that draws users to click the link.
This way, when you share a link, your content looks complete and professional, making a strong impression from the very first appearance.
Why set up Open Graph for your website?
For businesses focusing on SEO and building their brand online, setting up Open Graph is a must, because this meta tag brings many strategic benefits. So what are the benefits of adding Open Graph?
- Look professional: When your website is shared on Facebook, Zalo or LinkedIn, the title, description and image all display consistently and correctly. This helps your business build a the brand image professional, trustworthy image from the first time customers see it.
- Better user experience: A post with a clear title, a concise description and an attractive image helps viewers grasp the content without spending extra time. This convenience makes them more likely to stay longer and engage more with your brand.
- Stay in control of your content when shared: No more posts showing the wrong image, an outdated description or a dull title. With the Open Graph protocol, you fully control how your website is seen on social networks, and avoid losing points with customers over an unprofessional display detail.
- Increase visibility on Facebook: Open Graph tags do more than make the display look good. They also help Facebook understand the structure and content of your article. As a result, when users search keywords on Facebook, the system prioritizes content that has been shared a lot, along with data taken directly from OG Tags.
- Boosting SEO performance: Although Facebook Open Graph does not directly improve your Google rankings, it does lead to more shares, more engagement, and more organic traffic from social networks. All of these are positive signals that build your website's credibility and overall SEO strength.
- Raising click-through rate (CTR) and the quality of your traffic: Among the countless posts in a newsfeed, a link optimized with OG Tags, a sharp image, and an appealing description will stand out and get more clicks. It is a simple but effective way for a business to bring more quality traffic to its website.
You may also be interested in: 8+ ways to drive traffic from Instagram simple but effective
According to the latest update, Facebook publishes up to 17 Open Graph meta tags, but only a handful are core protocols that directly decide how your website looks when shared. To find out which Open Graph properties matter most, read the sections below:
og:title
og:title defines the title shown when your post or web page is shared on Facebook, Zalo, LinkedIn, or any platform that supports Open Graph Facebook.
Example: <meta property=”og:title” content=”SEO Strategy 2026: Optimize Your Website to Break Through on Revenue” />
Best practices:
- Apply it to every page that may be shared.
- Keep the title short, clear, and engaging, ideally 40 – 60 characters long.
- Write an accurate, appealing title to raise the click-through rate (CTR) from social media.
og:url
og:url specifies the exact URL of the page. This tag is important to avoid duplicated share data when one piece of content has several URLs (for example, URLs with parameters).
Example: <meta property=”og:url” content=”https://www.mona.media/chien-luoc-seo-2026″ />
Best practices: Always use the canonical URL to consolidate data (shares, likes, comments) under a single address.
og:image
Of all the OG Tags, og:image has the strongest influence. It sets the thumbnail shown when the link is shared, and it is what grabs users at first glance.
Example: <meta property=”og:image” content=”https://mona.media/uploads/open-graph.jpg” />
Best practices:
- Use an image directly related to the content of the post or product page.
- Make sure the image is at least 1200 x 630 px, with a 1.91:1 ratio, so it looks sharp on every device.
og:type
og:type tells platforms what type of content the page holds, so Facebook can display it in the right context. For example, if you set og:type to article, Facebook adds details such as the author and publish date.
Example: <meta property=”og:type” content=”article” />
Best practices:
- For blog posts or news, set og:type to article.
- For a business or brand website, you can choose website.
- Combine it with other tags such as og:title, og:image, and og:description for full optimization when sharing on social media.
og:locale (optional tag)
The og:locale tag lets you define the language and region your content is aimed at. This way, platforms like Facebook can show your post to the right audience for each language or country.
Example: <meta property=”og:locale” content=”vi_VN” />
In the example above, vi_VN means the content is written in Vietnamese for users in Vietnam. The locale value usually follows the format <language>_<country>, for example ja_JP for Japanese in Japan.
Best practices:
- If your website is in Vietnamese, choose vi_VN to make sure it displays correctly.
- By default, Facebook treats content without og:locale as US English (en_US), so you only need to add this tag when your content is in another language.
- For multilingual websites, set the matching og:locale for each version so the content always reaches readers in each market.
og:description (optional tag)
This property gives a short summary of the page. Although optional, og:description plays an important role in convincing users to click.
Example: <meta property=”og:description” content=”A guide to using Open Graph meta tags to optimize how your website appears on social media.” />
Best practices:
- Write a description meta description of 100 – 200 characters that is concise, engaging, and accurately reflects the page.
- Write a unique description for each page to avoid duplication.
- When you update your website content, remember to update the description so it stays accurate.
Besides the basic Open Graph tags, you can also use some advanced properties to extend how your website appears on social media, such as:
- og:audio: Used to add a link to an audio file.
- og:video: Lets you add a link to a video file.
- og:description: Gives a more detailed description of the page when it is shared.
- og:determiner: Sets how the article is displayed, such as a, an, the, or “auto”, before the object title.
- og:site_name: Shows the overall site name, useful when your page belongs to a larger system or brand.
How to install Open Graph on your website
To optimize how your content looks when shared on social media, you can set up the Open Graph protocol for your website in two ways: using plugin SEO WordPress or inserting it manually with code. Both methods are simple and easy to carry out, so choose the one that fits your needs and platform.
Steps to use a plugin in WordPress
If your website runs on WordPress, the fastest way to add Open Graph meta tags is through a plugin Yoast SEO:
- Step 1: Go to the Social section of your website and select Facebook, then choose Enabled.
- Step 2: In the Facebook Insights and admins, then enter your APP ID in the Facebook App ID field. If a post has no featured image, Facebook will automatically use the image from the Image URL field you set.
- Step 3: Click Save Changes to save the settings.
From now on, when you share a link, Facebook will pull the title, description, and image correctly thanks to the Open Graph Facebook tags.
Steps to add Open Graph manually
If you prefer not to use a plugin, you can still add Open Graph meta tags directly to your website with these simple steps:
Step 1: Open the functions.php file, then add the code below inside the <?php ?>
function doctype_opengraph($output) {
return $output . ‘
xmlns:og=”http://opengraphprotocol.org/schema/”
xmlns:fb=”http://www.facebook.com/2008/fbml”‘;
}
add_filter(‘language_attributes’, ‘doctype_opengraph’);
Step 2: This code is automatically inserted into the <head> tag of your website. Next, add the following code:
function fb_opengraph() {
global $post;
if(is_single()) {
if(has_post_thumbnail($post->ID)) {
$img_src = get_the_post_thumbnail_url(get_the_ID(),’full’);
} else {
$img_src = get_stylesheet_directory_uri() . ‘wp-content/uploads/2026/08/open-graph-la-gi-cach-cai-dat-open-graph-toi-uu-cho-website.jpg’;
}
if($excerpt = $post->post_excerpt) {
$excerpt = strip_tags($post->post_excerpt);
$excerpt = str_replace(“”, “‘”, $excerpt);
} else {
$excerpt = get_bloginfo(‘description’);
}
?>
<meta property=”og:title” content=”<?php echo the_title(); ?>”/>
<meta property=”og:description” content=”<?php echo $excerpt; ?>”/>
<meta property=”og:type” content=”article”/>
<meta property=”og:url” content=”<?php echo the_permalink(); ?>”/>
<meta property=”og:site_name” content=”<?php echo get_bloginfo(); ?>”/>
<meta property=”og:image” content=”<?php echo $img_src; ?>”/>
<?php
} else {
return;
}
}
add_action(‘wp_head’, ‘fb_opengraph’, 5);
Step 3: Add the Open Graph tags to your website by inserting this code:
<meta property=”og:title” content=”<?php echo the_title(); ?>”/>
<meta property=”og:description” content=”<?php echo $excerpt; ?>”/>
<meta property=”og:type” content=”article”/>
<meta property=”og:url” content=”<?php echo the_permalink(); ?>”/>
<meta property=”og:site_name” content=”<?php echo get_bloginfo(); ?>”/>
<meta property=”og:image” content=”<?php echo $img_src; ?>”/>
Step 4: Use the statement below to declare the Open Graph meta tags:
add_action(‘wp_head’, ‘fb_opengraph’, 5);
Step 5: Attach the function you just created to the hook so the Open Graph tags are automatically inserted into the <head> section of your website.
So what is the fastest way to create Open Graph meta tags? If you want to generate Open Graph meta tags simply and save time, follow the instructions below:
Step 1: Choose an online Open Graph tag generator, such as:
- Duplichecker: https://www.duplichecker.com/open-graph-generator.php
- Small SEO Tools: https://smallseotools.com/open-graph-generator/
- Web Code: https://webcode.tools/open-graph-generator
Step 2: Fill in the required information (title, description, URL, and so on) in the matching fields, then press Enter to generate the code.
Step 3: Copy the generated code and paste it directly into your website's source code.
Setting up Open Graph correctly makes your website look better on social media, helps raise CTR, improves user experience, and strongly supports your overall marketing strategy . However, for lasting results, a business cannot stop at this technical optimization alone.
The professional website SEO services at MONA Media, we help you build a complete SEO strategy strategy, from optimizing your website infrastructure and running SEO Onpage/offpage work to using supporting tools such as Open Graph. That way, your website is not only friendly to Google but also attracts customers from many different channels.
At the same time, Facebook advertising services from MONA helps businesses turn content optimized with Open Graph into a powerful weapon on Facebook. Your ads will look clean and polished and reach the right potential customers, which raises engagement, lifts conversion, and makes better use of your budget.
To discuss in more detail and get the best solution for your business, contact MONA Media today.
What are common Open Graph errors?
When setting up Open Graph meta tags, many businesses run into errors that make shared links, especially on Open Graph Facebook, show wrong or missing information. Here are the two most common errors to watch for:
Facebook cannot load the image when a website link is shared
This is the most common error when setting up Open Graph meta tags: a Facebook user clicks a shared link from your website and sees no image, or just an empty frame. The usual causes are:
- The website is missing complete Open Graph meta data.
- The Facebook bot hits a cache or server connection problem while crawling.
Incorrect Open Graph Meta Tags error
This error happens when Open Graph meta tags have wrong syntax or miss key information. For example, you enter a wrong value in og:image or og:url, or leave og:title empty, so the content shows incorrectly or Facebook cannot recognize it.
FAQ
Can Open Graph be used for chatbots, mobile apps, or email?
Yes,, but each is used a little differently. Specifically:
- Chatbot (Zalo, Messenger): When a website link is sent, the platform automatically reads the OG Tags to show the title, image, and more.
- Email: Email clients hardly ever show an OG preview. However, if a recipient shares the website link from the email on social media, Open Graph still displays as normal.
- Mobile apps: The app needs to read OG data from the URL in order to show it.
How do you combine Open Graph with growth hacking techniques for a marketing campaign?
To use Open Graph for growth hacking, you can try these approaches:
- Optimize OG images and content to create a standout preview that draws clicks.
- Personalize OG tags by campaign, referral source, or customer group.
- Add OG to share buttons or chatbots to boost natural virality.
- Adjust OG by timing to trigger FOMO and drive action.
- A/B test several OG versions to find the message with the highest CTR.
Understanding what is Open Graph and applying the correct setup will raise CTR, improve user experience, and support SEO Google effectively. When your website looks good and correct on social media, your brand scores points at first glance. If you want your website to truly break through on Google and other platforms, contact MONA Media for free consulting and to receive detailed SEO quote .
FAQ
Does Open Graph affect Google SEO?
What is the standard Open Graph image size?
Related articles
Professional website
design services
Own a website with a beautiful, 100% exclusive design and a lifetime warranty, with the ability
to expand features flexibly as your business grows, starting today!































Free AI courses
AI tools at work
VI
EN


