# OG images in Wix

Additional tags on static pages, Velo setMetaTags on dynamic item pages.

## Where it plugs in

For a static page Wix has a field for exactly this: Pages & Menu → the page's More Actions → SEO basics → Advanced SEO → Additional tags → + Add New Tag — meta and link tags only, up to 10 per page, with that page's address after ?url=. Dynamic item pages share one set of SEO settings, and their og:image defaults to the collection's primary image. To give each item its own card, turn on Dev Mode and put the snippet in the dynamic page's code: `wixLocationFrontend.url` is the item's address and `wixSeoFrontend.setMetaTags` sets the image tags. The setter overwrites the meta tags set earlier, so the snippet reads the current ones first — outside onReady, as Wix asks — and passes the rest back; returning the promise from onReady is what lets search bots see the result. On a free Wix site that address is username.wixsite.com/site-name/…, so that is the host to allow in the dashboard until you connect a domain.

`Dynamic item page → page code (Velo, Dev Mode on)`

```js
// Static pages need no code: Pages & Menu → More Actions → SEO basics →
// Advanced SEO → Additional tags → + Add New Tag:
//   <meta property="og:image" content="https://shareglint.com/u/acc_YOUR_ACCOUNT_ID.png?url=https%3A%2F%2Fwww.your-site.com%2Fabout">
//
// Dynamic item pages share one set of SEO settings, so the card is set here.
import wixSeoFrontend from 'wix-seo-frontend';
import wixLocationFrontend from 'wix-location-frontend';

const CARD = 'https://shareglint.com/u/acc_YOUR_ACCOUNT_ID.png?url=';
const REPLACED = ['og:image', 'og:image:width', 'og:image:height', 'twitter:image', 'twitter:card'];

// Wix asks for the getter OUTSIDE onReady to get the page's current tags.
const current = wixSeoFrontend.metaTags;

$w.onReady(() => {
  // The item's own address, without ?query or #hash.
  const page = wixLocationFrontend.url.split(/[?#]/)[0];
  const image = CARD + encodeURIComponent(page);

  // setMetaTags overwrites the meta tags set earlier: pass the others back.
  const kept = current.filter((tag) => !REPLACED.includes(tag.property ?? tag.name));

  // Returned, so search bots see the tags (onReady waits for this promise).
  return wixSeoFrontend.setMetaTags([
    ...kept,
    { property: 'og:image', content: image },
    { property: 'og:image:width', content: '1200' },
    { property: 'og:image:height', content: '630' },
    { name: 'twitter:card', content: 'summary_large_image' },
  ]);
});
```

## The trap

Wix does not let you add a meta tag it already creates for you, and it creates og:image when there is an image to fill it with: a Social share image on the page, or a General social image for the whole site (Site and Domain → Website settings). If Wix refuses your og:image in Additional tags, or the published source still shows its own, remove those images and try again — check the page source after publishing either way.

## How the image URL works

Nothing in your site calls an API: the crawler that reads the tag requests the image URL, and the first request reads the page's title, description and image and renders the card. Later requests get the same file. Only pages on the domains you allowed in the dashboard get an image — any other address answers 403 — so the URL holds no key. We re-read a page at most every 60 minutes, so a new title shows up within that time.

## What it costs

100 images a month free, then $9 for 2,000. A new card uses one image of your quota; the card is cached by what is on it, so an unchanged page is never charged twice, also when shared with ?utm_source=.
