WordPressテーマSANGOの質問

シェアボタン（FAB）のスタイルを変えたい

NANA

2018/10/30

こんにちは。記事タイトル下（サムネイル画像下）の自動のシェアボタンをカスタマイズする方法がどこか説明されているのでしょうか？アイコン前にSHAREの文字を入れたいです。よろしくお願い致します。

SANGOでデフォルトの見出しを変える方法

コメントへの回答

サルワカくん

2018/10/30

解説記事はありませんが、以下のCSSを追加することで、表示が可能です。

.article-header .sns-btn:before {
    margin-top: 10px;
    content: "SHARE";
    font-family: Quicksand, sans-serif;
    font-weight: 500;
    font-size: 20px;/*フォントサイズ*/
    letter-spacing: 1px;
    display: block;
    text-align: center;
}

もしシェアボタンと余白の間が気になるようであれば（シェアボタンを２種類のうち、どちらを選んでいるかによりますが…）以下のCSSを追加すると良いかと思います。

.article-header .sns-btn ul {
    margin-top: 0;
}

一度ご確認をよろしくおねがいします。

返信する

NANA

2018/10/30

ご返答ありがとうございました！試しましたが、シェアボタンを押してからの変更でしたね。押す前の、「Extended FAB」スタイルのシェアボタンを作りたかったです。説明が下手で申し訳ありませんでした。
ですが、調べたら、Ver1.5のアップデートでは「Extended FAB」スタイルのシェアボタンを選べるようになったと書かれていましたね。まだアップデートをしていなかったので気付きませんでした。すみません。