• 基本設置マニュアル
  • MT設置マニュアル
  • WP設置マニュアル
  • 在庫数取得モジュールの利用
  • ちょっと便利な使い方

WordPressへの導入マニュアル

WordPress連携プラグイン WPDBConnector

SKELETON CART(スケルトンカート)なら、WordPressとの連携もスムースに始められます!

WPDBConnector(無償)を使用すると、SKELETON CARTの商品情報をWordPressのデータベースから取得・利用できます。
ブログ記事(またはカスタム投稿)を商品ページとして使用すると同時に商品データとしても利用できるようになり、一連の操作をWordPressのみで行うことができます。
(SKELETON CARTの商品データファイル:item.datは使用しません)

完成イメージ本マニュアルは以下の構成になっています。

  • 1. WordPress、SKELETON CARTのインストール
  • 2. WPDBConnectorの初期設定とインストール
  • 3. 商品情報ページのテンプレート作成
  • 4. 商品情報の登録
  • 5. 動作確認とCSS等の調整

1. 必要なプログラムの入手とインストール

【1】WordPressのダウンロードとインストール

WordPress連携プラグイン「WPDBConnector」のご利用にはWordPress最新版をお薦めします。

最新版のダウンロードはこちら http://ja.wordpress.org/(2012/9/9時点の最新版3.4.2)
インストール方法の解説はこちら http://ja.wordpress.org/install/

本マニュアルでは、http://www.example.com/wordpress/がWordPressのサイトルートとなるようにインストールしています。
ご利用の環境にあわせて読み替えてください。
インストール後、WordPressが正常動作することを確認してください。

【2】SKELETON CARTのインストール

WordPressとは別にSKELETON CARTもインストールを行ってください。
プラグインの動作については、試用版でも動作確認出来ますのでご利用ください。

SKELETON CART試用版のダウンロード、製品版のご購入はこちら http://skeleton.juxtaposition.jp/download/
インストール・設定の解説はこちら http://skeleton.juxtaposition.jp/manual/

本マニュアルでは、http://www.example.com/wordpress/cart/がSKELETON CARTの設置ディレクトリとなるようインストールしています。
ご利用の環境にあわせて読み替えてください。
インストール後、商品サンプルページを使用して正常動作することを確認してください。

【3】プラグインのダウンロード

「WPDBConnector」を以下よりダウンロードしてください。

ダウンロードはこちら http://skeleton.juxtaposition.jp/download/
本プラグインはSKELETON CARTご利用者様全てが無償でご利用いただけます。

2. WPDBConnectorの初期設定とインストール

【1】プラグインファイル「wp_db_connector.php」の編集

プラグインファイルのダウンロード後、解凍して出来たフォルダの中にある「wp_db_connector.php」をテキストエディタ等で開き、初期設定を行ってください。

wp_db_connector.php

■ディレクトリパスの設定
WordPressをインストールしたディレクトリをフルパスで指定してください。

$SC_WP_Cfg['WP_DirPath']   = '/home/users/path/to/wordpress/';

■商品データ元の指定
本プラグインでは「ブログ記事のカテゴリ」「カスタム投稿タイプ」のいずれかを指定して、WordPressのデータをSKELETON CARTの商品データとして利用できます。

$SC_WP_Cfg['WP_DataSource']  = 'category:3 / post_type:sc_item';

ブログ記事のカテゴリで商品データを指定する場合、「category:**」とカテゴリIDを記入してください。
Ex. 'category:3' → カテゴリIDが「3」の記事を商品データに割り当てる。

カスタム投稿タイプで商品データを指定する場合、「post_type:**」とカスタム投稿タイプの名前を指定してください。
Ex. 'post_type:sc_item' → カスタム投稿タイプが「sc_item」の記事を商品データに割り当てる。

カテゴリ・カスタム投稿タイプとも、複数指定する場合は、'post_type:sc_item,sc_item2'のようにカンマで区切ることで指定可能です。

■WordPress商品データの各項目設定
WordPress記事入力画面で「商品データ」として使用するフィールドの設定を行います。

各設定形式のフィールドは以下になります。
1.「post:」 =ID,post_title,guid,などWordPress記事のフィールド名を指定可能
2.「custom:」=WordPress記事のカスタムフィールド名を指定可能
3.「固定値」 =値を固定して出力

wp_db_connector.phpの初期設定では以下のようになっています。
ご利用状況に合わせて変更してください。

$Cfg['WP_ItemID']      = 'post:ID';         // 商品IDに「記事ID」を使用する
$Cfg['WP_ItemName']    = 'post:post_title'; // 商品名に「記事タイトル」を使用する
$Cfg['WP_ItemPrice']   = 'custom:price';    // 価格に「カスタムフィールドの"price"」を使用する
$Cfg['WP_ItemGroupId'] = '1';               // 商品グループIDは「固定値の"1"」を記載する
$Cfg['WP_ItemAmount']  = 'custom:amount';   // 在庫数に「カスタムフィールドの"amount"」を使用する
$Cfg['WP_ItemWeight']  = 'custom:weight';   // 在庫数に「カスタムフィールドの"weight"」を使用する

例えば、「商品IDにカスタムフィールドの"item_id"を使用する」場合は、以下のように設定します。

$Cfg['WP_ItemID'] = 'custom:item_id'; // 商品IDに「カスタムフィールドの"item_id"」を使用する

※SKELETON CARTの「在庫数設定機能」「商品重量設定機能」を利用しない場合、それぞれを空欄にしてください。

$Cfg['WP_ItemAmount']  = '';   // 在庫管理機能を利用しない
$Cfg['WP_ItemWeight']  = ''; // 商品重量設定機能を利用しない

【2】WPDBConnectorをアップロード

SKELETON CARTのプラグインフォルダに「wp_db_connector.php」をアップロードしてください。
プラグインフォルダは「cart/app/plugins/」です。

以上で初期設定とインストールは完了です。

3. 商品情報ページのテンプレート作成

WordPressから商品ページを出力するためにテンプレートを編集します。
今回は通常のブログ記事と商品情報のブログ記事を別のテンプレートで表示出来るよう作成します。
商品情報として使用するWordPressのカテゴリは「ID:3」、テーマはデフォルトの「/themes/twentyeleven/」をカスタマイズして作成します。

カスタム投稿を使用する場合も同様の手順となりますが、カスタム投稿タイプの作成方法等、WordPressのカスタマイズ方法については割愛させていただきます。
※お問い合わせいただいても個別にご対応できかねますのでご了承願います。

【1】content-item.phpの新規作成

content-single.php(通常のブログ記事表示パーツ)を複製して、content-item.php(商品ページ用の記事表示パーツ)を作成してください。

【2】single.phpの編集

次に、single.phpをテキストエディタなどで開き、以下のように内容を編集してください。

【編集前】single.php 24行目
<?php get_template_part( 'content', 'single' ); ?>

【編集後】single.php 24行目
<?php
	$post = $wp_query->post;
	   if ( in_category('3') ) {
	      get_template_part( 'content', 'item' );
	    } else {
	      get_template_part( 'content', 'single' );
	    }
?>

上記は、その記事が「カテゴリID:3」の記事だったらcontent-item.phpを、そうでなければcontent-single.phpを使用してページを表示するという内容になります。

【3】content-item.phpの編集

content-item.phpをテキストエディタなどで開き、商品購入ボタン(カートへ入れる等)を追加してください。
以下はそのサンプルです。

<!-- Cart Parts -->
<form method="post" name="newdat" enctype="multipart/form-data" action="http://example.com/wordpress/cart/cart.php?qp0=idx&qp1=ad">
<p>商品名:<?php the_title(); ?><br />
価 格:<?php echo post_custom('price'); ?> 円(税込)<br />
在庫数:<?php echo post_custom('amount'); ?> 点<br />
商品重量:<?php echo post_custom('weight')/1000;?> kg</p>

<p>カラー:<select name="cart_item_opt1" style="width:50px;">
<option value="青" selected="selected">青</option>
<option value="赤">赤</option>
<option value="黄">黄</option>
</select><br />
サイズ:<select name="cart_item_opt2" style="width:50px;">
<option value="S" selected="selected">S</option>
<option value="M">M</option>
<option value="L">L</option>
</select><br />
購入数量:<select name="cart_item_amount" style="width:50px;">
<option value="1" selected="selected">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select></p>

<!--商品情報データ-->
<input type="hidden" name="cart_item_item_id" value="<?php the_ID(); ?>" />
<!--カートへ入れる-->
<p><input type="submit" value="カートへ入れる" /></p>
</form><!-- .Cart Parts -->

上記は、初期設定ファイル「init.php」でオプション項目「カラー」「サイズ」の2つを設定、在庫管理/重量計算を行う場合の例です。
使用しない機能がある場合は、その部分を省略していただいて問題ありません。
また、商品重量については「グラム単位」で入力する必要があることから、上記では「post_custom('weight')/1000」として、出力する際にキログラムになるようにしています。

【4】テンプレートファイルのアップロード

上記で作成したテンプレートをテーマフォルダ「/themes/twentyeleven/」にアップロードしてください。
以上でテンプレートの作成は完了です。

4. 商品情報の登録

新規投稿(またはカスタム投稿)画面で商品情報を入力

WordPressのダッシュボードへログインし、新規投稿(またはカスタム投稿)で商品情報を登録してください。
上記プラグインの設定で「カテゴリ指定」を選択している場合、必ずカテゴリを選択してください。

5. 動作確認とCSS調整

ここまでの作業が完了したら、実際に商品情報ページへアクセスし、テンプレートの分岐・カートへの接続が正しく行えていることを確認してください。
在庫機能を使用している際、販売状況に応じて管理画面/商品ページで在庫数が変動していることもご確認ください。

商品サンプル

最後にWordPressテンプレートのCSS、SKELETON CARTのCSS等をお好みで調整し設置完了となります。

これで商品登録からカート接続までを一連の作業内で行える環境が整います。
SKELETON CARTと本プラグインを利用して、WordPressの操作に不慣れな方やHTMLタグにあまり詳しくない方でも、簡単にECサイトを運営することが可能となります。
ぜひお試し下さい。