きのこ

HTML5版!PHPの分からない初心者向けフリーWordPressテーマ”mypace custom V”を配布開始!

  • 2011.04.30 HTML5のマークアップは正直まだ会得してないのですが、とりあえずリリースしちゃいます。

2010年10月に配布を開始しました「PHPの分からない初心者向けフリーWordPressテーマ”mypace custom”(XHTML1.0版)」ですが、おかげさまで多くの方にご利用いただいております。
半年経った2011.04末現在で、各Verや子テーマ等を合計して、700ダウンロードを数えています。

私の知る限り、名古屋のWeb系会社で少なくとも3社が、当テーマをフレームワークとして実案件でも活用くださっています。(まさかこんなことになるとは!)

そこで、かねてから絶賛やるやる詐欺中だった、当テーマのHTML5化を行ってみました。
その名も、”mypace custom V(five)”!!

自分用のフレームワークとして作ったものですが、よかったら使ってみてください。(ただし、まだちょっとマークアップに不安がありますがsweat02

ダウンロード

管理をGitHubに移しました。
(Ver1.1/WordPress3.4にて動作確認)

テーマの特徴

  • 極力無駄なソースを削り、説明コメントをこまめに入れるように心がけました。
    モットーは、「コメントに愛を!」
  • 3.0で追加された「カスタム背景」「カスタムメニュー」「アイキャッチ」機能は追加してあります。
  • 複数ウィジェットに対応しています。(サイドに2つ、フッターに3つ枠があります)
    しかし、TwentyTenテーマのフッターウィジェットと比べると質は落ちます(>_<)
  • グローバルナビはCSSによるドロップダウン(Vertical版も、子ページによる2階層までを想定。自分が孫ページ以下を作ることがまずないので、そのあたりは想定していません。そしてIE6,7はドロップダウン非対応です。)
  • newHTML5化にあたって、見出しタグの振り方を変更しました。
  • newプラグイン無しでのページャー機能に対応しました。
  • new<?php body_class(); ?>タグによりbodyに各ページ個別のclassを振れるようにしました。ページごとに異なるデザインにしたりetcできます。
  • IE7-9beta,Fx,Chrome,Opera,Safariで軽くチェックしてますが軽くしかチェックしてないのであやしいです。IE6は気にしてないです。おかしいところがあったら教えてください。

【重要】そのまま使うとIEで後方互換モードになってしまいます!

この配布テーマでは、ブラウザ表示時にどのテンプレートファイルが適用されているか確認できるように、<?php get_header(); ?>の前にコメントを入れてあります。

これがスイッチとなって、IEでの表示が後方互換モードとなってレイアウト崩れが起きますので、ある程度制作が進んだら、各テンプレート冒頭にある<!– *****.php start –>のコメントは削除してください。

dangerこの件について詳しくは「IEでの後方互換スイッチに関して勘違いしてました。だからまとめ。」エントリーをお読みください。

ファイル構成

*印はこのテーマでの必要最低限のファイル 無印はなくても一応動くファイル
style.css*
default.css* (私がいつも使っているリセットCSSとよく使うクラスなどをまとめてある)
archieve.php
header.php*
index.php*

home.php
loop.php*
footer.php*

sidebar.php*
page.php
pagetemplate.php
comments.php
single.php
404.php
functions.php
screenshot.png
images/headerimg.jpg

functions.phpについて

今までの’mypace custom’での記述に、少々新機能を追加しています。といってもシンプルなものしか用意してません。
functions.phpの活用がWordPressテーマカスタムのキモなので、ぜひ研究してみてください!

  • wp_head()の出力タグの消去
    とかく多くのタグが出力されるヘッダー。普段馴染みの無い物をがばっと非表示にしています。表示させたい時は、その項目を //でコメントアウトしてください。
  • 複数ウィジェットの有効化
    ウィジェット数の変更は数字を書き換えればOK。ウィジェットの出し方はsidebar.phpをご参考に。
  • カスタムメニュー有効化
    「ページもカテゴリも外部リンクも混在したナビゲーション」をらくらく作成。
  • カスタム背景の有効化
    ちょいっとサイトイメージを変えたい時に便利。画像UPおよび色指定ができます。
  • アイキャッチ画像に対応
    各投稿の一番上に、ちょっとしたイメージ画像を入れられます。活用次第で便利な機能。
  • new「続きを読む」リンクに付くアンカー #more を削除
    ソーシャルブックマークやシェア時のURIが分散しないようにするなど、意外とニーズの高い機能です。

変更履歴

  • 2011.04.30 またもや勢いだけで公開

今回追加した機能のネタ元

コメント / トラックバック 1 件

▲Pagetop