How to display a Twitter Embeded Timeline feed on a BrightSign Player using BrightAuthor?

In order to display a Twitter Embedded Timeline feed please do the following:

1) Login to your Twitter account

2) Search for the Twitter feed you want to display

3) Click on the 3 vertical dots to open the hidden menu > click on Embed this profile

4) Click on Embedded Timeline

 

5) Click on Copy Code

 

6) Make a copy of the provided HTML file and rename it to something else (like Arsenal_Twitter.html as per the below example)

7) Open the newly renamed HTML file and paste the copied code from Step 5 between <div id="vertical-scroll">...</div>

8) Add the http: prefix to //platform.twitter.com/widgets.js so the full URL becomes > http://platform.twitter.com/widgets.js then save your changes.

9) Add the HTML site (the newly modified page with the CSS folder) to your BrightAuthor presentation via File > Presentation Properties > HTML Sites > Add HTML site > Browse to the location of the modified HTML file on your PC HDD > Click OK

 

10) Add an HTML state to your BrightAuthor playlist and make sure to enable "Enable External data"

 

 

11) Add a timeout transition event to that HTML state in order to refresh that feed at the desired time interval

12) Publish your presentation

 

 Both HTML/CSS and a BA demo example are attached this article.

 

 

 

 

 

Have more questions? Submit a request

10 Comments

  • 0
    Avatar
    RIF

    This works great.  Any idea how to tweak the HTML file so that it loops through a certain number of tweets?  Otherwise, the screen just shows the most recent tweet from the account.

  • 0
    Avatar
    Christopher Gencarelli

    I agree. This works great however, it remains paused on the latest tweet. Any ability to have this scroll through a series of tweets?

  • 0
    Avatar
    Dr. Ken Hodgkinson

    I followed all the instructions and it is not working.  All it shows is the name of the feed and the content doesn't populate.  Is there something I am missing?

     

  • 0
    Avatar
    Brittney Larko

    Followed this tutorial and it does not seem to work. My HTML and CSS are correct, since it works fine in my browser window. This is what my end product looked like...Logo blurred out for confidentiality...Please make an update to this blog post or a new blog post on how to include a live scrolling twitter feed on a display...

    Edited by Brittney Larko
  • 0
    Avatar
    Brian Murphy

    Has anyone been able to get the feed to scroll?  I can get it to display but only shows latest post.  

  • 0
    Avatar
    Brittney Larko

    I have not. 

  • 0
    Avatar
    Stephane Bonnell

    Hi, this was previously working with my XD1032 (firmware 7.1.113). But since yesterday it is not working anymore without any modification on my side.

    Now the link is displayed and not the feed, as if the javascript isn't executed anymore.

    Looking in Twtter dev forum I found this : https://twittercommunity.com/t/twitter-timeline-embed-not-working/183758 

    and this :

    https://twittercommunity.com/t/twitter-timeline-embed-not-working/183610 

    Seems to be a general problem on twitter embedded timeline. Hope this is going to be solved fast by twitter or maybe you can find some way to solve this from the player ?

    Regards

    Stéphane

    Edited by Stephane Bonnell
  • 0
    Avatar
    Stephane Bonnell

    Twitter has corrected the problem, now it is working when opened from a browser.

    But it still doesn't work on my brightsign.

    When looking at the log I get : 

    [14423.881] [ERROR]  [source https://platform.twitter.com/_next/static/chunks/modules.20f98d7498a59035a762.js:1]: Uncaught SyntaxError: Unexpected token { 
    [14423.893] [INFO]   [source https://platform.twitter.com/widgets.js:1]: %c[Update] There have been recent updates to Embedded Twitter Timelines and supported parameters.%c
    [14423.893]     •For more information on what has changed visit: https://twittercommunity.com/t/embedded-timelines-update-parameters-support/177112
    [14423.893]     •Please submit feedback or report any bugs: https://twittercommunity.com/c/publisher/websites/ 

    I tried to include the html page directly inside the program and hosted on a website with the same error.

    Any idea ?

    Regards

    Stéphane

  • 0
    Avatar
    RIF

    I determined that I had to go to publish.twitter.com to copy the embedded timeline.  However, after I go through the rest of the steps my Twitter feed is still showing as blank on the BrightSign unit.

    Are there any further recommended troubleshooting tips?

    Edited by RIF
  • 0
    Avatar
    Rachel Yurkovich

    I was able to get this to mostly work with a couple issues:
    Some images stay very blurry.
    Every time it refreshes it just shows a black screen with a link in the top left saying Tweets by ___ then doesn't load the twitter feed for about 10 seconds.

Please sign in to leave a comment.
Can't find what you're looking for? Try to
Powered by Zendesk