②では ndex.php と style.css を作成しローカルで確認できるまで
③では他テンプレートを作成していきます

テーマを作成する場合テキストエディタを使用します
フリーソフトでいくつかあると思います使いやすい物でOK
私の場合サクラエディタを使わせていただいています
サクラエディタ

各.php の作成

index.php中身を基本に使っていきます
ローカル(XAMPP)フォルダで説明していきます
フルパスは下記のような感じになります、説明では下記を相対パスで説明させていただきます
C:/xampp/htdocs/wpblog/wordpress/wp-content/themes/wp_Theme/
短略:C:/WPテーマまでのパス/wp_Theme/
「wp_Theme」は作成していくテンプレートを収納するフォルダです(お好きな名前で)

header.php の作成

index.php中身のヘッダーまでをテキストエディタで新しくページを作成し貼付け
header.php
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ブログタイトル</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<!-- // CSS // -->
<link rel="stylesheet" href="/style.css" media="screen, tv, projection">
<!-- // javascript // -->
<script type='text/javascript' src='http://~'></script>
</head>
<body>
<div id="page">
<header id="globalHeader"><div class="inner">
<div class="hgroup">
<h1>ブログタイトル</h1>
<p>ブログの説明とか</p>
</div>
<!--/* カスタムメニューがある場合はここらへんに */-->
<!-- / header.global END --></div></header>
上記の状態で名前を付けて保存します
保存先:C:/WPテーマまでのパス/wp_Theme/
名前:「header.php」
文字コード:UTF-8

「header.php」へWP用タグを追加

*5行目 <title>ブログタイトル</title>の箇所
header.php
<title><?php wp_title('&laquo;', true, 'right'); ?> <?php bloginfo('name'); ?></title>

*9行目 <link rel="stylesheet" href="/style.css" media="screen, tv, projection">の箇所
header.php
<link rel="stylesheet" href="<?php bloginfo( 'stylesheet_url' ); ?>" media="screen, tv, projection">

*12行目 </head>の直前に「<?php wp_head(); ?>」追加
header.php
<?php wp_head(); ?>
</head>
コメントを頂いた時にコメントをスレッド化する場合もheader.phpかfunctions.phpに読み込みタグを設置します
スレッド化しない場合はこのタグ追加はしなくてOK
<?php wp_head(); ?>の前に追加します
header.php <?php wp_head(); ?>の前
<?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>
<?php wp_head(); ?>
</head>

*13行目 <body>にクラス属性追加
header.php
<body <?php body_class(); ?>>

*19行目 <h1>ブログタイトル</h1>の箇所
header.php
 title="header.php"]<h1><a href="<?php bloginfo('url'); ?>" class="blog_title"><?php bloginfo('name'); ?></a></h1>

*20行目 <p>ブログの説明とか</p>の箇所
header.php
<p><?php bloginfo('description'); ?></p>

*22行目 <!–/* カスタムメニューがある場合はここらへんに */–>の箇所
header.php
<?php wp_nav_menu( array( 'theme_location' => 'header','container' => 'nav', ) ); ?>
上記タグの出力は、カスタムメニューを使用しない場合と使用した場合で変わります
カスタムメニューを使用しない場合
<div class="menu"><ul><li></li><u/l></div>
カスタムメニュー使用した場合
<nav><ul><li></li></ul></nav>

私が追加したタグ以外にも関数リファレンスで調べると色々な表示方法を追加できたりします

更にheader.phpへ追加した色々

SEO対策とか良く解っていないのですが付けといた方がいんじゃね?的な物w追加してみました
*metaタグの description と keywords
これもGoogle検索で多数ヒットしますので詳細は書きません

description
参考サイト:Bowz::Notebook [WordPress] SEO を考えて記事ごとに固有の description を設定する
・記事ごとに手で書いた description があれば、それを利用
・記事ごとに手で書いた description が無ければ、本文の先頭から 60 文字を自動的に description として抽出
・個別記事以外のページでは、ブログの description を利用
header.php
<?php if ( is_single() ) { ?>
<?php if ($post->post_excerpt){ ?>
<meta name="description" content="<? echo $post->post_excerpt; ?>" />
<?php } else {
$summary = strip_tags($post->post_content);
$summary = str_replace("\n", "", $summary);
$summary = mb_substr($summary, 0, 60). "..."; ?>
<meta name="description" content="<?php echo $summary; ?>" />
<?php } ?>
<?php } else { ?>
<meta name="description" content="<?php bloginfo('description'); ?>" />
<? } ?>

keywords
参考サイト:Webデザインのレシピ WordPress:プラグインなしでできる高機能カスタマイズ9つ
header.php
<meta name="keywords" content="全ページに入れたいキーワード1,全ページに入れたいキーワード2,全ページに入れたいキーワード3,
<?php if ( is_home() ) { ?>トップページに入れたいキーワード1,トップページに入れたいキーワード2,トップページに入れたいキーワード3
<?php } elseif ( is_category() ) { ?><?php single_cat_title(); ?>
<?php } elseif ( is_tag() ) { ?><?php single_tag_title();?>
<?php } elseif ( is_search() ) { ?><?php echo the_search_query(); ?>
<?php } elseif ( is_page() ) { ?><?php wp_title(''); ?>
<?php } elseif ( is_single() ) { ?><?php if (have_posts()) : ?><?php while (have_posts()) : the_post(); ?><?php wp_title(''); ?>,<?php $cat = get_the_category(); $cat = $cat[0]; { echo $cat->cat_name; } ?>
<?php endwhile; ?><?php else : ?><?php endif; ?>
<?php } ?>" />

フィールド生成タグ
Rss2.0の場合
header.php
<link rel="alternate" type="application/rss+xml" title="ブログ名など (RSS 2.0)" href="<?php bloginfo('rss2_url'); ?>">
他に
<?php bloginfo('rdf_url'); ?> RDF/RSS 1.0
<?php bloginfo('atom_url'); ?> Atom
<?php bloginfo('comments_rss2_url'); ?> コメント RSS 2.0
WordPress日本語Codex | WordPress Feeds で詳しく書かれています

header.php はこれで完了で上書き保存

2012/01/01 Wordpress
2012/01/08 ,
Comments(0)
関連記事