WordPressにソーシャルボタンを設置するプラグイン
WP Social Bookmarking Light
ワードプレスにソーシャルボタンを設置するプラグインの「WP Social Bookmarking Light」は、複数のソーシャルボタンを一度に設置できるのでとても便利です☆
WP Social Bookmarking Lightのインストール
ワードプレスのダッシュボードのプラグインの新規追加で「WP Social Bookmarking Light」を検索して、インストールして有効化します。
WP Social Bookmarking Lightの一般設定
ワードプレスのダッシュボードの設定の「WP Social Bookmarking Light」をクリックすると設定画面が開きます。
「一般設定」の「位置」で、ソーシャルボタンを設置したい場所を選びます。
「個別記事のみ」はYesにすると、個別の記事のみにソーシャルボタンが設置されます。Noにすると記事の一覧画面やカテゴリーの画面などでもソーシャルボタンが設置されます。
「ページ」をYesにすると、固定ページでもソーシャルボタンが設置されます。
「サービス」は、設置したいソーシャルメディアを右の枠の中から選んで左側の枠にドラッグします。
設定が終わったら「変更を保存」をクリックします。
ソーシャルボタンを任意の位置に設置する方法
「一般設定」の「位置」で「None」選択して「変更を保存」をクリックしてから、テンプレートの「single.php」や「page.php」の表示したい位置に下記のコードを書き込みます。
<?php wp_social_bookmarking_light_output_e(null, get_permalink(), the_title("", "", false)); ?>
ソーシャルボタンの隙間をつめて綺麗に並べる方法
ソーシャルボタンの間に隙間ができてしまう場合は、「WP Social Bookmarking Light」の設定画面にタブで表示されているソーシャルメディア別の設定で幅を指定することで解決します。twitterの幅の設定は、スタイルの項目に記載されているので、「wsbl_twitter」の「width」に直接数字を入れて変更します。
ソーシャルボタンの上下に余白を入れる方法
「WP Social Bookmarking Light」の設定画面のスタイルの「wp_social_bookmarking_light」の項目の「padding: 0 !important」になっている部分を削除して、上に余白を空けたい場合は「padding-top: ●●px !important;」を書き加え、下に余白を空けたい場合は「padding-bottom: ●●px !important;」を書き加えます(●●には任意の数字を入れる)。
いいねのボタンが下にずれてしまう場合の修正方法
いいねのボタンが下にずれてしまう場合は、「WP Social Bookmarking Light」の設定画面のスタイルシートに下記のコードを書き加えます。
.fb_iframe_widget > span { vertical-align: baseline !important; }