I have simple jekyll blog where I would love to add comments.app widget.
Here is the code which I use to add the widget:
JavaScript
x
12
12
1
<h3>Comments:</h3>2
<script async src="https://comments.app/js/widget.js?3"3
data-comments-app-website="{{ site.comments.commentsapp-id }}"4
data-limit="{{ site.comments.limit }}"5
data-color="39C4E8" 6
data-dark="1">7
</script>8
<noscript>9
Comments not available if Javascript is blocked. This is the only function of10
this website which needs Javascript.11
</noscript>12
the site.comments.commentsapp-id is stored in my _config.yml and it is placed correctly in rendered result.
But the widget does not show on page. What did I do wrong ?
Update: In inspect element option I discovered this:
JavaScript
1
4
1
<iframe id="comments-app-Kh5zcvkB-1" src="https://comments.app/embed/view?website=my-id&page_url=%page/title%2F&origin=https://my-site.com&page_title=y-tittle&limit=5&color=39C4E8&dark=1" scrolling="no" style="overflow: hidden; border: medium none;" width="100%" height="0" frameborder="0">2
<head></head><body>Page url invalid</body>3
</iframe>4
Advertisement
Answer
Finally solved this problem. It was caused by relative canonical URL in head of document.
So I replaced this:
JavaScript
1
2
1
<link rel="canonical" href="{{ page.url }}">2
with this:
JavaScript
1
2
1
<link rel="canonical" href="{{ absolute_url }}">2
Now it works fine.