Attribute: page-id
The page-id attribute of the <comentario-comments> tag indicates the page path within the domain
The page-id attribute of the comments tag can be used to provide a mapping between path(s) and a page that displays embedded comments.
page-id must be a path under the page’s domain.Comentario uses it for the following two purposes:
- As the page’s identifier indicating which comments belong to that page, and
- As the actual page’s path, used, for instance, to create a link to the comment in email notifications.
Because it’s an identifier, it must uniquely represent the page. Multiple pages with the same identifier will share the same comment thread.
And since it’s also a path, it has to start with a slash (/) and resolve to a real URL — if necessary, by adding a redirect.
Use cases
This is most useful (or even required) in situations when you can’t simply rely on the page URL to render its comments:
- You have a multilingual website that has several versions of the same page, and you want all of them to share the same comments, for instance
htpps://example.com/en/product/123andhtpps://example.com/fr/product/123. - Your website applies query parameters that are completely irrelevant for rendering comments, such as
htpps://example.com/product/123?session-id=0e6e74d4-13f9-49e1-9049-91e40c185c17. - The page URL doesn’t change at the right moment or at all, for example, in a single-page application (SPA). Comentario doesn’t watch the browser URL: it reads it on initialisation and ignores any subsequent changes to it.
Changing the value on-the-fly
This attribute is reactive: changing it on an already-embedded tag reloads the page data and the comments for the new path, without recreating the element or reloading the browser page.
In an SPA you can therefore keep a single <comentario-comments> element around and point it at the current route on every navigation:
document.querySelector('comentario-comments').setAttribute('page-id', '/product/123');
Removing the attribute switches back to the path of the current browser URL.
