WordPressテーマ「Nirvana」カスタムCSS設定

本ページのテーマは「Nirvana」を使っています。(※現在は別のテーマを利用しています)

カスタム機能も充実しており、自由なレイアウトを可能にしてくれます。

20150114_nirvana01

ただ、Wodpressの無料テーマの多くは海外のデザイナが制作したものなので、日本語にはフォントの種類やスペースなどが合わないことが多いです。
Nirvana もそのまま日本語を表示するとなんかかっこ悪いですね。

まだ、完全にかっこよくわできていないですが、フォントやスペースなどいじって見ました。

まず、管理画面から、「外観」→「Nirvana Settings」→「テキスト設定」を開くと各フォント種類とサイズを指定することができます。
ここで特徴的なのは、右側の欄にGoogleフォントを指定することができます。当サイトではとりあえず「Noto Sans CJK JP Regular」を指定しました。

20150114_nirvana02

これだけだと、トップページのテキストエリア、コラムエリアのタイトルの文字サイズなどが変更できないので、カスタムCSSで設定を上書きします。

20150114_nirvana03

今回、カスタムCSSに設定した項目

スライダー上のテキストをセンタリングする
.slide-text {text-align: center !important;}

注:「!important」を付けないとカスタムCSSの設定が優先されません。
参考 → http://www.cryoutcreations.eu/forums/t/presentation-page-center-text-on-slider

テキストエリアとコラムエリアのタイトルの文字サイズ変更
#front-text1 h2,
#front-text2 h2,
#front-text5 h2,
#front-columns h2 {
    font-size: 30px !important;
    line-height: 32px !important;
}
テキストエリアの余白調整
#pp-texttop,
#pp-textmiddle,
#pp-textbottom,
#front-columns-box,
#content {
    padding: 30px 0 !important;
}

これらは、template/nirvana/styles にある、style-fronpage.css を見ていくとどういった設定をすればいいか推測できるかと思います。

なかなかこのテーマについての日本語の情報が少なくて苦労しました。「wordpress Nirvana」で検索するとロックバンドの情報がいっぱい出てくるし。まあ、このバンドも聴いていましたが。

このテーマ Nirvana についての情報がここにもあるよって方、是非コメント頂ければ幸いです。

2 COMMENTS

naoko toyoda

こちらの記事を拝見して、カスタマイズできました。ありがとうございました!!どうしてもトップページのタイトルサイズが大きいのが気になって困っていて、やっと理想の記事にたどりつきました。Nirvanaの記事またアップしてください。よろしくお願いします(^^)

返信する
sato

はじめまして!コメントありがとうございます!
Nirvanaの日本語の情報って少ないですよね。またテーマいじった際には記事書こうかと思います。
よろしくお願いします。

返信する

コメントを残す

コメントは当サイト運営者の承認後に反映されます。
お名前はニックネームでも結構です。