0.2.1 • Public • Published

    Gatsby PLUGIN Commentator

    This plugin adds comment feature to a GatsbyJS website. The goal is to abstract out all the details for posting and storing of comments in a GatsbyJS website.

    It gives a barebone commenting system which gives the developer consuming this plugin the total control of the look and feel of gatsby-plugin-commentator elements.

    Kindly star it if you find it useful! Gracias!!!


    See it here


    npm install gatsby-plugin-commentator
    // or
    yarn add gatsby-plugin-commentator

    Include it among the plugins in the gatsby-config.js file of a GatsbyJS website project folder.

    module.exports = {
        plugins: [
            // ......
                resolve: "gatsby-plugin-commentator",
                {website: ""}

    Lastly, make a DOM element available at any component rendered with id="commentContainer"

    <!-- Single post listing page -->
    <section id="commentContainer"></section>

    That's all!

    Component Classnames

    • commentator-comment-cont:

    • commentator-title: Classname for the <h2> element

    • commentator-comment-list: Classname for the parent <ul> of the comments

    • commentator-comment-list-item: Classname for the <li> element. It is a direct child of <ul class="commentator-comment-list">

    • commentator-comment-author: The className for the <div> holding the author of the comment.

    • commentator-comment-date: The className for the <span> holding the date.

    • commentator-comment-content: Classname for a div holding all the comment body/content.

    • commentator-comment-form: Classname for the <form> element

    • commentator-name-input: Classname for the <input name="name"> that collects the name of the commentator

    • commentator-comment-input: Classname for the <textarea name="content" /> that collects the comment content.

    • commentator-feedback: The className for the <span> elements that gives the state of a form during submission. It also supports .info for general information, .error for error feedback and .success for successful operation feedback.

    • commentator-comment-btn: The className for the form submit button.


    To load fresh comments, the server has to be restarted.

    Built with 💕💕💕 by Aleem Isiaka


    npm i gatsby-plugin-commentator

    DownloadsWeekly Downloads






    Unpacked Size

    11.4 kB

    Total Files


    Last publish


    • limistah