Sunday, April 13, 2014

Linkedin Share Button in Rails 4 with Turbolinks Enabled

While implementing Linkedin share-button on my Rails 4 application with Turbolinks enabled, I encounter problem how to reload Linkedin share-button correctly because my code always showing "duplicate in.js loaded, any parameters will be ignored".

After a little googling, I found that I just need to flush old Linkedin instance by "delete IN". Here is my solution to implement Linkedin share-button with Turbolinks in Rails 4.0.0.

Official Implementaion
<script src="//platform.linkedin.com/in.js" type="text/javascript">
lang: en_US
</script>
<script type="IN/Share" data-counter="right"></script>

Solution
1. Remove the following script from <body>
<script src="//platform.linkedin.com/in.js" type="text/javascript">
lang: en_US
</script>

2. Load the following script inside the <head>
# Coffeescript

loadLinkedIn = ->
  delete IN
  $.getScript("//platform.linkedin.com/in.js")
  lang: 'en_US'

$(document).ready(loadLinkedIn)
$(document).on('page:load', loadLinkedIn)

1 comment:

  1. Thanks, by the way, you don't need the $(document).ready() function anymore as page:load is called by Turbolinks on the first page load now.

    You can test that out by removing $(document|).ready(), placing an alert('xyz') inside the loadLinked method and refreshing the page. You should notice the alert firing.

    ReplyDelete