Set absolute URL for og:image meta tags.
Sets absolute URLs for og:image
meta tags. This is required by the spec and relative URLs will not work on some sites such as Twitter.
You can fix this directly in parcel by using --public-url https://example.com
, however now all your URLs are hardcoded to absolute URLs which may be undesirable and can break things like prerendering.
This plugin uses the value of the og:url
meta tag to convert og:image
to an absolute URL.
npm install parcel-plugin-ogimage
Just install this package as a development dependency. Parcel will automatically call it when building your application.
You must have both og:image
and og:url
meta tags:
<meta property="og:image" content="card.png">
<meta property="og:url" content="https://example.com">
Parcel will generate that into something like this:
<meta property="og:image" content="/card.9190ce93.png">
<meta property="og:url" content="https://example.com">
parcel-plugin-ogimage
will then update the og:image
with an absolute URL:
<meta property="og:image" content="https://example.com/card.9190ce93.png">
<meta property="og:url" content="https://example.com">
MIT © Luke Childs