テーマをXClusiveに変えました。

以前から使っていたテーマはartisteer というHTMLでもWordpressでも使えるテーマを出力してくれる有料ソフトを使っていました。
http://www.artisteer.com/
今は上記のサイトを見ると4.2なのですね。僕が買った当初は2.1ぐらいでしたか。

デザイン自体は気に入っていたのですが、表示領域が狭いなぁという所とか
背景画像とかが重いなぁとか思う所はあったので、自分で改造しようと思っていました。
しかし、IE6などのレガシーなブラウザに対応すべく、角丸とかが画像だったりしていたのでこれは難しいと断念してしまいました。

http://xparkmedia.com/
こちらが提供している「XClusive」というテーマにしてみました。

XClusiveバージョン: 0.1.8
作成者: Xpark Media

The XClusive theme is a fully responsive theme that looks great on any device. It supports all custom formats, Image header, custom logo and provides 4 color schemes. Provides 2 page template, No sidebar and Landing to create your custom home page.

一番気に入った特徴は右のサイドメニューが閉じてくれることで、引用やソースを書いた部分が広く出るようになりました。
トップページの背景画像は2014/8/7に広島へ帰省した時のレストランからの展望です。台風が来る直前の晴れ間でした。

とはいえ、最初の見た目に近づけるべく変更したところも。

　メニューから「外観」→「テーマ編集」→「XClusive: スタイルシート (style.css)」を編集して保存しています。

・背景色　真っ白だったんですが、青色をいれました。

　こっちはWordpressのメニューからできたので、CSSをいじっていません。
　メニューから「外観」→「背景」→「カスタム背景」で色を選択しています。
　

・引用部分　これも背景色が白かったんですが、薄紫を入れました。

/* =Blockquote
-------------------------------------------------------------- */
blockquote, q {
	quotes:none;
	background-color: #EADDFF;          //<-------ココ！
}
q:before, q:after {
	content: '"';
}
blockquote {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
}
blockquote cite {
	font:italic 400 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-transform:uppercase;
}

・h1,h2,h3に色が入っていなかったので入れました。

　やっぱり、文字の大きさと帯の高さだけでは・・・分かりにくかったので入れました。

/* =Headings
-------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	font-family: Helvetica, sans-serif;
	font-weight:normal;
	line-height:1em;
    word-wrap:break-word;
}
h1 {
	font-size:2.1em;
	color: #1C2BAA;          //<-------ココ！
}
h2 {
	font-size:1.8em;
	color: #778FEE;          //<-------ココ！
}
h3 {
	font-size:1.3em;          //<-------ココ！
	color: #11A2B6;          //<-------ココ！
}
h4 {
	font-size:1.3em;          //<-------ココ！
}
h5 {
	font-size:1.3em;          //<-------ココ！
}
h6 {
	font-size:1.2em;
}

・メインとサイドバーの大きさがもうちょっと…サイドバーが狭ければと思って変更

　こちらはWordpressのメニューからは編集できなかったので
wp/wp-content/themes/xclusive/_css/layout.css
このファイルを直接編集しました。

.sidebar #primary{
        //width:65%;          //<-------ココ！
        width:75%;          //<-------ココ！
}
#secondary {
        float:right;
        max-width:300px;
        //width:32%;          //<-------ココ！
        width:24%;          //<-------ココ！
}

SeedsLight

Server and Development Blog

WordPressのテーマをXClusive にしてみました。

テーマをXClusiveに変えました。

とはいえ、最初の見た目に近づけるべく変更したところも。

・背景色　真っ白だったんですが、青色をいれました。

・引用部分　これも背景色が白かったんですが、薄紫を入れました。

・h1,h2,h3に色が入っていなかったので入れました。

・メインとサイドバーの大きさがもうちょっと…サイドバーが狭ければと思って変更

テーマをXClusiveに変えました。

とはいえ、最初の見た目に近づけるべく変更したところも。

・背景色 真っ白だったんですが、青色をいれました。

・引用部分 これも背景色が白かったんですが、薄紫を入れました。

・h1,h2,h3に色が入っていなかったので入れました。

・メインとサイドバーの大きさがもうちょっと…サイドバーが狭ければと思って変更

・背景色　真っ白だったんですが、青色をいれました。

・引用部分　これも背景色が白かったんですが、薄紫を入れました。