Open Graph Image - Configuration

Default Open Graph URL is the LibDoc’s Open Graph image. To assign your own default Open Graph URL, enter it into settings.json:

{
    "ogImageUrl": "https://<YOUR_OWN_PUBLIC_ABSOLUTE_URL>.jpg"
}

The Open Graph Image is a metadata image URL that is displayed when a link to a LibDoc page is shared into a social network. By default, LibDoc configuration ogImageUrl is used on every page but this parameter can be overridden on each page’s front matter with the same key ogImageUrl. Then you can customize each page of your project.

Open Graph Image URL is applied following these ordered priorities:

1. By default Open Graph Image URL’s value is libdocConfig.ogImageUrl if nothing is set into the front matter.
2. If ogImageUrl is set into the front matter and the page is not a blog post, page’s Open Graph Image URL gets this value.

Learn more about Open Graph.

Tag pages

It is possible to set a custom Open Graph Image URL to any tag. For example, assuming you have a tag called foo, then you have an URL /tags/foo, assigning an Open Graph image URL to this page can be set like follows through your settings.json:

{
    "ogImageUrlForEachTag": {
        "foo": "https://example.com/path/to/custom-open-graph-image.avif"
    }
}

For example on current website, you can view an example of a custom Open Graph Image for tag page change log on this website. Here are the involved lines from the settings.json file:

{
    "ogImageUrlForEachTag": {
        "changelog": "https://og-image.vercel.app/**11ty%20LibDoc%20Change%20Log**.png?theme=dark&md=1&fontFamily=source-sans-pro&fontSize=100px"
    }
}