Prev 1 2 ... 28 29 30 31 32 33 Next

WordPressテーマTwenty Elevenのヘッダーのタイトル部の背景色の変更方法

Pocket
LINEで送る

本投稿記事の内容は、「WordPress3.3.1」のテーマ「Twenty Eleven1.3」での話であり、バージョンが大きく異なると動作しない場合があります。
※2012/06/03追記 「WordPress3.3.2」での動作を確認しました。
※2012/06/20追記 「WordPress3.4」テーマ「Twenty Eleven1.4」での動作を確認しました。
※2013/01/07追記 テーマ「Twenty Twelve」の場合については「WordPressテーマTwenty Twelveでヘッダーのサイトタイトル、キャッチフレーズ、ヘッダー画像の背景色、フォントを変更する方法」と「WordPressテーマTwenty Twelveでヘッダー、コンテンツ、サイドバー、フッターそれぞれの背景色を変更する方法」を参考にして下さい。

WordPress3.3.1テーマTwenty Elevenの設定において、全体の背景色を変えるのには、
管理画面の「外観」-「(カスタム)背景」-「表示オプション」-「背景色」
で設定出来ます。しかし、これでは、ヘッダー、コンテンツ、サイドバー、フッター部の背景色を変えることは出来ません。

いろいろ調べたり、試したりした結果、ヘッダーのタイトル部について背景色の変更方法が分かりました。

ヘッダーのタイトル部の背景色の変更設定

/wp-content/themes/twentyeleven内にある
「style.css」の「Headerの#branding」の箇所で「background: #背景色;」
を追加すれば変更出来ます。小テーマを作っている場合は、間違えず小テーマ側の「style.css」を変更して下さい。

例)「style.css」
背景色を#f5faf1へ変更する場合


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
/* =Header
----------------------------------------------- */

#branding {
	border-top: 2px solid #bbb;
	padding-bottom: 10px;
	position: relative;
	z-index: 9999;
}
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


|「background: #f5faf1;」を追加


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
/* =Header
----------------------------------------------- */

#branding {
	border-top: 2px solid #bbb;
	padding-bottom: 10px;
	position: relative;
	z-index: 9999;
	background: #f5faf1;	/*	追加	*/
}
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

これで背景色が変わるはずです。

その他に、いろいろとヘッダーをカスタマイズするのに

が参考になります。

Pocket
LINEで送る

スポンサーリンク

WordPressテーマTwenty Elevenで投稿記事の投稿日表示で時刻も表示させる方法

Pocket
LINEで送る

本投稿記事の内容は、「WordPress3.3.1」のテーマ「Twenty Eleven1.3」での話であり、バージョンが大きく異なると動作しない場合があります。
2012/06/03追記 「WordPress3.3.2」での動作を確認しました。
2012/06/20追記 「WordPress3.4」テーマ「Twenty Eleven1.4」での動作を確認しました。

WordPress3.3.1テーマTwenty Elevenの設定において、投稿記事の投稿日で時刻を表示させるのに悩まされていた。(YYYY年M月D日 HH:MMと表示させたかった)

管理画面の「設定」-「一般設定」の「時刻フォーマット」にて、希望の時刻表示にチェックを入れても表示されないのである。カスタムで「H:i」と入れてもダメである。

試しに、「日付のフォーマット」のカスタムで「Y年n月j日 H:i」と入力したら、めでたく表示される様になった。ついでに「Y年n月j日(l)H:i」として曜日も表示させる様に設定した。

Pocket
LINEで送る

初めてWordPressのインストール及び設定をして分かったこと

Pocket
LINEで送る

今回、ブログの移転にあたり、初めてWordPressのインストール及び設定を行ったのだが、色々と分からないことがあり、ネットを調べ回ってやっと公開出来る状態になった。一応、気がついたことを記録に残しておく。

まず、思ったのが、

  • WordPressのバージョンが異なる事でネット上で書かれてる内容が使えないことがあること
  • カスタマイズするなら子テーマを作って編集した方が良いこと

である。

WordPressのバージョン違い

今回インストールしたのはWordPress3.3.1で、テーマはデフォルトのTwenty Elevenであるが、バージョンが古く、テーマがTwenty Tenで使えなかったり、同じTwenty Elevenでも若干異なり、用をなさないものが多くあり、その中から生きた情報を探すのに苦労した。WordPressのバージョンとか、テーマを記載しておいてくれたら、無駄な時間を取らなくて済んだと思う。

子テーマを作ってカスタマイズ

twentyelevenやtwentytenのフォルダの中身のファイルを直接編集しても、カスタマイズ出来るが、子テーマを使うとTwenty ElevenやTwenty Tenなどのテーマを元に、変更箇所を記述すれば良いので管理が楽である。WordPressをバージョンアップしても、子テーマは上書きされず残っているので、設定を消してしまうこともないので安心である。

それから、テーマにはいろいろあるが、デフォルトのTwenty Elevenがスマートフォンにも対応しているし、分からないことがあればネットで情報があるので、このWordPressのバージョンでは最新のTwenty Elevenがお薦めである。

小テーマについては、

を参考に作成すると良いでしょう。

Pocket
LINEで送る

 Prev 1 2 ... 28 29 30 31 32 33 Next

スポンサーリンク