EC-CUBE 商品詳細に在庫数表示

上記コードを表示させたいところに表示。

商品詳細ページのファイルは下記。

EC-CUBEの商品の登録項目内容の追加

「EC-CUBEの商品の登録項目内容の追加」

商品詳細ページに入力項目を追加したいと思います。
例として今回は家具サイトの例として「サイズ(W*D*H)」を追加します。

データベース(以下、DB)にカラムを追加する

dtb_productsに1カラム追加。
カラム名「comment7」
データ型「text」

商品詳細ページの編集

管理ページのデザイン管理>ページ詳細設定>商品詳細ページを開き、サイズを表示したい部分に、

<!–{$arrProduct.comment7}–>

と記述する。

サイズ表示しないようにするには、

<!–{$arrProduct.comment7|escape}–>

と記述する

商品登録ページの編集

data/Smarty/templates/default/admin/products/product.tplのファイルを開き、メーカーサイトの項目の下あたりに、

つづく

商品カテゴリーを全部表示(開いたままにする)2.11.4

カテゴリーブロックを以下のように書き換えるだけ。

要は元のカテゴリーブロックを下記のように修正。

上記の※印の3行を削除。

商品一覧を3列のカラム(column)表示 / 横型商品一覧の導入

user_date/packages/default/css/common.css内の記述を変更
(contents.cssの可能性あり)

↓に変更。

下記はカラムへの回り込み禁則処理
(商品が1つの場合や価格順・新着順のソートバー回り込み禁則)

common.cssの中(100行目あたり)に追記

下層コンテンツあたりに追記

多分以上で出来るが、商品名や文字のボリュームで個々のheightがバラバラになることがあります。
なので、「heightLine.js」jQuery等でそろえること。
(面倒であればCSSでdiv.list_areaとdiv.list_area h3 の heightを強制固定)

買い物かごの表記は下記ファイルの200行目前後。
今回は消去しました。
template/default/products/list.php

2012年1月24日 加筆

商品一覧ブロックを作る 2.11.X

html/frontparts/bloc/product_list.php を新規作成

data/class_extends/page_extends/frontparts/bloc/LC_Page_FrontParts_Bloc_Product_List_Ex.php を新規作成

[php]
<?php

// {{{ requires
require_once(CLASS_EX_REALDIR . "page_extends/frontparts/bloc/LC_Page_FrontParts_Bloc_Product_List_Ex.php");

// }}}
// {{{ generate page

$objPage = new LC_Page_FrontParts_Bloc_Product_List_Ex();
register_shutdown_function(array($objPage, "destroy"));
$objPage->init();
$objPage->process();

?>
[/php]

data/class/pages/frontparts/bloc/LC_Page_FrontParts_Bloc_Product_List.php を新規作成

[php highlight=”44″]
<?php

// {{{ requires
require_once CLASS_REALDIR . ‘pages/frontparts/bloc/LC_Page_FrontParts_Bloc.php’;

/**
* Product_List のページクラス.
*
* @package Page
*/
class LC_Page_FrontParts_Bloc_Product_List extends LC_Page_FrontParts_Bloc {

// }}}
// {{{ functions

/**
* Page を初期化する.
*
* @return void
*/
function init() {
parent::init();
$bloc_file = ‘product_list.tpl’;
$this->setTplMainpage($bloc_file);
}

/**
* Page のプロセス.
*
* @return void
*/
function process() {
if (defined("MOBILE_SITE") && MOBILE_SITE) {
$objView = new SC_MobileView();
} else {
$objView = new SC_SiteView();
}

$objQuery = new SC_Query_Ex();
$objProduct = new SC_Product_Ex();

//$objQuery->setLimitOffset(10);
//$objQuery->setOrder("update_date desc");
$this->arrProducts = $objProduct->lists($objQuery);

$objView->assignobj($this);
$objView->display($this->tpl_mainpage);
}

/**
* デストラクタ.
*
* @return void
*/
function destroy() {
parent::destroy();
}
}

?>
[/php]

$this->arrProducts = $objProduct->lists(&$objQuery);の44行目で過去のバージョン2.11辺りのQueryだとlists(&$objQuery);の表記でしたが&無しで記述。 $this->arrProducts = $objProduct->lists($objQuery); data/Smarty/templates/default/frontparts/bloc/product_list.tpl を新規作成

[php]
<!–{if count($arrProducts) > 0}–>
<div class="bloc_outer clearfix">
<div id="productlist_area">
<h2>商品一覧リスト</h2>
<div class="bloc_body clearfix">
<!–{foreach from=$arrProducts item=arrProduct}–>
<div class="product_item clearfix">
<div class="productImage">
<a href="<!–{$smarty.const.P_DETAIL_URLPATH}–><!–{$arrProduct.product_id|u}–>"><img src="<!–{$smarty.const.ROOT_URLPATH}–>resize_image.php?image=<!–{$arrProduct.main_list_image|sfNoImageMainList|h}–>&width=40&height=40" alt="<!–{$arrProduct.name|h}–>" /></a>
</div>
<div class="productContents">
<h3>
<a href="<!–{$smarty.const.P_DETAIL_URLPATH}–><!–{$arrProduct.product_id|u}–>"><!–{$arrProduct.name|h}–></a>
</h3>
<p class="sale_price">
<span class="price"><!–{$arrProduct.price02_min|sfCalcIncTax:$arrInfo.tax:$arrInfo.tax_rule|number_format}–> 円</span>
</p>
</div>
</div>
</dl>
<div class="clear"></div>
<!–{/foreach}–>
</div>
</div>
</div>
<!–{/if}–>
[/php]

スタイルシート追記

[css]
<style type="text/css">
div#productlist_area h2 {
background-color:#de5e17;
text-align:center;
color:#fff;
padding:7px 0 7px 0;
}
div#productlist_area div.productImage {
float:left;
width:40px;
padding:0 8px 0 0;
}
div#productlist_area div.productContents {
float:left;
width:100px;
}
div#productlist_area div.product_item {
padding:5px 0 5px 5px;
}
</style>
[/css]

データベースに新規ブロック情報を登録

[php]
insert into dtb_bloc values(10,10,’product_list’,’product_list.tpl’,’product_list’,now(),now(),’frontparts/bloc/product_list.php’,0);
[/php]

Warningが表示されたので掲示板等参考に下記を実行。

[php highlight=”7″]
<?php

// {{{ requires
require_once CLASS_REALDIR . ‘pages/frontparts/bloc/LC_Page_FrontParts_Bloc.php’;
////中略////

$this->arrProducts = $objProduct->lists(&$objQuery);

$objView->assignobj($this);
$objView->display($this->tpl_mainpage);
}

/**
* デストラクタ.
*
* @return void
*/
function destroy() {
parent::destroy();
}
}

?>
[/php]

data/class/pages/frontparts/bloc/LC_Page_FrontParts_Bloc_Product_List.phpの部分で、本文44行目(上記7行目) $this->arrProducts = $objProduct->lists(&$objQuery); $this->arrProducts = $objProduct->lists($objQuery);

としたら表示が消えました。

EC-CUBE 動的ページを静的ページ(静的URL)にする

なぜ静的URLにするのかというと・・・

GoogleやYahoo! などの検索の場合、動的URLでは、一つのページとみなしてしまいます。 (まぁ最近じゃ?がついていようとインデックスしてくれるみたいですが) ちなみに動的URLとは下記のように?が入るURLです。 http://サーバ名/ec-cube/html/products/detail.php?product_id=xxこちらですと、検索するにあたって、detail.phpのファイルとみなされていまい、 1ページしかインデックスされません。

ですので、各ページごとにインデックスされるように、 http://サーバ名/ec-cube/html/products/detail/xx

とします。これが静的URLです。 実際にページは存在していませんが、 検索ロボットに存在しているように見せることができます。

1. パラメータを変える。

まず、 システム設定>パラメータ設定より以下を変更います。 パラメータ:LIST_P_HTML 変更前:URL_DIR . “products/list-p” 変更後:URL_DIR . “products/list/” パラメータ:DETAIL_P_HTML変更前:URL_DIR . “products/detail.php?product_id=”変更後:URL_DIR . “products/detail/”

2. .htaccsessファイルをhtml/products/以下にに配置します。 そのファイルに下記の内容を追加します。 RewriteEngine on RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ^detail/([0-9]+)+ detail.php?product_id=$1 [L] RewriteRule ^list/([0-9]+)+ list.php?category_id=$1 [L]

※.htaccsessは、html/ 内にありますので、それをコピーして設置すると楽です。

3.管理画面>デザイン管理>ブロック編集>カテゴリを開き46行目あたりのソースを変更

こちらはカテゴリのリンクの変更です。

変更前:products/list.php?category_id= 変更後:products/list/

4.管理画面>デザイン管理>ページ詳細設定>商品詳細ページのソースを変更

商品詳細のページのリンクが静的ページにするために、パス( / )を切った関係で、階層が一つ多くなってしまいました。

変更箇所は、 内の合計6つ変更です。

変更前:./ 変更後:../  ※2階層上へ送っている

他、動作には関係ありませんが、こちらも変更をオススメ、

 

変更前:products/list.php?category_id= 変更後:products/list/

これで、変更完了です。 各種エディターを使って、コピペして、コマンド+Fで所定の箇所を探してみてください。

レビュー一覧ページ作成 ec-cube2.11以降

まず管理画面にログインして、デザイン管理>PC>レイアウト設定 から、ページを新規入力します。
URLは review_list.php として、以下のコードを貼り付けて保存します。

次に、html/user_data/review_list.php を開いて、次のように修正します。

data/Smarty/templates/default/user_data/review_list.tpl を以下のように変更します。

以上。

ブロック化は以下。

デザイン管理>PC>ブロックの設定新規ブロックで下記を作成。
ブロック名:お客様の声一覧
ファイル名:review_list_bloc

トップページのブロックで表示する場合、html直下のindex.php下記のような感じで書き換え。

基本的には同じ作業。
画像とかは適当にかえましょう。
(レビュー自体未投稿だと空欄なので適当に用意しておきましょう。)

SEO対策 titleタグ編

内部SEO対策を行う上で、重要なのはタグです。

・Titleタグ
・Metaタグ
・Hタグ
・Altタグ
・Aタグ
・Strongタグ

とSEOに関連するタグはありますが、SEOを行う上で重要なのがTITLEタグです。
特にみずいろ堂では商品詳細のページにランディングしてもらおうという考えですので
商品詳細ページのタイトルは重要です!

しかしながら、デフォルトの商品詳細ページのTitleタグは納得がいきません!

商品詳細ページは、各々の商品の物販サイトであるということを意識したタイトルにしました。

【対象ファイル】
data\class\pages\products\LC_Page_Products_Detail.php

【変更箇所】
$this->tpl_title = “商品詳細 “. $this->arrProduct[“name”];

$this->tpl_title = “通販 “. $this->arrProduct[“name”];
などに変更するだけです。

SEOにとって重要でありますが、変更は非常に簡単ですので、やってみるべき変更だと思います。

META tag 編集 title keywords description など ECCUBE2.11

どこで編集したか忘れそうになるので、備忘録。

編集ファイルの場所data/Smarty/site_frame.tpl

META tag 編集 title keywords description などを下記から編集できます。
で、問題は初期状態で、各ページ編集できるようになっていたかなのですが。
多分???初期状態からできたはず。
一応コードも↓

追記とか書いてるしw
んん~、自分で書いたか忘れましたw
それか、どっかから拾ってきたらしい。。。。。

元ネタサイトのかたすいません><。。
備忘録として使わせてもらいましたw

コメントなしでもサブ画像のみ表示する方法(PC/スマフォ兼用)ver2.11

コメントなしでもサブ画像のみ表示する方法
商品詳細のページでサブ画像だけ増やしたいときにこれを使用。
最終的には縦並びになるのでCSSで横に並ぶようにしました。

templates/default/products/details.tpl

下記コードのサブタイトルとサブ画像を切り離します。

上記コードを下記に丸ごと書き換え。

多分コレで出来るはず。
(スマフォ版もコレで行けました。)

ただ縦に並ぶだけなので、CSSのdiv.subphotoimgを下記コードに書き換え。

ちなみにfloat:right;なので右揃え。
通常はleftでもいいかと思います。
なので、コメント欄の後ろのほうに登録した写真が左に来て、上位のコメントにつけた画像が右に来る可能性あり。

あと表示位置をメイン写真の真下に持ってこれれば最高、しかもクリックしたらそれもLightBox風にできぬだろうか・・・