THE THOR ザ・トール SNSボタン (シェアボタン) 一覧

当サイトでは THE THOR というテーマを利用しています。

 

THE THOR には SNSボタンのデザインパターンが11種類あります。

ひとつひとつ切り替えてプレビューで見るのは面倒なのでデザインパターンまとめました。SNSボタンを選ぶときの参考になれば幸いです。

 

カスタマイズはこちら

THE THOR の シェアボタンをカスタマイズ してみました。   見知らぬ人がコップに入ったお水を目の前に置いたらアナタはどうしますか?   死ぬほどノドが乾いていたら飲むかもしれません。でも[…]

シェアボタン SNSボタン THE THOR

 

THE THOR SNSボタン の設定

SNSボタン関連の設定は以下の場所で行います。


デザインを決める
外観 → カスタマイズ → パーツスタイル設定[THE] → シェアボタン設定(個別ページ用)

ここではSNSボタン(シェアボタン)のデザインを決定します。
デザインパターンは11種類です。

 

 

投稿ページの設定
外観 → カスタマイズ → 投稿ページ設定[THE] → シェアボタン設定

投稿ページでのSNSボタン(シェアボタン)の表示/非表示/場所を設定します。
SNSは8種類用意されています。

 

 

固定ページの設定
外観 → カスタマイズ → 固定ページ設定[THE] → シェアボタン設定

固定ページでのSNSボタン(シェアボタン)の表示/非表示/場所を設定します。
SNSは8種類用意されています。

投稿ページと固定ページで別々に設定することができます。固定ページは記事ページとは雰囲気を変えたいという事は多くあり、とても親切な設定です。


 

※固定フッターエリアにもシェアボタンの設定がありますが、こちらはデザインの変更ができないようです。SNSの種類は選べるので固定フッターエリアを使用している人はこちらもチェックしてください。

固定フッターエリアの設定
外観 → カスタマイズ → 共通エリア設定[THE] → 固定フッターエリア設定[スマホ専用]

利用できるSNSの種類

  • Facebook
  • Twitter
  • Google+
  • はてぶ
  • Pocket
  • LINE
  • LinkedIn
  • Pinterest

 

Google+はサービスが終了したので実質7種類。

どのSNSボタンを利用するのか?はたまた全て表示させるのか?難しいところですね。

SNSボタン デザインパターン

SNSボタン(シェアボタン)を全部見てみましょう。

※画像はタブレットサイズでのプレビューになります。
※サービスの終了したGoogle+は除きました。


パターン1(デフォルト)

ボタンが隙間無く並びます。画面サイズに合わせて2列3列と変化。表記はロゴマークのみ。

SNSボタン 01


パターン2

ボタンの間に隙間があるタイプ。こちらも画面サイズに合わせて列が変化します。表記はロゴマークのみ。

SNSボタン 02


パターン3

ロゴマークのみを四角でコンパクトに表示。コンパクトなので基本的に1列で表示されます。

THE THOR SNSボタン 03


パターン4

パターン3の立体バージョン。

THE THOR SNSボタン04


パターン5

ロゴマークのみを少し大きな四角で表示。画面サイズにより2列になります。

SNSボタン05


パターン6

パターン5の立体バージョン。

SNSボタン06


パターン7

ロゴマークと文字を表示。横幅いっぱいになるようにボタン幅が調整されます。

SNSボタン07


パターン8

パターン7の立体バージョン。

SNSボタン08


パターン9

ロゴマークと文字を表示するタイプ。文字の長さによってボタンの幅が変化します。画面サイズにより列数が変わり左寄せで並びます。3列になるとデコボコした見た目がアクセントになります。

SNSボタン09


パターン10

パターン9の立体バージョン。

SNSボタン10


パターン11

ロゴマークと文字をコンパクトに表示。文字数で横幅が変化します。画面サイズにより列数が変わり左寄せで並びます。

SNSボタン11

以上です。

あとがき

どのデザインにするか?

表示するSNSはどれにするか?

迷います。

個人的にはボタンは少なく大きく表示したいと考えたので、パターン2でSNS2種を表示しています。

SNSの種類はTwitterとLINEのみにしました。

パターン2はロゴのみなので文字を追加するカスタマイズをしたいと思います。

文字の追加はパターン7が簡単だったので設定をパターン7に変更しました。

 

カスタマイズはこちら

THE THOR の シェアボタンをカスタマイズ してみました。   見知らぬ人がコップに入ったお水を目の前に置いたらアナタはどうしますか?   死ぬほどノドが乾いていたら飲むかもしれません。でも[…]

シェアボタン SNSボタン THE THOR
SNS シェア ボタン 一覧
呟くのよ・・・私の棒ストが