【Stinger7】右サイドバーにSNSフォローボタンを簡単に設置するカスタマイズ

   

Stinger7 右サイドバーSNSボタンをカスタマイズ

@yuichico_です。今回は右サイドバーにTwitter、Facebook、Google+、feedly(rss)のSNSフォローボタンを1列に4つ設置するカスタマイズする手順です。feedlyボタンはicomoonでimportしてやろうと思いましたが、めんどくさかったので、fontawesomeのrssアイコンを入れました。コピペでできますので初心者の方は見てください。完成図としてはこんな感じです。スマホでもタブレットでもPCでも同じ幅に調整できます。

右サイドバーにSNSフォローボタンを簡単に設置 完成図

スポンサードリンク

ダウンロードしてインストール

リンク Stinger7親テーマと子テーマのダウンロードとインストールのやり方

子テーマは必ずインストールしてください。

子テーマへアップロード

sidebar.phpを子テーマへアップしてください。

リンク Stinger7で特定の親テーマのファイルを子テーマへアップロードする方法

カスタマイズ

このブログの場合は、見出し文字をプロフィールにしてその下にSNSフォローボタン、プロフィール画像と文章、ホームページのリンクとメールアドレスを明記しました。試してみてください。

リンク 【Stinger7】右サイドバーでプロフィールをカッコよく表示させる方法

右サイドバー

外観→テーマ編集→sidebar.phpの26行目の <?php } ?> の下へ以下をコピペ。見ているPCにもよりますので、26行目で見つかなければその近辺25行目や27行目にある<?php } ?>を探してください。コピペしたら ファイルを更新 をクリックします。

各ソーシャルボタンの中にFontawesomeのアイコンを入れました。Twitter、facebook、Google+は運営しているアカウントを入れてください。feedlyはご自身が運営しているブログのドメインを入れてください。

CSS

外観→テーマ編集→style.cssで以下を一番下へコピペ

まとめ

shufulifeのちゅんこさんのブログを参考にしました。WordpressやStinger関連の記事が多数あってタメになります。ためになりますので、ぜひ見てみてください。

参考URL 【STINGER5】コピペOK!サイドバーにアイコンフォントでSNS各種のフォローボタンを作る

Twitter @shufulife

シェアしていただけると助かります。

 - Stinger7, カスタマイズ ,