Using Github Embedded Gists With Turbolinks

Using Github Embedded Gists With Turbolinks

___

In this tutorial, I will show you how to make github embedded gists compatible with turbolinks.

As you may have noted following links on this site is a little bit faster if not faster than its normally is. I have achieved this with the help of Turbolinks gem. This means that I am able to get the bulk of the speed benefits but this comes at a cost as not everything will work as normal.

I ran into some problem trying to use Github embedded gists on this site. They din't work on pages loaded with turbolinks. I have to manually refresh a page to render the Github gists. This got me going crazy, searching every site on the internet looking for a solution. I finally got a solution from an issue raised on github about the same.

Though its not officially documented, I decided to write it here to act as a reminder for posterity. For those using coffee script simply include this snippet in your js.coffee file

Loading Gist

For those using pure javascript, I converted the above coffee snippet to javascript

Loading Gist

The last thing you now need to to is change all of your gist script tags into divs with a gist class and data attributes for the URL and the file name. Also, use the .json extension instead of .js. Like this:

Loading Gist

And your good to go!! This site uses this solution to overcome this problem. Hope this helps someone. Have any comments? Feel free to leave one below.


2 Comments

___

404df8f3507279467584750e440a4d4f5bd34549

Kenneth Kinyanjui

10 Apr 14

Insightful and useful.. Have not run into the issue but if I need to do I will stop by here

Fd5d718bba4d372ac20783b99d609f5922a92ef3

Victor Areba

25 Jul 15

Came in handy while integrating gists on my site. Thank you for this.

Latest Tutorials

___

Private Inbox System in Rails with Mailboxer New

Introduction It's been quite a while since my last tutorial and since then I've recieved alot of requests by email to implement a private messaging system ...

Ajax Sortable Lists Rails 4

With me, is a simple to-do list application where users can create dummy to-do lists and displays them in card-like form just like in Trello. We want to e...

Managing ENV variables in Rails

Often when developing Rails applications, you will find a need to setup a couple of environment variables to store secure information such as passwords, a...

Gmail Like Chat Application in Ruby on Rails

Introduction We are all fond of the Gmail and Facebook inline chat modules. About a week ago, I came across a tutorial on how to replicate hangouts chat...

Fast Autocomplete Search Terms - Rails

Introduction In many cases you find that you need to introduce a global search in your rails application i.e. search multiple models at a go using one form...

Load more scroll top