Twitter Feed Not Showing Up

Design help Custom code
1

Hey Guys,

So I tried to embed my twitter feed into my website using their widget.

The code provided was this.

Tweets by @5050MaxCharity

First I pasted the code in its entirety to the embed element on my website, and published. Nothing was shown on the resulting page.

I then tried to take the script section and put that into the custom code body section as someone else had, published and am still not seeing anything on the resulting page.

Here is the site.

max-charity.webflow.io

or

www.5050maxcharity.com

2

a class=“twitter-timeline” href=“https://twitter.com/5050MaxCharity” data-widget-id=“631526065408602112”>Tweets by @5050MaxCharity</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

The code would have <> at the beginning and end.

3

Hi @Chris_Allard,

A couple of things, you can past code into the post, and then format that using the </> button on the editing toolbar, to mark that code as formatted, so that it will show properly, could you reformat your example code?

Second, could you share the read-only link to your site: https://help.webflow.com/faq/how-do-i-share-my-sites-read-only-link

Thanks in advance ! Cheers, Dave

4

This is the initial link:

<a class="twitter-timeline" href="https://twitter.com/5050MaxCharity" data-widget-id="631526065408602112">Tweets by @5050MaxCharity</a>

And here is the second:

 <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>

Here is the read-only link to the site. Thanks Dave.

https://preview.webflow.com/preview/max-charity?preview=97eb64fe1a7a7e9c987b1f35f50b3496

The format that I tried to follow was from this post:

http://forum.webflow.com/t/big-bold-twitter-feed/6279

However I couldn’t even get my twitter feed to appear on my page, let alone customize with CSS.

5

I have just checked my browsers. It turns out that it shows up on Chrome, and my mobile device (iPhone 5S), however it doesn’t show up in Safari. Is there a reason/remedy for this?

6

Hi Chris, I might make a few changes to the way you are loading the twitter widget, but first, can you check this test page I setup in the browsers that did not work for you before: http://twitter-timeline.webflow.io

Let me know if you see the sample twitter timeline.

In this site, I copied this code first to the footer of the site on the Custom Code tab of site settings:

<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>

Next, in your design, where you want the twitter feed to go, you paste the Link portion of the code that twitter gave you, into an embed widget:

i.e.

<a class="twitter-timeline" href="https://twitter.com/5050MaxCharity" data-widget-id="631526065408602112">Tweets by @5050MaxCharity</a>

Now save changes and republish, and see if the page works better in Safari. If not, let me know and I am happy to help out further :slight_smile:

Cheers,
Dave