\このブログが役に立ったら/
【SWELL】タグの色(表示)を変更する【コピペカスタマイズ】
![【SWELL】タグの表示を変更する【コピペカスタマイズ】](https://misaki-web.com/wp-content/uploads/2021/01/405ff40a701a31d4a17e2d62ad103366.png)
SWELLのデフォルト機能だと、タグの表示デザインを変更する事ができません。
そのままでもシンプルでいい感じですが、ちょっと無機質というか、男性寄りなイメージですよね。
追加CSSでカスタマイズしてみます。2パターン作ったので好きな方を使ってください。
もくじ
SWELLカスタマイズ:タグの表示変更を2パターン紹介
CSSを貼り付ける場所は「外観」→「カスタマイズ」→「追加CSS」です。
インデント付けてないので、自由に調節してください。
塗りつぶし
![【SWELL】タグの表示を変更する【コピペカスタマイズ】塗りつぶし](https://misaki-web.com/wp-content/uploads/2021/01/db1f6ec937776b2053a3f4db0eceffbd.jpg)
/* タグカスタマイズ */
.tag-cloud-link {
padding: 8px 10px;
color: #fff!important;
background: #ec5858;
border-radius: 5px;
}
.tag-link-count {
color: #fff;
}
- color=文字色
- background=背景色
です。お好きな色に変更してください。
白抜き
![【SWELL】タグの表示を変更する【コピペカスタマイズ】中抜き](https://misaki-web.com/wp-content/uploads/2021/01/2c987d1979e850eafd95ff9b601353f0.jpg)
/* タグカスタマイズ */
.tag-cloud-link {
padding: 8px 10px;
color: #ec5858!important;
background: transparent;
border: solid 1px #ec5858;
border-radius: 5px;
}
.tag-link-count {
color: #ec5858;
}
背景は透明にしているので、サイトの背景色や画像が透けちゃいます。
嫌な方はbackgroundを白とかに設定すると良いかもです。
お気軽にどうぞ!