Viafoura

The Viafoura Documentation Hub

Welcome to the Viafoura documentation hub. You'll find comprehensive guides and documentation to help you start working with Viafoura as quickly as possible, as well as support if you get stuck. Let's jump right in!

Get Started    API Reference

Conversations

Note

This version of our Conversations (version 3) tool is replacing the legacy Commenting tool

Introduction

The Viafoura Conversations tool gives your audience a voice and a way to engage deeply with your content, your organization, and each other. Viafoura has designed our Conversations tool to facilitate real-time discussions that are constructive and safe. The Conversations tool works to hyper-activate your community and encourage positive interactions among your users and promote a civil environment to express thoughts using our industry-leading moderation system.

Installation

Step 1: Install the Viafoura JavaScript

The Viafoura Conversations tool requires the Viafoura base JavaScript to be installed on the page where the conversations are to appear.

<!DOCTYPE html>
<html>
<body>
...
<script type="text/javascript" async src="//cdn.viafoura.net/vf-v2.js"></script>
</body>
</html>

Step 2: Install the Conversations Tool

Place the following code anywhere you would like a Conversations tool to appear on the page.

<div class="viafoura">
  <vf-conversations></vf-conversations>
</div>

Step 3: Define Custom Parameters

You can customize how the Conversations tool displays and renders comments within your page using the following parameters.

Name
Type(s)
Default
Notes

vf-container-id

String

The unique ID of the current commenting tool. Refer to our documentation on Container IDs and content syndication for more detail.

limit

Number

10

Defines the number of comments that are initially loaded before paginating.

Accepts: 1-100.

reply-limit

Number

2

Defines the number of replies that are initially loaded for top-level comments.

Accepts: 1-100.

sort

String

newest

Defines the sort order for top-level comments (not including replies).

Accepts one of:
newest
oldest
num_likes_desc
num_replies_desc

first-promo-position

Number

2

If a GPT integration is enabled, this will define where the first promo can be inserted. Default is between the 2nd and 3rd comments.

promo-interval

Number

7

If a GPT integration is enabled, this will determine how much space to place between promos. Default is that they will appear every 7 comments.

Transition

Before transitioning Viafoura Commenting to Viafoura Conversations, we recommend that you experiment with Viafoura Conversations in a development sandbox environment as described above in the installation details section. You can migrate your existing Viafoura Commenting tools to Viafoura Conversations quickly and easily in 2 steps:

1. Set Up Unique IDs

All Conversations tools will require a Container ID to allow syndication across domains. During the transition period, you will need to implement the unique ID system which will be translated into a Container ID by Viafoura once you switch from Viafoura Commenting to Viafoura Conversations.

Please read the Container ID documentation in detail and work with your client support representative to ensure it is correctly implemented. Note that if you are using the data-path option on a widget you will now need to add the data-unique_id in addition which must match the unique id of the page at the data-path.

2. Migrate Existing Data and Switch Over

Once unique IDs are in place, contact a Viafoura client support representative to assist you in migrating your existing Viafoura comments to the new Conversations system and with any other final switch-over details.

Major Changes

Existing user notifications in the tray will no longer function. The Conversations system uses a different mechanism for loading comments directly, that is not compatible with existing notifications. Existing notifications in the tray will not be able to deep link to new comments, however, new notifications going forward will continue to work as expected.

CSS Variables will be coming soon. In the meantime, you may choose to work with your Customer Success Rep to meet your CSS needs.

Some previous data attributes are no longer supported with Conversations:

  • data-has-notification-bell - The Viafoura bell will always appear in the Conversations header, CSS can be used to disabled it
  • data-title

Conversations


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.