Concepts guide

Glossary and terms

Feelback

A feelback is the user feedback or signal. It can be anything, from a like to a emoji reaction, from a text message to a complex data structure. A feelback is sent from a user about something. This something is a unique content of your website.

ContentItem

A content-item, or simply a content, is a unique piece of your site or app. It can be a blog post, a support page, a single comment, or anything you can uniquely identify. Any content can be the target of the user feedback, that is, a user leaves a feelback for a content you specify.

ContentSet

A content-set is a collection of several homogeneous content for which you want to receive user feelbacks. The content-set determines the kind of feelback you want. For example, if you want to receive likes for your blog posts, you should create a set named BlogPostsLikes of type Pulse. Inside the BlogPostLikes set you’ll receive a feelback for each like your users leave for any blog post.

Each kind of feelback supports different features, like data aggregation or sentiment analysis.

Project

A project is the global container of all your content and feelbacks. Usually it’s your website or app. A project is composed by one or more content-sets that contain all your content with the relative feelbacks.

In the project structure section you can checkout several scenario examples on how to structure your project and model it to fit your use case.

TargetContent

When you integrate Feelback in your website, you need to specify for which content you want to receive the user feedbacks. For example, when you want to receive likes for your blog posts, in each page you will specify the page itself as the target content of the feelbacks.

Checkout the dedicated section for a deep dive on how to set the target content with all options available.

Project structure

A project is the root container of your content, sets, and feelbacks. A project is composed by one or more content-sets in a hierarchical structure shaped as following:

Project: MyWebSite
│
├─ ContentSet: BlogPostLikes
│  ├─ Content: Post-A
│  │   ├─ Feelback: like from user1
│  │   └─ Feelback: like from user2
│  ├─ Content: Post-B
│  │   ├─ Feelback: like from user1
│  │   ├─ Feelback: like from user3
│  │   └─ Feelback: like from user4
│  └─ Content: Post-C
│
└─ ContentSet: DocumentationUpVotes
   ├─ Content: docs-guide-A
   │   ├─ Feelback: up-vote from user1
   │   └─ Feelback: down-vote from user2
   └─ Content: docs-guide-B
       ├─ Feelback: up-vote from user1
       ├─ Feelback: up-vote from user3
       └─ Feelback: down-vote from user4

Scenario examples

Blog posts likes

You want to receive a like signal for each blog post of your site.

You should create the following structure:

a project: Your website
a content-set: BlogPostLikes and choosing the Pulse feelback type.

In your integration, for the target content:

you will use the contentSetId generated for the BlogPostLikes set as container of all feelbacks
you will use nothing for the contentKey: the system will adopt the page URL as unique identifier for each post.

Comments reactions

You want to receive a reaction emoji for each comment in any site page.

You should create the following structure:

a project: Your website
a content-set: CommentReactions and choosing the Reaction feelback type.

In your integration, for the target content:

you will use the contentSetId generated for the CommentReactions set as container of all feelbacks
you will set explicitly the commentId (generated by your backend) as the contentKey: the system will use a combination of both contentSetId and contentKey to uniquely identify the content receiving the user feelbacks.

Global site feedback (suggestions, error reporting, etc…)

You want to receive a text message about your site, not tied to a specific page, but as a global feedback mechanism.

You should create the following structure:

a project: Your website
a content-set: SiteMessages and choosing the Message feelback type.
a content: manually create a Site content, which represents the site itself.

In your integration, for the target content:

you will use the contentId generated for the Site content

Target content

Feelback enables you to receive feelbacks on any kind of content. A blog post, a support page, a user comment, everything can receive signals from your user. You can get feedbacks for a specific page, usually identified by its URL, or you can enable users to react to parts of the page, like comments or sections.

In order to receive feelbacks for the right content, you have to set the target content. That is, the unique identifier of the content on which the feelbacks will be attached to.

You have two way to specify the target content:

Inside ContentSet Target

This is the most common scenario, usually used when the content is the current webpage the user is in.

You identify a content by the pair:

contentSetId: the unique id of the container which specifies the feelback type the user can send. In the panel, you can copy the contentSetId for each content-set you created
contentKey: represents a unique key inside the content-set specified. You can either omit the key, in that case the current page URL is used as implicit key. Or, you can explicitly set the content-key if want to use another convention (for example, your renamed your URL and want to keep the old one to keep the new feelbacks on the same content).

Example: Blog post (implicit key)

You want to receive a like signal for each blog post of your site.

In the panel, you will create a BlogPostLikes content-set with type Pulse. Suppose the contentSetId is 80881f8357df422bbe0c.

For a React application the integration will be something like:

import { FeelbackPulse } from "@feelback/react";

function BlogPostTitle({ title }) {
    return (
        <div class="header">
            <h1>{title}</h1>
            <FeelbackPulse contentSet="80881f8357df422bbe0c" />
        </div>
    );
}

You don’t need to specify the contentKey as the library will automatically use the current URL as the key to identify content.

Example: Product review (explicit key)

You want to receive a star rating for products you sell on your web site.

In the panel, you will create a ProductRatings content-set with type Rating. Suppose the contentSetId is 80881f8357df422bbe0c.

For a React application the integration will be something like:

import { FeelbackRating } from "@feelback/react";

function ProductCard({ title, slug }) {
    return (
        <div class="header">
            <h1>{title}</h1>
            <FeelbackRating contentSet="80881f8357df422bbe0c" contentKey={slug} />
        </div>
    );
}

You need to explicitly specify the contentKey to identify the exact product you want your users give a rating.

Global ContentId Target

Inside the Feelback system, each content is identified by a unique id, the contentId. The contentId is auto generated the first time you receive a feelback for a content not yet registered. Or, you can create a content in the Feelback panel, and copy the contentId to use it for the integration.

The contentId points directly to a unique content, with no need of additional info. The contentId is auto-generated, immutable and cannot be changed or manually determined or assigned.

Using the contentId as target is useful for scenarios where the content is static, predetermined and fixed, such as:

the whole website itself
a specif section or scope

Example: Website suggestions

You want to receive suggestion messages from your users about your website.

In the panel, you will create a WebsiteMessages content-set with type Message. Then, inside this content-set, you will manually create a content named Website. Suppose the contentId is 80881f8357df422bbe0c.

For a React application the integration will be something like:

import { FeelbackMessageDialogButton } from "@feelback/react";

function LeaveAMessageButton() {
    return (
        <FeelbackMessageDialogButton
            label="Leave a Suggestion"
            contentId="80881f8357df422bbe0c"
        />
    );
}

All messages from your user are directly attached to the WebSite content.