SWELLのテーマでお知らせバーを大きくするカスタマイズ方法

この記事ではWordpressテーマ「SWELL」の、

と思っている方に、お知らせバーをたった１つのCSSを加えるだけでカスタマイズできる方法を紹介します。

お知らせバーとは

このブログでは、この部分がお知らせバーです。

小さめでオシャレなんですが、クライアントさんから「もう少し大きく出来ないかな？」

と依頼があって色々と調べてやっとカスタマイズできました(^-^;

写真はカスタマイズ前のものです。

表示設定する部分

お知らせバーの設定が分からない方に、どこから設定して表示するのか先に紹介します。

外観→カスタマイズ→サイト全体設定を開いてください。

サイト全体設定にある「お知らせバー」をクリックします。

このブログと同じ位置に表示する場合は、「ヘッダー下部に表示」を選択。
※カラー設定や背景設定は割愛しますm(__)m

お知らせバーの文字の大きさのデフォルトは普通になってます。そのままでOKです。

ちなみに、「普通」と「大きく」を比較した写真がこちらです。

カスタマイズ手順

 追加したCSSはこちら

.c-infoBar__btn {
font-size: 23px;
margin-left: 5px;
color:#fff;
}

font-size: 23px;は文字の大きさを指示
もっと大きくしたい場合は数値を変えてみてくださいね。

まとめ

この記事ではWordpressテーマ「SWELL」の、お知らせバーを大きくするカスタマイズ方法を紹介しました。

「あそブログ」では、ちょっとした地味なカスタマイズ例を備忘録代わりに更新しています。