turbolinks 5 にtwitterボタンを対応させる


turbolinks 5を使用していると、ページの遷移時にtwitterのフォロー/シェアボタンが表示されなくなってしまう問題の解決方法。

解決方法

基本的にはCompatibilityのページに書いてあるとおりだが、順を追って説明していく。なおこれはCompatibilityのページのSolution #2に該当する。

まずはTwitterボタンのページでサイトに貼り付けたいボタンのソースをゲットする。通常はそいつをボタンを表示させたい箇所に貼り付ければいいわけだが、turbolinksを使用する場合は、ちょっと違う。取得したソースはaタグとscriptタグがあると思うのだが、そのうちaタグの方だけを貼り付けるようにする。下は@XXXXユーザーのフォローボタンの例。

ボタンを貼り付けたらCoffeeScriptを作成する。ファイル名は任意。

これだけ。

なお本家Compatibilityのサイトと若干CoffeeScriptのソースが異なるので注意。本家版はgetScriptに時間がかかった場合にエラーが出るようになっていたので、それを修正した。(PR出してるけどマージされるかは不明)

turbokinks 5、いまのところすごくいい感じ。パフォーマンスの向上を肌で感じることができてる(気分。)

関連する記事


コメントを残す

メールアドレスが公開されることはありません。

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください