I write my Open Graph tags by hand in the page code. What common mistakes does the tool help avoid?
Four come up again and again: an & or a quote in the title that breaks the tag, using name where the protocol expects property, relative page or image links, and forgetting one of the four required properties. The builder escapes every value, writes property for og: tags and name for twitter: tags, and warns about links and missing properties.
Mistake one: characters that break the tag
When you type a tag by hand, the value sits between quotation marks. If the title contains a quote, the value ends halfway through and the rest of the title is lost. An & or an apostrophe can also be read in unexpected ways. We gave the builder a title with an apostrophe and an &, and a URL with two parameters joined by &, and everything came out escaped:
<meta property="og:title" content="Ahmed's Oud & Musk">
<meta property="og:url" content="https://example.com/gifts?size=small&wrap=yes">
Notice the URL needs escaping inside the tag too, which is easy to forget by hand. Browsers and platforms decode & back to & when they read it, so the link stays correct.
Mistake two: name or property?
Open Graph tags use the property attribute, while Twitter tags usually use name. Mixing them up is common when you copy a line and edit it. The builder writes each kind its own way without you having to think about it:
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary_large_image">
Mistakes three and four: relative links and forgotten properties
- A relative page URL such as /gifts is rejected; the builder asks for a full address, because a platform cannot tell your site from a path alone.
- A relative image URL such as /images/gift.jpg is written as typed, but with a warning that most platforms cannot fetch it. In our example that warning appeared, along with a second one because we wrote no alt text.
- If you forget the title, URL or image, the builder warns that the property is required by the protocol. og:type it always writes.
- Text over 2,000 characters and URLs over 2,048 characters show an error.
How to do it
- Instead of typing lines in your editor, fill the fields in the Open Graph metadata builder with plain text as you want it to appear, with no escaping.
- Read the warnings under the fields and fix what is needed.
- Copy the tags or download them as an HTML file, and paste them into the page head in place of your hand-written lines, not beside them.
- Open the page source after saving and confirm each property appears once.
What the builder does not do: it never opens your page or reads the tags already in it, so it cannot spot an old duplicate. It also does not write the search title tag; try that in the Search snippet preview. And platforms cache cards for a while, so your fix may not show straight away.
Common questions
Should I type & myself in the title field?
No. Type a plain &, and the builder escapes it. If you type & yourself it becomes &amp;.
Does the builder escape Arabic text?
Arabic letters need no escaping and are written as they are. Only the special characters are converted.
Can I edit the tags after copying?
Yes, but it is easier to edit in the builder and copy again, so the escaping stays right.