AFFINGER

【AFFINGER5】SNSボタンの文字テキストをカスタマイズする方法

2020年4月17日

SNSボタン カスタマイズ

 

稼ぐことに特化したWordPressテーマ「AFFINGER5(アフィンガー)」。

 

今回はSNSボタンの文字テキストのカスタマイズ方法をご紹介します。

当ブログおすすめしているブログテーマ「AFFINGRE5(アフィンガー)」をまだ導入してない方はこちらをどうぞ。

おすすめ
AFFINGER5 初心者 徹底解説
有料テーマ「AFFINGER5」を初心者に向けて徹底解説する

続きを見る

 

CSSのコピペでできるので、簡単にすぐ終わります!!

 

SNSボタンの文字テキストのカスタマイズ方法

SNSボタンの文字テキストとは

こういったものを指します




SNSリンク

SNSボタン


 

アイコンも直感的にわかりますが、文字があるとスマートに見えます。

 

では、さっそくやっていきましょう。

SNSボタンの文字テキストのカスタマイズ方法

step
1
WordPress管理画面>AFFINGER5管理>SNSから「SNSボタンをシンプルにする」のチェックを外します

SNSボタン丸くする

ポイント

チェックが入っているとこうなります。(※丸くする適用)

SNSリンク

step
2
WordPress管理画面>外観>テーマエディタから「sns.php」を選択し開きます。

 

以下のコードを探します。(control+f or ⌘+fで「コピーする」と検索すると見つけやすいです)

<!--URLコピーボタン-->
<li class="share-copy">
<a href="#" rel="nofollow" data-st-copy-text="<?php echo esc_attr( $title . ' / ' . $url ); ?>"><i class="fa fa-clipboard"></i><span class="snstext" >コピーする</span></a>
</li>

赤文字部分、「コピーする」を任意の文字にすると変更できます。ここでは「URLコピー」とします。

最後にファイルを更新して終了です。

 

まとめ:ページ数リンクのカスタマイズをしてわかりやすくしよう

以上、SNSボタンの文字テキストのカスタマイズ方法ついてご紹介しました。

 

アイコンでスッキリさせたい場合は文字の表示はなくし、AFFINGER5ならすぐ設定できるのでそちらを活用してもいいと思います。

文字が入るとアイコンだけではわからないこともわかるようにできるので、スマートにみえます。

訪問者にとって自分が今何ページ目を見ているのかわかることは、とてもいいことですので、訪問者目線でサイトのみやすさは追求していくべきですね。

 

今後もこういったAFFINGER5の記事を紹介していきます。

まとめ記事
AFFINGER5 カスタマイズ
AFFINGER5のカスタマイズ・CSS一覧

続きを見る

 

今回は以上です。

-AFFINGER

© 2021 RYO'S NOTE