You may have seen our Allow Access button. This is to allow browser to read cookies from third-party’s. In other words allow you to login to ReplyBox and comment whilst on your own website.

This requires authorisation to parse information between the 2. Chrome for example is more lenient and allows the parsing of information without requesting to do so, but iOS Safari for example or incognito Chrome doesn’t allow this so we need to explicitly ask.

Here’s an example of how we get it to work:

1. At this point you/the user are not logged in, so firstly you must sign in to tell the browser you want to interact with getreplybox.com and login
2. Once you are logged in you will be re-directed back to the same page and all will look the same. At this point you know you’ve logged in else there would have been an error so you now follow the next step and click “Allow Access”.

This then requests to share data between the 2 websites (you and us).

3. Once clicking “Allow”, the comments section will refresh again allowing you to comment as you’ve already signed in and then allowed access to your authorisation.

Unfortunately our hands are tied with how browsers have these security edge cases and this seems to be the only work around. We will keep looking into browser updates to see if this flow can be more intuitive in the future.

ReplyBox allows you to receive email notifications to keep up to date with the comments.

These are as follows:

Owner notification of comments made to ReplyBox

User notification of comments made in reply to your comment

User notification of comments made to a page that you have subscribed to
Page comment subscriptions can be found at the bottom of the embed as illustrated below.

We hope these cover all types of comment activity so you never miss another comment and stay up to date with your community.

Muting Notifications

Each embed can have notifications on/off, however this doesn’t apply to all notifications:

User subscribed notifications cannot be muted by embed owner, unless the subscribe button is removed via CSS.

User comment reply notifications cannot be muted by comment or embed owner either.

The above screenshot notification toggles are for embed owner notifications only, for both pending and approved comments.

ReplyBox allows site owners to translate the embed into a language of choice, we currently support the following:

• French (fr)
• German (de)
• Dutch (nl)
• Portugese (pt)
• Spanish (es)
• Czech (cz)
• Polish (pl)
• Lots more to come, let us know…

To use these languages you just need to parse the bracketed codes above into the lang parameter.

We allow custom CSS to be added to the embed so that you can change the colour to match the background of your website or even remove features you do not want.

This allows ultimate flexibility within the comment section. For example here is how we would set all the avatars to the same if you did not want your users to have their own.

Another example is our pinning function, you may want to emphasise pins even more, maybe you want to add a message at the top of the comments, you can see the difference here.

There are many things you can do, simply login to your ReplyBox, click the website you’d like to add CSS to click “Settings” and scroll down to the “Design” section.

Within this section you can also change the default font family if you didn’t want to use CSS and also remove our branding, although we’d love for it to stay

We want you to get started with ReplyBox as quickly as possible, so we’ve created this getting started guide. This guide refers to the Universal Code embed method, which supports all site types (including static sites). Using WordPress? Check out the Getting Started: WordPress Plugin guide.

Let’s get started!

Installation

If you haven’t already, sign up to ReplyBox. Then head over to the dashboard and click Create Site.

Enter your site’s name and URL, then click Create Site.

You’ll be presented with your unique embed code, which should be added to your site. Place <div id="replybox"></div> where you would like the comment section to appear. Then paste the JavaScript snippet before the closing </body> tag.

<script>
    window.replybox = {
        site: 'J8M03mBNIO', 
    };
</script>
<script src="proxy.php?url=https://cdn.getreplybox.com/js/embed.js"></script>

Configuration

Although not required, it’s recommended that you provide a unique identifier for each page where ReplyBox will be embedded. This will ensure that comments are shown on the correct page, even if the page’s URL changes. This value can be anything, but typical values include database IDs, GUIDs or slugs.

<script>
    window.replybox = {
        site: 'J8M03mBNIO', 
        identifier: 'UNIQUE_IDENTIFIER',
        bodyClass: 'is-dark'
        lang: 'en',
        sort: 'asc'
    };
</script>
<script src="proxy.php?url=https://cdn.getreplybox.com/js/embed.js"></script>

The bodyClass parameter allows you to parse through a class to the embed to allow custom styling depending on the page. If you have a mixture of light backgrounds and dark backgrounds on your website, this is the feature to use.

The lang parameter allows you to parse through a language code to translate the embed.

The sort parameter allows you to parse through a sort for the embed, the option by default is asc (oldest first) or the other option is desc (newest first).

Our universal code can be installed on ANY website, however with JavaScript frameworks sometimes they need a slight tweak to make sure everything loads in the correct sequence.

Here is a quick snippet to get you started to you can import ReplyBox into any page:

import React, { useEffect } from "react";

const ReplyBox = () => {
    useEffect(() => {
        if (window.replybox.site) return;

        window.replybox = {
            // UPDATE SITE HERE
            site: "J8M03mBNIO"
        };

        const script = document.createElement("script");
        script.src = "https://cdn.getreplybox.com/js/embed.js";
        script.async = true;

        document.body.appendChild(script);

        return () => {
            document.body.removeChild(script);
        };
    }, []);

    return <div id="replybox"></div>;
};

export default ReplyBox;

Now simply use the following to import and display:

import ReplyBox from "./MyComponent";

<ReplyBox />

We want you to get started with ReplyBox as quickly as possible, so we’ve created this getting started guide. This guide refers to the WordPress Plugin embed method. Not using WordPress? Check out the Getting Started: Universal Code guide.

Let’s get started!

Installation

Start by installing the ReplyBox WordPress plugin. From within WordPress, navigate to Settings > ReplyBox and copy the Secure Token.

If you need assistance installing ReplyBox into WordPress, or any other WordPress support, we recommend using WP Buffs for site edits and maintenance.

If you haven’t already, sign up to ReplyBox. Then head over to the dashboard and click Create Site.

Enter your site’s name and URL, and select WordPress Plugin as the embed method. Enter your secure token (copied from WordPress) and enable Sync Comments if you would like new comments posted to ReplyBox to be sent to WordPress. This will ensure comments are available in WordPress if you ever disable ReplyBox. Click Create Site.

You’ll be presented with your unique site ID. Switch back to your WordPress site and enter the site ID under Settings > ReplyBox, then click Save Changes. If you’re using a page cache plugin, purge the cache for the ReplyBox embed to appear on your site.

If you’re using the WordPress Plugin embed method, you can import your existing WordPress comments. This can be done at any time from the ReplyBox dashboard.

If you haven’t already, sign in to ReplyBox. Then head over to your site dashboard and navigate to the Embed tab. Click Import Now.

The import can be ran multiple times without issues. Only comments which don’t already exist in ReplyBox will be imported. Comments which have previously been imported will be skipped.

If using our WordPress plugin, you can enable single sign-on (SSO) so that users can comment on posts or pages using their existing WordPress account.

A few caveats:

1. Anonymous comments are not currently supported. Only authenticated WordPress users will be allowed to comment
2. You should configure any caching plugins not to cache logged-in users or cache on a per-user basis
3. If a user already has a ReplyBox account and is signed in, their ReplyBox account will take precedence over their WordPress account

Enabling Single Sign-On

Head over to the site’s setting screen and navigate to the Embed tab.

Toggle on the Single Sign-On option to generate a unique secret key.

Update wp-config.php File

Add the REPLYBOX_SSO_KEY constant to your site’s wp-config.php file, using the Secret Key generated by ReplyBox as the value.

define( 'REPLYBOX_SSO_KEY', 'f05d0a...' );

You can optionally provide a login URL, which will display a sign-in button for guest users.

define( 'REPLYBOX_SSO_LOGIN_URL', 'https://example.com/login' );

Important! Never share your SSO secret key. It should remain hidden at all times.

If your site already offers user registration, you can enable single sign-on (SSO) so that users can comment on posts or pages without having a ReplyBox account. Instead, you pass the current user’s name and email to ReplyBox when the embed is loaded. Using WordPress? Check out the WordPress Sign-In guide.

A few caveats:

1. Anonymous comments are not currently supported. Only authenticated users (using your site’s auth system) will be allowed to comment
2. Single sign-on is stateless, meaning that you must pass the current user’s credentials each time the ReplyBox embed is loaded
3. If a user already has a ReplyBox account and is signed in, their ReplyBox account will take precedence over single sign-on

Enabling Single Sign-On

Head over to the site’s setting screen and navigate to the Embed tab.

Toggle on the Single Sign-On option to generate a unique secret key.

Implementing Single Sign-On

The Universal Code needs to be updated to include the currently authenticated user’s name and email. You can optionally provide the current user’s profile picture URL and a login URL for non-authenticated users. The SSO data should be JSON encoded, and then Base64 encoded.

$payload = base64_encode(json_encode([
    'user' => [
        'name'  => $user->name,
        'email' => $user->email,
        'photo_url' => $user->photo_url,
    ],
    'login_url' => 'https://example.com/login',
]));

Generate a HMAC-SHA256 hash using the Base64 and JSON encoded payload. You should use the Secret Key generated by ReplyBox when SSO was enabled to create the HMAC. In PHP you can use the hash_hmac function:

$hash = hash_hmac('sha256', $payload, $replyboxSecretKey);

Pass the hash and payload to the embed code.

<script>
    window.replybox = {
        site: 'J8M03mBNIO',
        sso: {
                hash: '50d4c1e8...',
                payload: 'eyJ1c2Vy...',
        },
    };
</script>
<script src="proxy.php?url=https://cdn.getreplybox.com/js/embed.js"></script>

Important! Never pass your SSO secret key to the ReplyBox embed. It should remain hidden at all times.