How to use the meta tag and open graph generator
- Enter a page title and a description. Counts under each box show how long they are.
- Add the canonical URL if the page has a preferred address, and choose a robots setting only if you need to change how the page is indexed.
- Under Social previews, add a title, description and image address for link previews, pick the content type and the Twitter card, and add your handle if you have one.
- Copy the HTML from the result box and paste it inside the head element of your page.
What each tag does
The title tag is the name shown on a browser tab and usually the headline of a search result. The description meta tag is a short summary that search engines and apps may show under the title. The canonical link tells search engines which address is the preferred one when the same page can be reached in several ways. The robots meta tag can ask for a page not to be indexed (noindex) or its links not to be followed (nofollow).
The viewport tag makes pages scale properly on phones, and the charset tag declares UTF-8 so accents and symbols display correctly. The theme color lets some mobile browsers tint their toolbar. Your language code is shown as a note, because the lang value belongs on the html element rather than in a meta tag.
Open Graph and Twitter cards
Open Graph tags, described at ogp.me, control how a link looks when it is shared in many apps: its title, description, image, address, type and site name. Twitter card tags do the same for X and apps that read them. If you leave the social title, description or address empty, the tool reuses your page title, description and canonical URL so you do not type them twice.
The image address must be a full address that starts with http:// or https://. The tool checks every address, color, language code and handle, and shows a message instead of output when something is wrong. Every value is escaped for HTML, so quotes, ampersands and angle brackets in your text cannot break the tag. You can match your page names with a slug generator, and add tracking to shared links with the UTM link builder.
Length and what to expect
There is no length that search engines or social apps always show. They shorten long titles and descriptions to fit their layout, and they sometimes write their own. The counts are there so you can keep titles and descriptions clear and brief, not because a certain number guarantees how they appear. Meta tags also do not decide ranking by themselves. Write for people who read the result.
Everything is made in your browser and nothing you type is sent anywhere. To keep crawlers away from folders, use the robots.txt generator.
Assumptions and limits
- The tags are generated from exactly what you type. The tool does not fetch your page or check that an image exists.
- Search engines and social apps may ignore or rewrite these tags.
- Twitter card tags are included only when you choose a card type. Open Graph tags are included when you fill in any social field or the page title or description.
- The page language code is shown as a note and is not a meta tag.
Frequently asked questions
Where do I paste the meta tags?
Paste them inside the head element of your HTML page, before the closing head tag. Content management systems and site builders usually have a field for custom head code.
Do I need both Open Graph and Twitter card tags?
Open Graph tags are read by many apps, while Twitter card tags are read by X and by some other apps. Including both is the safest choice, and the tool reuses your Open Graph text for the card so you only write it once.
What is a canonical URL?
It is the address you want search engines to treat as the main version of a page. It helps when the same content can be reached with different addresses, such as with and without tracking parameters.
Why does my shared link still show an old image?
Apps cache link previews. After you change the tags, the app may need to refresh its copy, which can take time or may need a debugging tool from that app.