ストークでタイトル下だけSNSボタンを非表示にする方法




こんにちは、ストーク愛用者の龍一です!

 

さっそくですが、まだ記事を読んでもいないのにシェアしようとは思いませんよね?

そこで、自分と同じでタイトル下のSNSボタンだけを非表示にしたい方がいると思いますので、やり方を解説していきます。

ついでに、投稿日を非表示にして、更新日だけ表示する方法も一緒に解説します。

やり方は非常に簡単なので安心してください。テーマの編集でPHPを編集しなくて大丈夫です。行う作業はコピペだけなので簡単にできます。

ワードプレスの専用のテーマ(テンプレート)の「ストーク」を使用している人に向けた記事なので、他のテーマでは使用できません。 

 

SNSボタンを消したい理由

タイトル下にSNSボタンを設置している人が多数いますが、ほとんど押されていないはずです。記事を読み終わってから押すので、記事下のSNSボタンだけあればいいと思いました。

記事を読み終わってシェアしたいと思ったら、記事下のSNSボタンを押すと思います。わざわざ、タイトル下まで戻って押そうとは思わないはずです。

もう一つの理由が、ページの表示速度を上げるためです。非表示にすることで、僅かですが速くなりました。

 

ストークの設定でも消すことができる?

SNSボタンの設定

カスタマイズでSNSボタンを非表示にすることも可能です。

しかし、この方法だと問題があります。それは、タイトル下だけではなく記事下のSNSボタンも非表示になってしまいます

ブログからすべてのSNSボタンを非表示にしたい方は、この方法で大丈夫です。

 

投稿日・更新日の設定

投稿日と更新日の設定はカスタイマイズでできますが、更新日だけを表示することはできません。

 

SNSボタンのみ消す方法と更新日だけ表示する方法

「記事上(タイトル下)のSNSボタンの非表示と更新日だけの表示方法はありませんか?」と、ストークの販売会社のオープンケージに問い合わせて、非表示にする方法を聞きました。

解説する方法は、オープンケージから教えてもらった方法です。

 

何も設定していなければ、タイトル下にSNSボタンが表示されます。

それでは、非表示にする方法を解説していきます。

 

赤枠内の「カスタマイズ」をクリックします。

 

赤枠内の「追加CSS」をクリックします。

 

何もしていない人は、空白の状態だと思います。

ここに、下記のコードをコピペしてください。

SNSボタンが非表示になり、更新日だけが表示されるようになります。

.share.short,
.entry-date.updated {
display: none;
}
.entry-date.undo.updated {
display: block;
}

 

これが実際に自分が質問して、オープンケージから返ってきた返信内容です。

注意点
この方法は更新日しか表示されないので、更新していない記事は日付が表示されません。

 

まとめ

PHP編集などの難しいことはなく、コードを追加CSSに記述するだけなので簡単に誰でもできます。

タイトル下のSNSボタンを消すとシンプルな見た目になるので、シンプルなデザインが好きな人にオススメです。

僅かですが、ページの表示速度が速くなるので遅くて困っている人は試してください。










2 件のコメント

  • コメントを残す

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

    このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください