フォローボタンの色を変更したい場合

PR 2016/2/13

このトピックには3件の返信、2人の参加者があり、最後にjump-upにより10年、 7ヶ月前に更新されました。

3件の返信スレッドを表示中

投稿者

投稿
- 2016年2月13日 12:52 PM #36448
  
  jump-up
  ゲスト
  
  お世話になります。
  カスタマイズのSNSの項目で、「フォローボタンに色をつける」にチェックを入れると親CSSで既に!importantを使用して色設定しているので、特定のフォローボタンだけ色を変更しようとしても無理なんでしょうか？
  特定のフォローボタンだけ色を変更したい場合は、「フォローボタンに色をつける」のチェックを入れずに、全てのフォローボタンに対して子テーマCSSで
  ul.snsp li.flickr-page a{
  color:#0063dc !important;
  のような感じで色設定するしかないでしょうか？
  
  ※今まで全ての色に対して子テーマCSSで色設定していたのですが、カスタマイズ項目を見ていると「フォローボタンに色をつける」という項目があったのでチェックしてみたら、flickr以外は自分で色設定していたものと同じ色になったので、子テーマCSSでflickr以外全部削除してflickrだけ色設定しようとして、アレ？ってことになりました。
- 2016年2月13日 6:09 PM #36456
  わいひら
  キーマスター
  Simplicityのバージョンはなんでしょうか？
  Simplicity2であれば、子テーマで同様に上書きすれば、importantも上書きできるかと思います（子テーマの方が後に呼び出されるので、後の方が優先される）。
  Simplicity1で子テーマでの上書きする場合は、ul.snsp li.flickr-page a以上の優先度のあるしCSSセレクタで書けばimportantも上書きできるかと思います。
  例えば、以下のように書くとか。
```
body ul.snsp li.flickr-page a{
color:#0063dc !important;
```
  CSSセレクタの優先度については、以下の記事なども参考にしてみてください。
  CSSセレクタの優先度を手軽に計算して比較できるツール「Specificity Calculator」
  
  もし、それでもうまくいかない場合は、実際のページのURLを掲載していただければ、デベロッパーツールなどで見ることで、上書きできる、CSSセレクタなどもアドバイスできるかと思います。
- 2016年2月13日 9:04 PM #36475
  jump-up
  ゲスト
  早速の回答ありがとうございます。Simplicity2.0.1バージョン: 2.0.1 20160105でした。
  子テーマのSimplicity2 child: スタイルシート (style.css)に、
```
body ul.snsp li.flickr-page a{
color:#0063dc !important;
```
  と入れてみましたが、やはり色は変更されませんでした。
  
  実際のページのURLは非公開状態で作りこんでいるところなので、見れないと思います。
  私の方でももう一度、Chromの機能で確認してみます。
  ありがとうございました。
- 2016年2月13日 9:15 PM #36476
  jump-up
  ゲスト
  お世話になります。
  デベロッパーツールで確認すると spanが必要だったのかな？と…
  以下のようにすると無事反映されました(≧∇≦)/
```
ul.snsp li.flickr-page a span {
color:#0063dc !important;
}
```
  大変失礼しました。ありがとうございます(≧∇≦)/
投稿者

投稿