Overview
The Trending content box uses your analytics to feature top content on your site to keep visitors engaged and drive more pageviews.
How it works
The analytics generated by the AddThis tools on your pages are used to generate a few limited public feeds of your top content (known as Content Feeds). The tool automatically pulls in the content feed of your choice and, if there is data available, it will display a box linking to the top pages in the feed. The box simply shows a header and as many links as you specify, within the limits of the box height. The link text will be the title of the pages.
Our API
Use our API to customize the box and the links that should be displayed. If you are familiar with our other tools, you will find the following options very familiar and easy to implement.
Configuration
The box can be configured by passing in a configuration object in addition to the identifier that matches the element where the content should be rendered. You can specify any of the options below.
addthis.box("#addthis_trendingcontent", { // ... members go here });
Configuration Options
| Name | Description | Type | Default value |
|---|---|---|---|
| pubid | Your AddThis Profile ID. Always global to a page. | string | none |
| feed_title | The title to display at the top of the plugin. To disable the feed_title and not show anything, specify the configuration option feed_title and an empty string. | string | "Most Popular" |
| domain | Links can be filtered to a specific domain | string | none |
| feed_service | Links can be filtered to a specific service. View full service list. | string | none |
| feed_type | Specify the type of activity you want to leverage to generate your feed. trending - content that is growing in popularity shared - most shared content clicks - most clicked content |
string | trending |
| feed_period | Specify the period of time that should be used to generate your feed. day week month |
string | week |
| num_links | The number of links to display | integer | 5 |
| height | The height of the box in pixels. You can also specify "auto" to have the box auto-size itself based on the contents and space available. | integer or "auto" | auto |
| width | The width of the box in pixels. You can also specify "auto" to have the box auto-size itself based on the contents and space available. | integer or "auto" | 300 |
| border | The border color of the box. For example, "#000" would make the border white. |
hex string | none |
| background | The background color of the box. For example, "#FFF" would make the background white. |
hex string | none |
| link_target | The "target" attribute for the links. | string | _top |
| remove | Text that you want removed from the beginning and end of titles. Useful if you have text added to your titles for SEO like " | mywebsite.com". | string | none |
| url_filter | Specific URL(s) that you don't want to be displayed within the Trending Content Box. You can either specify an individual url or an array of urls. | string or array | none |
| title_filter | Specific title(s) that you don't want to be displayed within the Trending Content Box. You can either specify an individual title or an array of titles. | string or array | none |
| transform | A custom function that can be used to transform the title/url that gets rendered for each feed item. If you use this, you must either return an object with a title and url attribute for anything to be rendered. No return value or a value of false/null will exclude the item from the Trending content box. An example function that just outputs the title and url to the console would be: var transformFunc = function(urlTitle) { console.log(urlTitle.title); console.log(urlTitle.url); return urlTitle; }; |
function | none |
| tag | To disable click tracking on links (#cfd-1.0) displayed in the Trending Content Box, set this attribute to "false". | string | true |
Attribute-based Configuration
In addition, you can specify parameters as custom attributes on the div element themselves. All the parameters described above are available, with the prefix addthis:. Let's look at some examples:
To specify a custom domain to filter the links:
<div id="addthis_trendingcontent" addthis:domain="www.example.com"></div>
To specify a border color:
<div id="addthis_trendingcontent" addthis:border="#EEEEEE"></div>
Events
Similar to our sharing buttons, we offer the ability to register to be notified when a specific event occurs. Learn more about event handlers.
Event Types
| Code | Description | Data |
|---|---|---|
| addthis.trending.click | Dispatched when a user clicks on a link | url: the url of the link clicked |
| addthis.trending.empty | Dispatched if there is no data to be rendered | none |
| addthis.trending.render | Dispatched when the box has been rendered | config: custom configuration container: HTML element containing |
Enabling Your Feeds
Before you can use the Trending content box, content feeds must be enable for your publisher profile. To do this, visit your profile settings page and choose the profile you'd like to access (you may have only one profile). Scroll down to content feeds, select the checkbox and click save to enable your feed.
The rest of your analytics data will remain private and can be accessed via our password protected analytics api.