Turbolinks { compatibility }

Twitter Buttons

twitter.com/about/resources/buttons

Official Implementation

HTML<body>
  <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://mysite.com" data-size="large">Tweet</a>
  <script>
  !function(d,s,id){
    var js, fjs = d.getElementsByTagName(s)[0];
    if (!d.getElementById(id)){
      js = d.createElement(s);
      js.id = id;
      js.src = "//platform.twitter.com/widgets.js";
      fjs.parentNode.insertBefore(js,fjs);
    }
  }(document,"script","twitter-wjs");
  </script>
</body>

Solutions

If all of your tweet buttons explicitly set the url and text properties (either through query parameters or data attributes), you can use either solution. If not, and any or all of your tweet buttons rely on using the current url and document title, you must use the second solution.

The first solution is less work to implement, but the second might be faster since it only runs the widgets.js script once, on the initial page load.

Solution #2 is implemented on this site.

Solution #1

Replace the supplied javascript snippet with an external script tag pointing to platform.twitter.com/widgets.js.

HTML<body>
  <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://mysite.com" data-size="large">Tweet</a>
  <script src="//platform.twitter.com/widgets.js"></script>
</body>

Solution #2

Remove the script from the body and load the following script inside the <head>.

COFFEESCRIPTtwttr_events_bound = false

$ ->
  loadTwitterSDK ->
    bindTwitterEventHandlers() unless twttr_events_bound

bindTwitterEventHandlers = ->
  $(document).on 'page:load', renderTweetButtons
  twttr_events_bound = true

renderTweetButtons = ->
  $('.twitter-share-button').each ->
    button = $(this)
    button.attr('data-url', document.location.href) unless button.data('url')?
    button.attr('data-text', document.title) unless button.data('text')?
  twttr.widgets.load()

loadTwitterSDK = (callback) ->
  $.getScript("//platform.twitter.com/widgets.js", callback)

Related Issues: #119

Credit: Nick Reed

All solutions should be considered unofficial. There is no guarantee that a given solution will work with your application. If you find that a solution is insufficient, please let me know by submitting an issue on Github.