WP Touchにソーシャルボタンを表示する方法


公開日:  最終更新日:2013/07/04

snsスマートフォンからのアクセスが少しずつ増えてきたので、WP Touchをインストールしてスマートフォンからアクセスがあると自動的にスマートフォン用の表示に切り替えられるようになっているんだけど、スマートフォン用画面にはFacebookの『いいね』やTwitterの『リツイート』ボタンを表示していなかったので設置することにしたのだ。

 

 

ソーシャルボタンを表示させるには直接『single.php』を編集する

いろいろなサイトを見て、ソーシャルボタンを表示させる方法を調べてみたら、single.phpを編集するということが分かったんだけど、WordPressのプラグイン→WP Touchを探しても全然みつからなくて数時間、悪戦苦闘した結果WordPressの管理画面から編集するわけじゃなくて、single.phpのファイルをダウンロードしてそのファイルを編集してアップロードするということがわかったのだ。

ファイル転送ソフトから『single.php』をダウンロード

おいらはファイル転送ソフトは『FFFTP』を使っているのでFFFTPからsingle.phpをダウンロードして編集したのだ。

 

■single.phpのある場所はこちら

「(サイトのURL)/wp-content/plugins/wptouch/themes/default/single.php」

<div id=”singlentry” class=”<?php echo $wptouch_settings[‘style-text-justify’]; ?>”>
<?php the_content(); ?>

 

single.phpに上のコードと同じものがあり、これはコンテンツのコードで記事の内容が表示されるようになっているので、

記事の上に表示したい場合はこのコードの直前、

記事の下に表示したい場合はこのコードの直後、

上にも下にも表示したい場合はどちらにもコードを入れればいいのだ。

 

おもなソーシャルボタン

 

■Twitter

https://twitter.com/about/resources/buttons

 

■Facebook

http://developers.facebook.com/docs/reference/plugins/like/

 

■はてなブックマーク

http://b.hatena.ne.jp/guide/bbutton

 

■Google+

https://developers.google.com/+/plugins/+1button/

 

■LINE

http://media.line.naver.jp/howto/ja/

 

ソーシャルボタンを入れたスマートフォン用画面はこんな感じ

Screenmemo_share_2013-02-01

 

『LINEの送る』ボタンは最近リリースされたので、スマートフォン用画面だけ設置したのだ。

LINEのユーザーはどんどん増えているのでこれから良く使われるようになるかもしれないのだ。

 

関連記事

wordpress_logo

WordPressのサイトをプラグインだけで高速化してみた
すごく簡単に設定できたのだ

 

analyticsGoogleAnalyticsのメモ機能を使ってページ修正後の変化をチェックする
サイトを修正したときにはメモを取って

 

 

  • このエントリーをはてなブックマークに追加
  • Pocket

最後まで読んでいただいてありがとうございました!
もし気にいってもらえたらこのブログのRSS登録やフォローをお願いします。

follow us in feedly

コメントはこちらからお願いします

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

PAGE TOP ↑