widget won't reload when going back to home page

Question

I am using a Twitter widget to load a hashtag search on my rails site. The widget loads correctly either when I visit the page the first time, or when I click reload. However, if I move throughout the website and go back to the previous page it won't load the widget but simply display a link. Is there any change I can make such that the widget loads even if I click back to the page that contains it, without having to reload the page?

I see that similar questions have been posed before, but I couldn't find an answer that could help. Any input will be well received!

This is the widget code:

<a class="twitter-timeline" data-dnt="true" href="https://twitter.com/hashtag/srag5" data-widget-id="695833566630932481">#srag5 Tweets</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>

Should it help, this is my application.html.erb:

<!DOCTYPE html>
<html>
<head>
  <link href='https://fonts.googleapis.com/css?family=Sura' rel='stylesheet' type='text/css'>
  <title><%= yield(:title) %> | RRH's World Language One To The World</title>
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  <%= csrf_meta_tags %>
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <!--[if lt IE 9]>
      <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/r29/html5.min.js">
      </script>
    <![endif]-->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  <link href="assets/css/bootstrap-responsive.css" rel="stylesheet">
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  <%= favicon_link_tag 'favicon.ico' %>
</head>
<body>
  <%= render 'layouts/navbar.html.erb' %>

  <div class="container">
    <div class="jumbotron">
      <%= yield %>
    </div>   
  </div>
</body>
</html>

See enclosed pictures .

score 1 · Accepted Answer · edited May 23 '17 at 11:53

As shown in a Twitter community forum, and through through someone's post working with ajax, adding twitter.widgets.load() at the end of the widget solves the issue.

The revised widget would thus be:

<a class="twitter-timeline" data-dnt="true" href="https://twitter.com/hashtag/srag5" data-widget-id="695833566630932481">#srag5 Tweets</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"); twttr.widgets.load();</script>

widget won't reload when going back to home page

1 Answers1