hn-embed

Embed Hacker News comments into your site

Get the code

Basic usage

You can find a comment's ID by clicking on the time and looking for the id query parameter in the URL.

<blockquote 
  class='hacker-news-comment' 
  data-comment-id='2921983'>
</blockquote>
<script src='/path/to/hn-embed.min.js'></script>

Show title of parent post

<blockquote 
  class='hacker-news-comment' 
  data-comment-id='2921983'
  data-show-post-title='true'>
</blockquote>
<script src='/path/to/hn-embed.min.js'></script>

Fullwidth

<blockquote 
  class='hacker-news-comment' 
  data-comment-id='2921983'
  data-fullwidth='true'>
</blockquote>
<script src='/path/to/hn-embed.min.js'></script>

Specify width

The default width is 500px.

<blockquote 
  class='hacker-news-comment' 
  data-comment-id='2921983'
  data-width='300px'>
</blockquote>
<script src='/path/to/hn-embed.min.js'></script>

Run script manually

If you use the version of the script in the /manual-version folder in /dist, instead of running automatically when the page loads, it adds the hnEmbed function to window. You can optionally pass hnEmbed a CSS selector to only run the code within that selector.

<blockquote 
  class='hacker-news-comment' 
  data-comment-id='2921983'
  data-width='300px'>
</blockquote>
<script src='/path/to/hn-embed.min.js'></script>
<script>hnEmbed('.quotes')</script>

Error

<blockquote 
  class='hacker-news-comment' 
  data-comment-id='nonsense id'
  data-show-post-title='true'
  data-width='300px'>
</blockquote>
<script src='/path/to/hn-embed.min.js'></script>