Webey — Build professional websites without code
SEO

Setting Up Meta Tags and Open Graph in Webey

Learn how to set up meta tags, Open Graph, and canonical URLs in Webey for better findability and social sharing.

Meta tags are invisible pieces of information in your page's source code that tell search engines and social media what your page is about. Properly configured meta tags improve your findability in Google and ensure your page looks attractive when someone shares a link on Facebook, LinkedIn, or X (Twitter). In this article, we explain step by step how to set up meta tags in Webey.

What Are Meta Tags?

Meta tags are HTML elements in your page's <head> that are not visible to visitors but are read by search engines and social platforms. The most important meta tags are:

  • Meta title: the title displayed in Google search results and in the browser tab.
  • Meta description: a short summary that appears below the title in search results.
  • Open Graph tags: tags that determine how your page looks when shared on social media.
  • Canonical URL: tells search engines which version of a page is the original, to prevent duplicate content issues.

Setting the Meta Title Per Page

The meta title is the single most important element for SEO. Here's how to set it per page in Webey:

  • Open the page in the editor.
  • Click on Page Settings (the gear icon) in the toolbar.
  • Fill in the Meta Title field.
  • Keep the title under 60 characters — longer titles get truncated in search results.

Best practices for meta titles:

  • Place your most important keyword at the beginning of the title.
  • Make the title unique for each page — never use the same title on multiple pages.
  • Add your brand name at the end, separated by a dash: "Responsive Design Tips - Webey".
  • Write for people, not for search engines. The title should be click-worthy.

Writing a Meta Description

The meta description appears as the text snippet below the title in Google. Although Google doesn't directly use it as a ranking factor, a good description does influence your click-through rate (CTR).

  • Go to Page Settings and fill in the Meta Description field.
  • Keep the description under 160 characters — longer text gets cut off.
  • Summarize what the page is about and why someone should click.
  • Use an active writing style: "Learn in 5 steps how to optimize your Webey site for mobile" instead of "This article is about responsive design".
  • Avoid duplicate descriptions — every page deserves a unique description.

Open Graph Tags for Social Sharing

When someone shares a link to your page on Facebook, LinkedIn, or other social platforms, Open Graph (OG) tags are used to generate a preview. Webey supports the following OG tags:

  • og:title — the title displayed in the social share. By default, your meta title is used, but you can set a different title.
  • og:description — the description in the social share. By default, your meta description is used.
  • og:image — the image shown when sharing. This is the most impactful element of a social share.

Here's how to set the Open Graph image:

  • Go to Page Settings.
  • Upload an image in the OG Image field.
  • Preferably use an image of 1200x630 pixels — this is the ideal format for Facebook and LinkedIn.
  • Make sure the image is recognizable even as a thumbnail. Avoid text that's too small on the image.

Twitter Card

X (formerly Twitter) uses its own meta tags for link previews but falls back to Open Graph tags when no specific Twitter Card tags are set. Webey automatically adds the correct twitter:card meta tag (summary_large_image) based on your OG settings. If you've set an OG image, it will also be displayed correctly on X.

Setting the Canonical URL

A canonical URL tells search engines which version of a page should be considered the original. This is important when the same content is accessible via multiple URLs. In Webey, you set the canonical URL as follows:

  • Go to Page Settings.
  • Fill in the Canonical URL field with the full URL (including https://).
  • Leave this field empty if the current URL is the primary version — Webey will automatically set the canonical URL to the current page URL.

Canonical URLs are especially useful for multilingual sites. Webey automatically links translations via the translationOf field and adds hreflang tags, but the canonical URL ensures each language version points to itself as the primary source.

How Search Engines Use Meta Tags

Search engines like Google use meta tags to understand what your page is about and to determine how it appears in search results:

  • Meta title: displayed as the clickable link in search results. Google may rewrite it if the title doesn't match the search query well.
  • Meta description: displayed as the snippet. Google may also generate its own snippets based on the page content.
  • Canonical URL: helps Google determine the primary version of your content and prevents your site from being penalized for duplicate content.

Checking Results with Google Search Console

After setting up your meta tags, you can use Google Search Console to check how your pages appear in search results. Use the URL Inspection tool to see which meta title and description Google has indexed. If Google has rewritten your meta tags, it may be a signal that your title or description doesn't match the page content well enough.

Meta Tags Checklist

  • Set a unique meta title for each page (max 60 characters).
  • Write a unique meta description for each page (max 160 characters).
  • Upload an OG image of 1200x630 pixels for social sharing.
  • Check the canonical URL for pages accessible via multiple paths.
  • Test your social share preview with tools like opengraph.xyz or the Facebook Sharing Debugger.
  • Monitor your appearance in Google Search Console.