【SWELL】SNSシェアボタンの表示/非表示/設定変更の方法

< スポンサー リンク >

【i】当ページはプロモーションが含まれています

ここでは、WordPressテーマ・SWELLのSNSシェアボタンについての設定やカスタマイズ方法を解説します。

SWELLには表示できるSNSボタンが3パターンあります。

SWELLのSNSシェアボタン
SWELLのSNSシェアボタン
SNSボタン:3種類
  • 記事上部
  • 記事下部
  • 左サイド(スクロール追従)

サイトのレイアウト方針によって表示する・しないや、デザインの変更などを行ってみましょう。

 

(1)上部管理メニューの「カスタマイズ」をクリックします。

WordPressのカスタマイズへ

WordPressのカスタマイズへ

 

(2)カスタマイズモードになるので「投稿・固定ページ」をクリック。

カスタマイズの投稿・固定ページへ

カスタマイズの投稿・固定ページへ

 

(3)「SNSシェアボタン」をクリック。

SNSシェアボタンの設定へ

SNSシェアボタンの設定へ

 

(4)SNSシェアボタンの設定変更はここで行います。

SNSシャアボタンの設定変更

SNSシャアボタンの設定変更

 

次項で詳しい設定方法について説明します。

ちなみに、カスタマイズ画面の変更を反映させるときは上部メニューの『公開』をクリックし、『×』で終了、『<』で前の画面に戻ります。(共通の操作)

カスタマイズを反映させる

カスタマイズを反映させる

SNSシェアボタン:各項目の設定方法

SWELL、SNSボタンの設定画面でできる項目をそれぞれ解説します。

シェアボタンの設定
  • ボタンの表示位置
  • ボタンの種類
  • ボタンデザイン
  • URLコピーボタン
  • 記事下部ボタン上のメッセージ
  • Twitter用の追加設定

✔ ボタンの表示位置

シェアボタンを表示する位置
シェアボタンを表示する位置

 

シェアボタンの表示位置は冒頭でも紹介しましたが、

  • 記事上部に表示する
  • 記事下部に表示する
  • 画面端に固定表示する(スクロール追従)

3種類をそれぞれ、チェックのオン・オフで表示・非表示が選択できます。

SWELLのSNSシェアボタン
SWELLのSNSシェアボタン

 

✔ 表示するボタンの種類

表示するボタンの種類
表示するボタンの種類

表示するシェアボタンの種類を選択できます。

  • Facebook
  • Twitter
  • はてブ
  • Pocket
  • Pinterest
  • LINE

6種類をそれぞれ、チェックのオン・オフによる表示・非表示を設定できます。

 

✔ ボタンのデザイン

ボタンデザインの種類
ボタンデザインの種類

シェアボタンのデザインが変更できます、

  • ブロック
  • ボタン
  • ボタン(小)
  • アイコン
  • ボックス

5種類から選べます。

ボタンデザイン_ブロック
ボタンデザイン_ブロック

 

ボタンデザイン_ボタン
ボタンデザイン_ボタン

 

ボタンデザイン_ボタン小
ボタンデザイン_ボタン小

 

ボタンデザイン_アイコン
ボタンデザイン_アイコン

 

ボタンデザイン_ボックス
ボタンデザイン_ボックス

 

✔ URLコピーボタン

URLコピーボタンの設定
URLコピーボタンの設定

URLコピーボタンの表示・非表示やサイズを設定できます。

  • 表示しない
  • 小さく表示
  • 多きく表示
URLコピーボタン
URLコピーボタン

初期は『小さく表示』で、『大きく表示』にすると下記のように、横幅いっぱいになります。

大きく表示
大きく表示

私の環境だけかもですがボタン内のテキストが表示崩れしてるので、同じようになるなら『大きい表示』はあまりおすすめできません。

✔「記事下部シェアボタン」の上に表示するメッセージ

記事下部シェアボタン上のメッセージ
記事下部シェアボタン上のメッセージ

記事下部のシェアボタンの上に配置されているメッセージを変更できます。

シェアボタン上のメッセージ初期状態
シェアボタン上のメッセージ初期状態

初期は『よかったらシェアしてね!』になっています。自分なりの文言に変更しましょう。

左右の \  / (斜めマーク)は自動で付与されます。

メッセージそのものを非表示にしたいなら、テキストを全て削除し空欄にすればOKです。

✔ Twitter用の追加設定

Twitter用の追加設定.
Twitter用の追加設定.

Twitterボタンでシェアされたときのハッシュタグとメンション先を設定できます。

  • ハッシュタグ:「#」は入れず、複数ある場合は「,」で区切る。
  • Via設定(メンション先):「@●●●さんから」が付けられる(@は不要)。

あまり詳しくないなら、ここの設定は初期のままで良いと思います。

冒頭でも紹介しましたが、カスタマイズ変更の反映は上部メニューの『公開』をクリックしてください。

まとめ:SNSシェアボタン、表示やデザインはお好みで

SWELLテーマのSNSシェアボタンに関するカスタマイズをご紹介しました。

今やブログ運営だけでは収益化が難しい時代です。

無理のない範囲でSNSも有効活用して、サイテーションの向上(知名度UP)も狙っていきましょう。

閲覧ありがとうございました。

参考「SNSシェアボタン」の設定方法 | SWELL公式

≫『SWELL』関連記事

記事が参考になりましたらシェアお願いします
  • URLをコピーしました!

< スポンサーリンク >

コメントをどうぞ

コメントする

CAPTCHA


目次