見た目をいじくる その1


ふぉーー!

wordpressの見た目をいじくるぞーー
勉強もかねてメモメモ

ひとまず、まずは最も簡単な方法

●テーマをよそからダウンロード
サイトの管理から全自動で見た目を変更してくれる!
コレは便利!

フリーのテーマもかなり数があるので選び放題

 01

コレはInferno-mf 1.2
Mike Fifield 作
http://www.thecirclingsky.com/

いやー、こんな機能があるなら
わざわざ自分で変更する必要は無いんだけど

わざわざ編集する

  

●なのでkubrickを改造

ひとまず、defaultの’kubrickは好みのテーマなので
デフォルトを改造してゆくぞーーーー

で、何となくぼけーっと観察

ブログの全体の表示はindex.php
シングルの記事の表示にはsingle.phpが使用されている
ページの表示にはpage.php

サーチにはsearch.php
コメントにはcomments.php

この辺りは基本の基本サね

最も簡単な改造は
imagesディレクトリにある jpg画像を変更すれば
見た目は簡単に変わる

defaultテーマのオプション機能の、ヘッダー画像の色を変えるのは
imagesのheader-img.phpで処理しているみたい
色相を変えているんだ

●日付に時刻を入れてみる

日付表示のスタイルを変えたい場合は
the_time(__(‘F jS, Y’, ‘kubrick’))この部分の
F jS, Y を l, F jS, Y に変更する

まぁ、これはいいとして
日付の横に時刻を入れてみる

入れたのは、基本的なやつ

<?php printf(__(‘%1$s’, ‘kubrick’), get_the_time()); ?>

今思ったけど wordpressの関数一覧があるといいなぁ~~
どっかにあると思うけど

●背景画像とかの構成

wikiなんかと同じで、基本はdivとcssを使って見た目を作っていのね
ということで、大まかな構成

kousei

ヘッダーとフッターは、style.cssで直接画像をしてしてあった
サイズに関しても同様
微妙にピクセル単位で微調整しているみたい

コンテンツとサイドバーのイメージ画像は、
サイドバーがない場合の1種とサイドバーが右か左かの2種
計三種で構成されている
どちらもheader.phpで設定されている

ちなみに、現在見た目がショッボい事になっているのは
ひとまず背景色を変えて反応をみてみたのサ

content部とsidebar部のサイズは、それぞれstyle.cssのなかの
widecolumnとnarrowcolumnで指定されてるみたい

●singleページにサイドバーを追加

全然難しくなかったーーー
single.phpを一部変えるだけサ

<div id=”content”class=”widecolumn”role=”main”>
を下のようにする
<div id=”content” class=”narrowcolumn” role=”main”>

style.cssのnarrowcolum部を変えてもよし
新たにクラスを加えるもよしってところでしょうか

次に、サイドバーを追加

<?php get_sidebar(); ?>

この一文をフッターの前に挿入するだけサ

 

個人的に、一端テーブルで全体をレイアウトしておいて
divとかを使う方が好きかな

wikiの時はそうやった
この後は、ヘッダー部をフラッシュにしてみようっと

そうだな、ヘッダー部のフラッシュがサイトの再読込時に
いちいち最初から再生してしまう事を回避するにはどうしたらいいかな・・・
まさかフレームで切ったりしないよな

今日はここまで

Leave a comment

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

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください