FacebookのライクボックスなどをSimplicityの本文記事下にウイジェットで配置する方法

Simplicityはデフォルトで、記事下に以下のようなフォローボタンが備わっています。

フォローボタン

ただ、やはりこういうアイコンよりは、SNSこういうのフォローブログパーツの方が、見た目で一目瞭然な分フォロー率は高いです。

けれど、記事下にSNSフォローボタン(ボックス)などを設置するのに、これまではテンプレートファイルをカスタマイズする必要がありました。

けれど、Simplicity201401004からは、ウイジェットからメインカラーの一番下にSNSサービス独自のフォローボタンなどを設置できるようになりました。

スポンサーリンク

Facebookライクボックスの設置例

今回は、Facebookライクボックスの設置を例にして、設置してみたいと思います。

まずは、Wordpress管理画面から「外観→ウイジェット」に移動します。

そこにある「投稿をSNSボタン下」ウイジェットにテキストウイジェットをドラッグ&ドロップします。

投稿SNSボタン下ウイジェットにテキストウイジェットをドラッグ&ドロップ

Facebook Like Boxに移動して、ライクボックスの設定を行ってください。

僕の場合は以下のように設定しました。

Facebookライクボックスジェネレータ

メインカラム幅いっぱいにライクボックスを表示させるには、widthを680にしてください。

設定が完了したら、「Get Code」ボタンを押してください。

すると以下のようなダイアログが表示されるので、タグを取得してください。

Facebookライクボックスのタグ

HTML5でもiframeでも良いのですが、今回は、1回のコピペでできるのでiframeのタブを選択してコピーしました。

で、先程ドラッグ&ドロップしたテキストウイジェットに取得したタグを入力します。あとついでにタイトルもつけます。

投稿SNSボタン下にタグを入力

「保存」ボタンを押せば設定完了です。

投稿ページのメインカラム一番下に以下のように表示されます。

Facebookライクボックスの表示例

その他のSNSフォローボタンなどもうまく設置すれば、Simplicityデフォルトのフォローアイコンは設定から非表示にしても良いかもしれません。

まとめ

今回は、SNSフォローパーツを設置しました。

けれど、ウイジェットですので何を設置してもOKです。

テンプレートファイルを編集するよりは手軽だと思うので、ウイジェットからいろいろなものを設置してみてください。

GitHubリポジトリ

不具合等ありましたらGitHubに、ご連絡いただけると幸いです。

yhira/simplicity2

スポンサーリンク
アドセンス(大)
アドセンス(大)

フォローする

スポンサーリンク
アドセンス(大)