WordPressにTwitterへ投稿ボタンを追加する方法
WordPressのブログ記事などをTwitterでシェアできるボタンを設置する方法の備忘録です。
ボタンの設置
まずは、Twitterへシェアするボタンとなるリンクを設置します。投稿ページの該当箇所に下記コードを追加します。
<a href="https://twitter.com/intent/tweet?url=<?php the_permalink(); ?>&text=<?php echo get_the_title(); ?>" target="_blank" rel="noopener noreferrer">Share on Twitter</a>single.phpで投稿ページを作成している場合、記事の内容を表示するループの中に記述します。
「href」に記述されているURLで、シェアしたい記事の内容を含むツイート投稿画面をTwitterで開きます。「text」の部分が、ツイートのテキストになります。the_permalink()で記事のURLが、echo get_the_title()で記事のタイトルが入ります。
「Share on Twitter」のリンクが表示されるので、CSSでボタン風のデザインに変更します。
Twitterにシェアするボタンが完成しました。
アイコンについて
今回使用したTwitterのアイコンは、Font Awesomeを利用しました。
Twitter Icon Brands – Font Awesome
headerに下記を記述することで、Font Awesomeが使えるようになります。
<link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">アイコンを表示したい箇所に下記を記述します。
<i class="fab fa-twitter"></i>CSSでサイズや色を変更でき、ファイルの管理の必要がないため、画像のアイコンを使用するよりも簡単にアイコンが表示できます。
Font Awesomeの詳しい使い方はこちらの記事で紹介しています。
