【THE THOR カスタマイズ】シェアボタンの上下に文章を入れる

WordPressテーマ「THE THOR」のシェアボタンのカスタマイズはじめたよ！

THE THORのシェアボタンのデザインは11種類もあるので、よっぽど暇な人以外はデザインのカスタマイズする必要性はありません。基本装備で100％満足できます。

だから、今回は上下にテキストを追加して少しでもシェアされる確率を高めるための下心丸出しのカスタマイズです。

シェア数増やしたいなら記事の内容を充実させること考えた方がいいっすよ！

そんなこたぁ、わかっちゃいるけど記事の品質上がるまでは媚び売ってでもシェアされたいんです！

THE THORのシェアボタンの基本設定

まずはTHE THORの基本操作で設定できる内容を確認しておきましょう。

シェアボタンの種類

THE THORで使用できるシェアボタンは全部で8種類あり、下のとおりです。

※Google＋は2019年に終了しているので、実際使えるのは7種類ですね。

表示するシェアボタンの設定方法

使いたいシェアボタンを設定するだけで、横幅は勝手に調整してくれるのでめっちゃ楽勝です。

わたしも最初はいろんなボタンを配置してましたが、最終的にはTwitterとはてブの2つに落ち着きました。

シェアボタンのデザイン

THE THORで使用できるシェアボタンのデザインは全部で11種類。

どんなデザインになるかは自分でさわって確認してください。画面サイズによって2列や3列になるので自分の目で確かめるのが一番良いかと思います。

どうせ11パターンのサンプル写真を準備するのが面倒になったんやろうな

バレてしまったか…

からあげ棒さんが詳しくまとめてくれてますので確認したい方は、THE THOR ザ・トール SNSボタン (シェアボタン) 一覧でチェックしてみてください！（←秘技・他力本願Lv.100）

シェアボタンのデザイン設定方法

プレビュー見ながらいろんなシェアボタンのデザインパターンが確認できるので余裕ですね。

サクッと終わらせちゃいましょう。本題のカスタマイズが待ちくたびれてます。

カスタマイズする前の注意事項

これマジ大事なんとこなんでよろしこ！

今回のカスタマイズは、THE THOR（親テーマ）のPHPやCSSを直接編集するものではありません。

それでも導入して不具合（デザイン崩れ）が起きる可能性はゼロではないです。万が一の際に責任はとれませんので、ご自身でバックアップをとって作業しましょう！

また、アップデートによりデザインが修正前に戻ることを防ぐため、子テーマの導入もおすすめします。

カスタマイズは自己責任ってことですね

カスタマイズ後のイメージ

なんか押したくなってきたんじゃない？今すぐ、押してもいいんだよ～

ちなみにTHE THORには記事最下部にもシェアボタンがあるので、そちらもカスタマイズしてみました。

シェアするなら記事全部読んでからなんで、最下部のシェアボタンにコメント入れておく方がシェアされやすいはず。たぶん。。。

結局、記事の内容がショボかったらシェアされんと思うけどね

THE THORのシェアボタン上下に文章を入れよう【コピペOK】

シェアボタンの上に文章を入れる

.social-top:before,.social-bottom:before{
content: "　　参考になったらシェアしてちょ♪";
font-size: 1.2em; 
color:#e13a37; 
font-weight: bold; 
}
.social-top,.social-bottom{
text-align:center;
}

シェアボタンの下に文章を入れる

.social-top:after,.social-bottom:after{
content: "　　参考になったらシェアしてちょ♪";
font-size: 1.2em; 
color:#e13a37; 
font-weight: bold; 
}
.social-top,.social-bottom{
text-align:center;
}

THE THORのシェアボタンカスタマイズ：まとめ

今回はわたしが利用しているWordPressテーマ「THE THOR」のシェアボタンのカスタマイズを紹介していきました。

あくまでシェアを後押しするためのカスタマイズになるので、実際にシェアされるためには読者の役に立つ記事を作成する必要があります。

どんどん価値ある記事を作っていきましょう！