WordPressテーマ『tanzaku』のカスタマイズで学ぶWPの仕組み

この記事は最終更新日から1年以上が経過しています。
WPテーマである、『tanzaku』を通して、WPの仕組みを学ぼうかな、と考えています。

気にいるようなら、ダウンロードしてみては。
WordPress › tanzaku « Free WordPress Themes

『tanzaku』の仕組み

このテーマですが、ダウンロードして解凍すると、以下の画像のような仕組みになっています。
11

このうち、使われるのは2種類ぐらいでしょうか。
ある程度、作りが決まれば、style.cssだけいじっても、なんとかなります。

TOPページの作り
TOPページは、上から
header.php→sidebar.php→index.phpの一部→sidebar-2.php→footer.php
という順に呼び出されて表示されています。

普通のブログとは、多少作りが変わってきますが、それほど複雑な事はありません。
むしろ、CSSで調整頑張りましょうとも言えます。

各ページの作り
本来、ワードプレスでは、投稿ページと、固定ページがあります。
投稿ページ=single.php、固定ページ=page.phpという風に。

しかし、『tanzaku』には、上のフォルダの中身画像を見てわかる通り、各ページに当たるPHPファイルがありません。
すべて、index.phpで処理されているからです。

そういうわけなので、一度、デフォルト状態の『tanzaku』を見た方が良いのですが、何故か、デモサイトが消えているので、以下のブログを見て下さい。
ほぼ、デフォルトに近い状態です。
Instaclip

その作りは上から
header.php→index.phpの一部→sidebar.php→index.phpの一部→sidebar-2.php→footer.php
という作りです。
ヘッダーとサイドバーの間にindexの一部が入るところが、いやらしいですよね。

こういうところから、TOPページとの表示の違いが出てきます。
気にいらない人は、以下のようにしてみて下さい。
/wp-content/themes/tanzaku/index.php
28行目に以下を挿入

<?php get_sidebar(); ?>

たった1行で配置を変えられるところが、便利ですね。
慣れると、こうした変更は本当に楽に出来ます。

細かい修正はしませんが、『tanzaku』の作りは以上のような形で出来ています。
カスタマイズの参考にして下さい。

カスタマイズ例:戯れ問答の場合

一応、カスタマイズしている身として、紹介してみます。

TOPページの作り
TOPページは、上から
header.php→index.phpの一部→sidebar-2.php→footer.php
となっております。

sidebar.phpは、ここでは呼び出さないようにしてあります。

さらに、TOPと他のページの作りが違うため、いらない記述が沢山出ました。
ここを削除すると、多少表示が軽くなったので、お試しください。

各ページの作り
投稿ページと固定ページは、同じレイアウトにしています。
変える意味があまりないでしょうから。

ちなみに、投稿ページのレイアウトを変えたい場合は、index.phpをコピーし、名前をsingle.phpに変更して、同じディレクトリにアップするだけで認識してくれるので、次からはsingle.phpのレイアウトを読み込んでくれます。
固定ページも同じく、page.phpをアップするだけ。
設定いらずで、簡単です。

で、それらページは、上から
header2.php→sidebar-2.php→sidebar.php→page.php or single.php→footer.php
という形になりました。

header2.phpですが、こうした方が軽くなるのでは?という考えから、別のものにしてあります。
参考記述:ページごとに違うヘッダーを読み込む方法 : ワードプレスでCMS

ここまできたら簡単なもので、CSSをいじるだけです。
各ページの無駄な記述も消しましょう。

総括

最初は、PHPの構文がでるので、物凄く触るのが怖い部分がありました。
しかし、結局はHTMLタグを使って形を整えているので、どれがどれに変化するというのは、予測できるはずです。

あとは、失敗しながらも、やっていくしかないですね。
表示がぶっ壊れたら、その手前まで戻ってやり直せばいいですし。
PHPファイルの構成も、多いようで少ないですし、慣れればfooter.phpを増やしたりもできるでしょうし、デザインの幅が物凄く広がります。

まずは、自分が3カ月ぐらいは続けて使いたい、というテーマを決めてみるのが良いのかもしれません。
そこから、愛着から、執着したカスタマイズ熱が出てくれると思っています。

以上でした。

2 Comments

  1. こんにちは、最近tanzakuをいじりはじめめました、ワードプレス初心者です。
    未熟者でして、このような疑問に行きつきました。

    投稿からvimeoやyoutubeのビデオを埋め込みで(iframeです)表示させると、タイリングのグリッド表示のほうではビデオが見切れてしまいます。

    画像のように縮小されて表示されるか、x2のように二コマ分横に伸びて表示されることを期待したのですが、どうにも叶いません。

    しかし他のtanzakuのテーマユーザーさんのサイトをみるとグリッド表示のビデオサイズと記事を開いた際のサイズは別々で表示されています。どうか良い解決策をご教示下さい、宜しくお願い致します。

    • 当ブログをご覧いただき、ありがとうございます。

      映像を貼りつけたい場合、中身のページ以外はサムネイル化するのが良いようです。

      以下のようなプラグインがありますので、お試しください。
      http://webshufu.com/video-thumbnails/

      画像を引っ張ることができたなら、あとはCSS等でサイズを調整してみてください。

dora にコメントする コメントをキャンセル

Your email address will not be published.


*


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