ブログのサイドバーにSNSのシンプルなフォローボタンを作成してみました。
こんなやつです。
設定してみたら思った以上に簡単だったのでご紹介です。Wordpressのウィジェット部分に簡単にSNSフォローボタンを追加することができます。あと、SNSではないですがRSSフィード用にfeedly購読ボタンも作成します。
photo by chollingsworth3
目次
プラグイン「Social Media Widget」のインストール
まずWordpressに「Social Media Widget」プラグインをインストールしま す。
「プラグイン→新規追加」から「Social Media Widget」を検索してインストールします。
プラグインでの設定項目はありません。
ウィジェット画面でソーシャルボタンの設定
「外観→ウィジェット」画面にて「Social Media Widget」をドラッグ&ドロップして表示させたい位置に移動させてください。
タイトルの設定
「Social Media Widget」が表示されている右上の▲を押してドロップダウンさせ、まず「Title」を設定します。
アイコンサイズの設定
16px、24px、32px（Default）、64px、Customの中からアイコンサイズを設定します。このブログの場合は、Customにして92pxに設定しました。
SNSのURLの設定
「Social Networking」左横の▼をクリックしてドロップダウンさせ、SNSのURLを入力します。Google＋など、その他のSNSがある場合はURLを入力してください。
これでSNSの設定は完了です。
ここで一旦「保存」ボタンから保存してください。
feedlyボタンの追加
ブログ購読用にfeedly購読ボタンの設定もします。
feedlyアイコンの準備
feedlyボタンを設定するにはアイコンが必要です。僕がfeedly. your news. delivered.の素材から作ったのでよければ、お使いください。クリエイティブ・コモンズのものならば、feedly PNG_easyicon.netからもダウンロードできます
アイコンをメディアにアップロード
「メディア→新規追加」からアイコンをメディアにアップロードします。アップロードが終わったら「編集」をクリックします。
「メディアを編集」画面が表示されるので、「ファイルのURL」をメモか何かに控えておきます。
feedlyフォロー用のURLを取得する
次にfeedlyをフォローするためのURLをからfeedly. your news. delivered.取得します。
どれでもいいので適当なアイコンをクリックします。
あなたのブログのフィード（RSS）のURLを入力します。
HTMLタグが生成されるので、feedlyフォロー用のURL部分だけをコピーしてメモしておきます。
Social Media Widgetでfeedlyの設定
「外観→ウィジェット」画面にて「Social Media Widget」画面から再び設定を行います。
「Custom Services」の項の左にある▼をクリックしドロップダウンして「サービスの名前」と「先程メモしたアイコンのURL」と「先程メモしたfeedlyフォロー用のURL」を入力します。
最後に保存して設定は完了です。
まとめ
「feedlyアイコン」と「feedlyフォロー用URL」の設定だけ多少ややこしいかもしれませんが、すべてWordpress上で設定できるため思っていたよりも簡単でした。
