既存のテーマを利用したショップの作り方　その1

WordPress2.9.1 にWelcart0.3 をインストールし、テーマはWordPress Default 1.6 を使っているという状況で、どのように商品を見せるかという観点でショップの作り方を紹介したいと思います。主に出力をコントロールするという話になります。レイアウトなどデザインに関しては、皆さん独自のスタイルを組んでいただきたいと思います。

ただ、出力をコントロールするといってもテンプレートタグを使ってテーマをカスタマイズする範囲となります。テーマはWelcart のアップグレードを行っても変更されることはありませんのでカスタマイズは有効です。

初期状態のブログトップ

なお、styleはWelcart が持っているusces_cart.css が有り、Welcart が生成するソースに対してstyle を指定しています。このカスタマイズ方法については「商品ページのCSS」を参照してください。
　
　
まずはWelcart の管理画面から”基本設定”、”配送設定”を済ませた後、商品を２つほど登録してみましょう。

この段階でブログのトップページは右のようになります。この状態から次の課題に取り組みたいと思います。

1. このトップページのようなブログ記事ループに商品を含ませない
2. 商品だけのループページを作る
3. ブログ投稿記事や特定のページの中で「カートへ」投入ボタンを表示させる
4. メイン（ヘッダー）ナビゲーションの構成方法
5. Welcartウィジェットを使う

?　

　
　

1. ループに商品を含ませない

Welcart では商品は投稿記事として扱われます。ですのでそのまま表示させると通常のブログ記事と混ざって表示されてしまいます。混ぜて表示させるのも一つの手ですが、ここでは商品を表示させない方法を説明いたします。
　
　
このテーマのトップページを表示しているテンプレートはindex.php です。このファイルの１２行目に次の１行を付け加えます。

<?php query_posts(“cat=-3”); ?>

”商品以外”を施したトップページ

この query_posts() というテンプレートタグはループの絞込みや並び替えを行うもので、挿入する位置は通常　<?php if (have_posts()) : ?>　のすぐ下となります。

カッコ（）の中にある文字列は引数といい、「cat=」は「カテゴリーIDが」という意味で「-3」は「3以外」を表しています。

このブログでは3 がカテゴリー「商品」のIDでした。

カテゴリーIDの調べ方は、管理画面の”投稿”メニューの中の”カテゴリー”に入り、該当する商品をクリックして編集に入ります。その時URLの一番後ろあたりにある「cat_ID=3」という文字列から知ることができます。
　
　
query_posts() は並び替えもできます。

例えば、商品以外の記事を日時降順で並べたい場合の引数は、’cat=-3&orderby=date&order=DESC’ となります。

このテンプレートの詳細は「テンプレートタグ/query posts」をご覧ください。
　
　
トップページ以外にもタグアーカイブや年月アーカイブなど、商品を含ませたくないループページがあります。WordPress Default テーマではこれらをまとめてarchive.php テンプレートで表示させています。index.php よりも複雑に見えますが、これは条件分岐によりタイトルを切り替えて表示しているだけです。この条件分岐の中にquery_posts() を置いてやることで、各ページごとに絞込みを変更できます。

次のコードはarchive.php の条件分岐の中にquery_posts() を挿入した例です。

<?php /* If this is a category archive */ if (is_category()) { ?>
<h2 class=”pagetitle”><?php printf(__(‘Archive for the ‘%s’ ************** ?>
<?php /* If this is a tag archive */ } elseif( is_tag() ) { ?>
<?php query_posts(“cat=-3”); ?>
<h2 class=”pagetitle”><?php printf(__(‘Posts Tagged ‘%s’’,************** ?>
<?php /* If this is a daily archive */ } elseif (is_day()) { ?>
<?php query_posts(“cat=-3”); ?>
<h2 class=”pagetitle”><?php printf(_c(‘Archive for ************* ?>
<?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
<?php query_posts(cat=-3”); ?>
<h2 class=”pagetitle”><?php printf(_c(‘Archive for %s|************* ?>
<?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
<?php query_posts(“cat=-3”); ?>
<h2 class=”pagetitle”><?php printf(_c(‘Archive for %s|************** ?>
<?php /* If this is an author archive */ } elseif (is_author()) { ?>
<h2 class=”pagetitle”><?php _e(‘Author Archive’, ‘kubrick’); ?></h2>
<?php /* If this is a paged archive */ } elseif (isset($_GET[‘paged’]) && !empty($_GET[‘paged’])) { ?>
<h2 class=”pagetitle”><?php _e(‘Blog Archives’, ‘kubrick’); ?></h2>
<?php } ?>

　
　このテーマではarchive.php でいろんなループページを賄っていますが、テーマによっては別テンプレートになっている場合も少なくありません。どのテンプレートファイルがどのページを表示するためのものかどうかを調べるには「テーマテンプレートファイル一覧」をご覧ください。
　
　
次回は「商品だけのループページを作る」方法を紹介します。