PC1台で自由に人生をデザインするリクのブログ

【SANGOカスタマイズ】SNSボタン前にある「SHARE」の文字を削除する方法

SANGOを使い始めてから、コンテンツ作成が楽しくなりました。

クリエイターにとってもユーザーにとっても非常に使いやすく見やすいデザイン、限りない数の便利なアイテムたち、そしてカスタマイズ性の高さなど、総合的に見て優れたテーマである「SANGO」は、メディア運営に楽しい!という気持ちを与えてくれます。

 

ただ、そんなSANGOにもちょっとした「気になるところ」が。

今回フォーカスしていくのは、記事下にあるTwitterやFacebookなどのSNSボタンの前にある「\SHARE/」の文字。何も表示されていて悪いことなどないのですが、ちょっとメディアとして実現したい世界観と違った印象があったため、試しにこの文字を削除するカスタマイズを実践しています。

ぜひ同様の感覚を抱いた方は、解説を参考に設定を施してみてくださいね。

SANGOのSNSボタン前にある「SHARE」の文字を削除する方法

まず、SNSボタン前にある「SHARE」の文字がどこなのか?ということを確認してみましょう。次のように、コンテンツ下に表示されるSNSボタンの上にSHAREという文字が確認できます。

どうもこの文字があることによってポップな印象を与えている(もちろん悪いことではない)気がしたので、洗練されたデザインを実現したいか上では「必要ないかなぁ」と思った次第です。

そこで、今回解説していくカスタマイズ方法で、このSNSボタン前にある文字を削除してみると…

 

うん、ちょっとは印象が変わるんじゃないかなと思います。

もちろん、「SHARE」という文言は「ここにSNSボタンがあります!シェアしてね!」ということをユーザーに伝えるための大切な要素ではありますが、正直そこまでSNSボタンからシェアされる機会は多くなく、自然にボタンだけが配置されている方がデザイン的に好きだなだと思いました。

 

「そこに文字がある意味」を理解した上で削除していくというのはとても大切なこと、ぜひ実際に見てみて「たしかに」と感じた方は、以下解説を参考にカスタマイズを施していきましょう。

「外観→テーマの編集」に移動する。

まず、WordPressのダッシュボード画面から「外観→テーマの編集」に移動しましょう。

「style.css(子テーマ)」でSNSボタン前の文字を削除する。

そして、子テーマの「style.css」を選択し、次のコードを一番下のあたりに追記します。(テーマの編集を行うときは必ず子テーマで行うようにしましょう。)

 

このコードでは「display: none;」でSNSボタン前に表示されるべき文言を、非表示にするよう指定しています(ですので厳密には「削除」ではなく「非表示」)。

コンテンツ下をスッキリさせたいという場合には、ぜひ上記のコードを追加し、実際の表示を確認してみてくださいね。

最後に

以上、SANGOのSNSボタン前にある「SHARE」の文字を削除する方法を解説しました。いかがだったでしょうか?

シンプルなコードを追加するだけの単純なカスタマイズだったので、特に不便もなく設定できたと思います。もしカスタマイズが反映されない場合には、ブラウザのキャッシュを削除するなどして再び確認してみてください。

 

当メディアはあまり「SANGOっぽい」とはお世辞にも言えないかもしれませんが、独自のカスタマイズを施すことによって、実現したい世界観を自由に表現しています。

何かSANGOで実現したいカスタマイズがあったり、質問や疑問点、メディアの世界観の構築に至るまで、何かお聞きしたいことがあれば気軽にご連絡くださいね。

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です