Web Component

As another option for embedding comments client-side, you can use the dedicated web component. Load the script and render the custom element, passing in your API key along the way. See a live demo here.

<script src="https://unpkg.com/@jam-comments/component"></script>

<jam-comments data-api-key="123|your-api-key">
</jam-comments>

By default, the component will use the current path and domain for pulling & submitting comments. You can also define them explicitly, as well as define a callback to fire after the form has been initialized.

<script>
    window.commentsInitialized = () => console.log("initialized!");
</script>

<jam-comments
    data-api-key="123|your-api-key"
    data-domain="urmom.com"
    data-path="/my-blog-post"
    data-date-format="m/d/Y"
    data-initialized-callback="window.commentsInitialized">
</jam-comments>

Configuration Properties

Configuration Property Name	Description
path (optional)	The path for which you’re loading and accepting comments. If not provided, the current page path will be used.
domain (optional)	The domain for your site as configured in your account. Don’t include the protocol (“https”). If not provided, the current page domain will be used.
api-key	The API generated in your account settings.
environment (optional)	The environment JamComments will use to determine if it should render dummy comments. Must be either “production” or “development.” If not provided, “production” will be used.
date-format	Optional. The default format for comments is m/d/Y. If you’re from another country, that might be weird. So, you can customize it by using the dateFormat option. Note that the format must follow PHP’s DateTime standards.

Trade-Offs

Keep in mind that loading the comment form client-side will have a marginal impact on your page’s performance. Additionally, search engines may not be able to crawl your comment content as efficiently as server-rendered content.

Still, this approach can be the preferred, flexible option for embedding JamComments on your site.