Square Beat Engine

Blog for variety of things…

WordPress

テーマのカスタマイズ

投稿日:2014-11-09 更新日:

テーマのカスタマイズを進めて、色の設定や見出しの変更などを実施した。

テーマの理解

Stinger5では、色の変更はカスタマイズから行うことができる。
「基本色(キーカラー)」という項目があり、4箇所の色を設定することができる。
最初はこれを変更してみたが、自分の思った通りにできないため、CSSで各アイテムを個別に設定したくなった。
しかし、どういう仕組みになっているかわからず、試行錯誤をして、以下のことを突き止めた。

  • 基本色(キーカラー)で設定した値は、header.phpにあるwp_head();にて呼び出され、記事ページのhtmlページの<head>部分に直接CSSとして記述される。
  • Stinger5では、function.phpでそのための関数が追加されており、不要な場合に削除すべき範囲がコメントされている。(作成者の方がご丁寧に説明してくださっている)
  • WordPressでは、<body <?php body_class(); ?>>によって、背景等を動的によい紺で、ページごとに異なるクラスを適用する仕組みがある。

今回、function.phpの不要部分(カスタマイザー部分)をさくっと削除した。
本当はコメントアウトにとどめたかったんだけど、コメントアウトがネストしてしまうため削除した。

参考:PHPのコメントアウト

PHPでは、複数行のコメントアウトである「/*」は、最初に「*/」が出現した時点で解除されてしまう。
したがって、以下のようにコメントアウトをネストするのは極力避けた方がいい。

この例では、AからCまですべてコメントアウトしたいのだが、AとBのみコメントアウトされ、Cは残ってしまう。

見出しのスタイル編集

<h2>のスタイルを編集した。というかしている途中。
デザインは不慣れすぎて、時間がかかって仕方がない。
本当はきちんと決めて進めるべきだろうけど、スキル不足の現段階では学ぶことが最優先のため、試行錯誤して進めることにする。

2014/12/1追記

時間が経ってから見てみると、見出しはこのままでも十分な気がしてきたので、そうすることに決めた。
変更部分のメモは以下の通り。

  • RSSの色は、.rssboxbackground-colorを変更。
  • 検索BOXは、#s#serachsubmitbackground-colorを変更
  • 記事中のタイトル下は、.blogboxを変更。
  • pなど、CSS内に重複しているものが散見されたので、整理した。(ほかにどんなセレクタがあったかは忘れたが、いくつかあった)
  • ulolliに、font-sizeの設定があった。pと設定が重複しているので削除。

ブログ開設シリーズ記事

前回「プロフィール作成」

次回「WordPressフォルダ名の変更」

以上!

-WordPress

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

WordPressフォルダ名の変更

ドメインを取得してサイトに設定したので、その方法をメモしていく。 何だかとても大変だったので、今回はその準備作業まで。 WordPressファイルのフォルダ名 ドメインを設定する前に、WordPres …

WordPress テーマのカスタマイズ その2

ブログのデザインを変更した。 以前の記事と重複するため、どのようにまとめようか悩んだが、「迷ったときはまず投稿」ということで、今回行った作業を記しておく。 方針 記事部分がうまく整列されておらず、ガタ …

Googele Analyticsとテーマのインストール

今日もブログ構築を少し進めた。知らないことばっかりで、一つ一つに時間がかかってしょうがない。だがしかし、その経験が必要なのだ。 Google Analytics 設置 実は昨夜ちょろっと設置してみたん …

ドメインの取得

ドメイン取扱業者(レジストラ)はいくつかあるが、以前使ったことがあるという理由から、お名前.comを利用した。 ドメインを決める ドメインを取得する前に、当たり前だがドメインを決める必要がある。 現在 …

WordPressのプレビューが使用できない問題

VirtualHostの設定をしてから、プレビューが利用できなくなっていることに気づいた。 ちょっと調べてみたらいくつか方法が見つからず、どれもうまくいかなかったが、試行錯誤の上あっけない決着を見た。 …