Get started with gitalk CDN

MIT licensed

Gitalk is a library that enables GitHub-style commenting on static websites.

Tags:
  • comment
  • plugin
  • lib
  • Github

Stable version

Copied!

How to start using gitalk CDN


<!DOCTYPE html>
<html>
<head>
  <title>Get started with gitalk CDN - cdnhub.io</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gitalk/dist/gitalk.css">
  <script src="https://cdn.jsdelivr.net/npm/gitalk/dist/gitalk.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/gitalk/examples/custom/mermaid-highlight.min.js"></script>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.css">
  <script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
</head>
<body>
  <div id="disqus_thread"></div>
  <script>
    const gitalkConfig = {
      clientID: 'YOUR_GITHUB_CLIENT_ID',
      clientSecret: 'YOUR_GITHUB_CLIENT_SECRET',
      repo: 'YOUR_GITHUB_REPO',
      owner: 'YOUR_GITHUB_USERNAME',
      labels: ['gitalk'],
      merge: true,
      issueEditLock: false,
      issueCommentNumber: 1,
      inputElement: document.createElement('textarea'),
      attributes: {
        'name': 'comment',
        'id': 'comment',
        'placeholder': 'Write a comment...',
      },
      onCommentAdded: (comment) => {
        console.log('New comment added:', comment);
      },
      onCommentLoad: (comments) => {
        console.log('Comments loaded:', comments);
        const container = document.querySelector('#disqus_thread');
        gitalk.render('disqus_thread', { comments });
      },
    };

    gitalk.init(gitalkConfig);
  </script>
</body>
</html>
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!

All versions