Twitterのシェアウインドウが2つ表示されてしまう場合の対処法

弊社テーマではオリジナルのシェアボタンを採用しています。そのシェアボタンでTwitterのシェアボタンを押した際に、ウインドウが2つ表示される現象が特定の環境で起こります。

Twitterの公式ウィジェットを設置している場合に起こる不具合

Twitterの公式ウィジェット(フォローボタンなど)を設置している場合に、ハミングバードアルバトロスのTwitterシェアボタンを押すとウインドウが2つ現れる場合があります。

この現象はもちろんデフォルト状態では発生しないのですが、Twitterのフォローボタンやタイムラインを設置してる場合に起こります。

こんなやつ

こんなやつ

こんなやつ

こんなやつ

原因となるのはJavaScript

ウインドウ(小窓)を開く際のJavaScriptが干渉することにより、ウインドウが2個表示されてしまいます。

これを回避するには、本当はTwitterの公式ボタンのJavaScriptを読み込まないように修正したいところなんですが、公式で公開されているHTMLコードではその編集が不可能なので、テーマ側にて修正する必要があります。

修正方法

テーマファイル内の「parts_sns.php」および「parts_sns_short.php」にあるTwitterボタンコードの下記部分を削除します。

該当ファイルを子テーマにコピーし、修正してください。
子テーマを利用していない場合は親テーマの該当ファイルを直接修正してください。(ただしテーマアップデートでデフォルトに戻ってしまいますのでその点はご注意を。)

該当ファイル

  • parts_sns.php(記事コンテンツ下のボタン群)
  • parts_sns_short.php(記事タイトル下のボタン群)

削除するコード

上記該当ファイル内にある下記コードを探し、削除します。

onclick="window.open(this.href, 'tweetwindow', 'width=550, height=450,personalbar=0,toolbar=0,scrollbars=1,resizable=1'); return false;"

あとがき

ただし、今後の運用の中で、サイト内に設置している「フォロー」ボタンを消してしまうとシェアボタンのポップアップが効かなくなり、シェアウインドウが別タブで開くようになります。

今後ウィジェット内のフォローボタンのコードを削除される場合には、上記カスタマイズ内容を元に戻す必要がありますので、その点はご注意ください。

※カスタマイズの際はバックアップをお取りいただき、万が一に備えて元に戻せるようにして作業してください。

新作!究極のモバイルファースト
WPテーマ「ストーク」

「新しいスマホビュー時代をつくろう」というのをコンセプトに、スマホでの見やすさ、操作しやすさにとことんこだわりました。

インパクトのあるアニメーション
WPテーマ「ハミングバード」

インパクトのあるアニメーションでブログを演出します。

誰が使っても美しいデザイン
WPテーマ「アルバトロス」

シンプルかつ正統派のブログテーマです。