How to comment THRON content

Business Case:

KPI to be measured

Bookmark this resource Follow

Ask a question

Was this article helpful? 0 out of 0 found this helpful

The market offers numerous solutions that allow you to manage and moderate comments. For some of these solutions, integration with THRON is simple and straightforward.

In this article we are going to show you how easy it is to integrate Disqus, one of the most used comment management systems, with THRON content, and more specifically with THRON embed codes, in order to increase the number of returning visitors. We chose Disqus not only for its popularity (you've probably already used it without realizing it) but also for its set of features that it integrates (moderation of comments, custom UI, integrated authentication systems, advertising, notifications etc.).

 

Requirements

To realize this integration you are going to need:

  1. A Disqus account (a free plan is enough)
  2. The embed code of a THRON content for which you want to activate comments
  3. A simple javascript code which will be provided, to activate Disqus in your page 

 

Why should you integrate comments?

If your visitors have the opportunity to comment on the content offered by THRON and to compare with other visitors, then they are more likely to return to your channels to continue discussions initiated online. You can take advantage of this return to your channels and involve them more and get even more information thanks to THRON intelligence and the use of dynamic content.

 

Integration

 

Step 1: Insert the code that allows the loading of Disqus in your page

Disqus can be imported in different ways depending on the host environment as there are pre-constructed elements for the most important CMS. In our case, we will proceed with manual import into a normal web page: through this block of code, the site incorporates the Disqus code

<script>(function () { // DON'T EDIT BELOW THIS LINE
    var d = document,
        s = d.createElement('script');
    s.src = 'https://<YOUR-URL-HERE>/embed.js';
    s.setAttribute('data-timestamp', +new Date());
    (d.head || d.body).appendChild(s);
})();</script>

The only thing to consider is replacing <YOUR-URL-HERE> with the url that is provided by Disqus during account creation.

 

Step 2: Associate a specific discussion to a specific THRON content

At this point, you must assign a code to the Disqus code injected into the page so that the comments of one content do not overlap with the comments of another content. You can use any type of configuration, but in our context it is convenient to exploit the id of the content, so that each content has its own Disqus identifier and, consequently, each content has its own comments.

var disqus_config = function () {
this.page.identifier = xcontentId;
};


To achieve this easily, it is best to use the block of embed code already provided by THRON, and associate the xcontentId  to a variable, so as to reuse it for the Disqus' configuration.

 

Step3: Insert the comment container in the page

Disqus injects its graphics into a special div container. In its standard configuration, the container has a specific id called "disqus_thread".

it is therefore sufficient to insert the div in the html page at the point where you want the comments form to appear

 

Code sample

<div style="width:100%">
    <h3 style="width:600px; margin: 0 auto;">YOUR TITLE HERE</h3>
    <div id="player_div" style="width: 600px; height: 400px; margin:0 auto;"></div>
    <div id="disqus_thread" style="width:600px; margin:0 auto;"></div>
</div>

<script src="//<clientId>-cdn.thron.com/shared/ce/bootstrap/1/scripts/embeds-min.js"></script>

<script>
    xcontentId = "<xcontentId here>";
    var options = {
        clientId: "<your clientId here>",
        xcontentId: xcontentId,
        sessId: "<a valid pkey here>"
    };
    var player = THRONContentExperience("player_div", options);
</script>


<script>
    var disqus_config = function() {
        this.page.identifier = xcontentId;
    };

    (function() { // DON'T EDIT BELOW THIS LINE
        var d = document,
            s = d.createElement('script');
        s.src = 'https://<YOUR-URL-HERE>/embed.js';
        s.setAttribute('data-timestamp', +new Date());
        (d.head || d.body).appendChild(s);
    })();
</script>

 

Sample

Below is an example of THRON content embed with an attached Disqus module:

 

STOCKHOLM BY NIGHT:

 

 
 
Was this article helpful?
0 out of 0 found this helpful

Have any question?

Open a ticket
Comments