SWELL記事下「フォローしてね!」のテキストを変更する

SWELL記事下「フォローしてね!」のテキストを変更する

SWELLの投稿ページ記事下には「この記事が気に入ったらいいね または フォローしてね!」と表示できるエリアが用意されています。

このエリアはアイキャッチ使用や各SNSのボタンの表示などデザインが凝っていて素敵だと感じています。

ただ「フォローしてね!」というテキストが必ずしもサイトの雰囲気と合うとは限りません

残念ながら投稿日時点ではテキストを自由に変える設定はありません。

今回はそんなフォローを促すテキストを自由に変更する方法を紹介します。

このページではSWELL公式の呼称に沿って「SNSアクションエリア」と記載します。

目次

SNSアクションエリアとは

投稿ページの記事下エリアに設置することができるSWELL特有のコンテンツです。

アイキャッチ等目を引くデザインでSNSへのアクションを期待することができます。

SNSアクションエリアの表示項目は次の通りです。

  1. ページに設定したアイキャッチ
  2. 各SNSのフォロー・いいねボタン
  3. フォロー・いいねを促すテキスト

設定を変更できる項目は2番目のみです。

3番目はサイト管理者で自由に変更できる設定はありません。設定したボタンによって自動でテキストが変わります。

そらしど

SWELL内のよく似た機能に「SNSシェアボタン」があります。こちらはカスタマイズ画面から変更できます。

画面遷移
  1. カスタマイズ画面
  2. 投稿・固定ページ
  3. SNSシェアボタン

カスタマイズ手順

解決方法

テキストを変えるコードはSWELLERS’のフォーラムに投稿されています。

コードはそのまま使います。「どこに記述すればいいのかわからない」という方のために、このページではコピペする場所も合わせて解説します。

PHPとスクリプトの2種類があるので両方とも解説しますが、フォーラム記載の通りPHPでカスタマイズするのがおすすめです。

完成イメージ

今回のカスタマイズをすると次のようになります。

SWELL記事下「フォローしてね!」のテキストを変更する完成イメージ

PHPでカスタマイズ

カスタマイズをPHPで行う場合はfunction.phpにコードを追記します。

編集にはCode Snippetsというプラグインを使用するのがおすすめです。子テーマを使ってない方やPHPファイルの直接編集に抵抗がある方でも使いやすいです。

Code Snippetsの詳細と使い方

ここではfunction.phpを編集する手順を紹介します。

テーマエディターからも編集できますが、PHPは特に注意が必要な為おすすめしません。

サーバー操作の手順は私が使っているConoHa WINGを例に進めます。

ファイルマネージャーの操作方法を見ながら進めるとスムーズに進められます。

PHPでSNSアクションエリアのテキストを変更する手順

STEP
サーバーにアクセスする
ここをクリックすると手順を開閉できます

ConoHa WINGにログインします。

画面遷移
  1. サイト管理
  2. ファイルマネージャー(ログインが求められる場合があります)
STEP
function.phpをダウンロードする
STEP
function.phpを編集する
STEP
function.phpをアップロードする

スクリプトでカスタマイズ

jQueryと呼ばれるJavaScriptのライブラリを使った方法も紹介されています。

PHPの編集に抵抗がある場合はこちらで修正することもできます。

しかしSWELLは「脱jQuery」しようとしているように見えるWordPressテーマなのであまりおすすめはできません。

そらしど

使えなくなることはないと思いますが、あくまで第二候補くらいに考えた方がいいです。

スクリプトでSNSアクションエリアのテキストを変更する手順

STEP
高度な設定を開く
ここをクリックすると手順を開閉できます

カスタマイザーからSWELLの高度な設定を開きます。

画面遷移
  1. カスタマイズ画面
  2. 高度な設定
STEP
スクリプトを追記する
STEP
公開する

まとめ

SNSアクションエリアのテキストを変更する手順を解説しました。

サイト内の雰囲気は重要です。自分好みのサイト作りの一助になれば幸いです。

分からないことや質問があれば下記から気軽に連絡ください。

そらしど

最後まで読んでいただきありがとうございました。

SWELL記事下「フォローしてね!」のテキストを変更する

この記事が気に入ったら
フォローをお願いします!

よかったらシェアお願いします
  • URLをコピーしました!
  • URLをコピーしました!
目次
トップへ
目次
閉じる