Twitter Timeline widget not working

widgetsjs
embeddedtimeline

#1

Hello, I wanted to include the twitter timeline of my site’s twitter page, so I created the widget from my twitter account -->settings–>widgets. Then I copied the given code in a text widget but the only thing it shows is a link: Tweet di @gameslookit, but the widget shown on the preview doesn’t appear. If i click on the link it redirects me to my twitter page. What to do? I’ve also tried to paste the widget ID into other plugins but the same problem occurs.
I


#2

An embedded timeline requires Twitter’s widgets JavaScript load onto the page. The link you see is fallback content, which would be used by Twitter’s widgets JavaScript to read your configuration and render a full timeline widget.

View source on your page and search for platform.twitter.com/widgets.js to check if Twitter’s widgets JavaScript loader was added to your webpage source.

Disable any ad blockers you may have installed on your browser; these blockers sometimes block Twitter’s widgets JavaScript from loading.


#3

the javascript platform.twitter.com/widgets.js is loaded into the page, and even with adblock off it justs shows a link.


#4

Which browser are you using?


#5

Usually I use Chrome, but I’ve also tried IE and Firefox. Same problem


#6

Can you please provide a sample URL where we may observe the behavior?


#7

yes sorry, I forgot to mention it. prova.gameslook.it. It’s on the right sidebar, in the Prova text widget. You’ll see only the link Tweet di @gameslookit (it’s my social page)


#8

Hi! You’d made a mistake with your script include for widgets.js, your page is trying to load http://prova.gameslook.it/platform.twitter.com/widgets.js, not https://platform.twitter.com/widgets.js, so the script isn’t loaded :slight_smile:

Check your template and that should fix the issue.

Possibly you’re pasting the code into a content/filtered region of your CMS, which might be corrupting the link. If you can, try including the <script> tag in your page template, that tends to be most reliable.

Ben


#9

I’ve tried to add the https part, but the problem persists.
This is the code I got from the widget creation page in twitter

<a class="twitter-timeline" href="https://twitter.com/gameslookit" data-widget-id="679621716017057792">Tweet di @gameslookit</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

I added the https part as you said, but nothing happened.


#10

Interesting. It seems that your CMS is transforming something about the embed code that’s making it generate an invalid script URL. Here’s an alternative version of the embed code which should avoid the problem:

<a class="twitter-timeline" href="https://twitter.com/gameslookit" data-widget-id="679621716017057792">Tweet di @gameslookit</a>
<script async src="https://platform.twitter.com/widgets.js"></script>

Hopefully this’ll work better!

Ben


#11

(I edited your post to put back ticks around your code so that it would show up)


#12

Ok, few thing I noticed. Now both codes are working in chrome and IE, but firefox still refuses them (it justs shows the link). I guess the only thing left is to contact firefox support since their browser is the only problem left.
Second, the code I gave you first it’s the one i took from twitter widgets creation page, so it’s not my CMS that’s changing it.
Thanks for your help, seems Firefox is the only crying baby


Embed Twitter timeline shows blank empty result page
Embed Twitter timeline shows blank empty result page
#13

Do you see a shield icon in your browser bar? Firefox may be blocking Twitter’s widgets JavaScript.


#15

I am having the same issue, but as far as I can tell the widgets.js is not being loaded as when I look at the source all I see is the exact script code I have in the html and nothing extra. Is there any way that I can determine if the js is being blocked somehow? I am not really sure where to go from here.

I had initially been trying to embed this within a SharePoint page, but I was worried that was part of the issue so I created a simple .html file and put the code in there with the same results. I have only tried IE so far.

<html>
<body>
<a class="twitter-timeline"  href="https://twitter.com/hashtag/nasa" data-widget-id="685461870069821440">#nasa Tweets</a>
<script>window.twttr = (function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0],
    t = window.twttr || {};
  if (d.getElementById(id)) return t;
  js = d.createElement(s);
  js.id = id;
  js.src = "https://platform.twitter.com/widgets.js";
  fjs.parentNode.insertBefore(js, fjs);
  
  t._e = [];
  t.ready = function(f) {
    t._e.push(f);
  };
 
  return t;
}(document, "script", "twitter-wjs"));</script>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</body>
</html>

#16

I’ve just tried pasting this into a static file locally and opening it in Chrome (I happen to be running Canary / v49) on OS X, and it works fine.

What version of IE are you using? Are you aware that our widgets don’t support versions of IE below IE 9?


#17

I am using IE 11


#18

OK, so it sounds more like something could be stopping the script from loading. Are you able to fetch the widgets.js file directly (there’s nothing blocking platform.twitter.com?). What does the developer view in your browser show you, is the script listed as one of the resources attached to the page?


#19

I can hit the widget directly and get the code dump to my screen if I go to the URL directly so there is nothing blocking the URL. In the IE dev tools I am not seeing anything that lists resources though


#20

And in fact…I decided to try Chrome just now and it works in that browser so it seems to be something wonky with IE 11


#21

Unfortunately I don’t have IE handy here to try it out locally, so good luck! :grimacing: