About

Delivering consistent and engaging content to consumers can be a challenge.

StoryStream’s Widget allows brands to create a real-time, dynamic and powerful narrative, led by passionate consumers and fans. Leverage social content and deliver it to pivotal decision-making touchpoints, with more authentic reviews, and fresh, personalised content.

The Widget integrates a live, dynamic content window to any section of your website, featuring the most recently curated user-generated and owned content about your brand.

Content moves into the panels in adjustable intervals, favouring newer posts, and with the ability to choose the column configuration and colour scheme right from StoryStream’s intuitive curation suite: ‘Launchpad’, the Widget allows for a perfect brand integration, creating a more visually-led and impacting story.

For more context, users can click on items to see an expanded view, showing the source, author, publish date and share functions.

Most commonly used in tandem with the SocialHub, the Widget brings live content to the first customer touchpoint, and creates deeper interaction when users click through to see the full story on your SocialHub.

Using StoryStream’s intuitive curation suite, content is approved and published to the Widget in real-time, with no technical experience necessary. With the shortlist and schedule features, collaborative storytelling is quick, efficient and ensures your content is always fresh and relevant.

 

Implementation

To embed the Widget app you’ll need to add the following to your page.

1 Firstly, the container (HTML) element, which should be placed exactly where you’d like the Widget to display on the page.

<div id="StoryStreamWidgetApp" class="stry-widget"></div>

 

2 The following is the script (JavaScript) that loads the Widget and its functionality, populating the above container.

The app_id will need to be replaced by your unique app instance ID, generated in the App Store or by your Account Manager.

<script type=""text/javascript" src="http://apps.storystream.it/widget/js/app_id.js"></script>

 

The Javascript file should be placed below this HTML element (preferably in the footer, or directly after it) so that the element is definitely in the DOM.

A height will need to be applied to the Widget so that it is visible on the page.

This can be done in your stylesheets:

<!DOCTYPE html> 
<html> 
    <head>
        <style>

            /*
                ‘500px’ here is just a guideline.
            */
            
            #StoryStreamWidgetApp {
                height: 500px;
            }

        </style>
    </head>
    <body>
        <div id="StoryStreamWidgetApp" class="stry-widget"></div>
        <script src="http://apps.storystream.it/widget/js/app_id.js"></script>
    </body>
</html>

 

Browser Support:

The Widget is supported on the following browsers:

  • Chrome 35+
  • Safari 7+
  • Internet Explorer 9+
  • Firefox 30+

 

Our extended documentation details how to cater for unsupported browsers, with more information on how to embed and customise specific elements of the Widget.

Find out more at our Developer Portal   onward-arrow


 

Customisation and Styling

Troubleshooting