6)動的URLを静的URLに変更する(PCサイト) – hetemlのサーバでEC-CUBE(2.11.3)を使ってみる

11月 1st, 2011 カテゴリー EC-CUBE2.11

一昔前までは、動的URLは静的URLに変更した方が良いという流れがあり、EC-CUBEでも静的URLに変更する対策が多く扱われていました。
動的URLがインデックス登録されにくいという事が、不利であるという定説なんですが、最近は検索エンジンにも動的URLは認識されるようになり、.htmlのような静的URLに変換する必要がないというのが主な意見でもあります。

かといって、静的化しなくていいのかというと、一概には言えません。
例えば
URLが長くなる(クリック率の低下)
コピー&ペーストされたときにURLの後ろのほうが切れる可能性ある
覚えにくい
どのようなページが表示されるか、ユーザーが予測できる。
URLをそのままアンカーテキストに使っても、適切なキーワードが含まれている

一部EC-CUBEには該当しない項目もありますが、ユーザーにとって有益であれば、対策しておいても損はないかなというのが私の意見です。大変なデメリットがあるのでは行ないませんが。

導入するかどうかは、考え方次第です。


※PCサイトのテンプレートの変更だけになりますので、スマフォ用のテンプレ変更はこちらをご参照ください。
6-2)hetemlのサーバでEC-CUBEを使ってみる – 動的URLを静的URLに変更する(スマートフォンサイト)



導入手順




1).htaccessに下記内容を追記する

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^products/detail([0-9]+).html products/detail.php?product_id=$1&%{QUERY_STRING} [L]
RewriteRule ^products/list([0-9]+).html products/list.php?category_id=$1&%{QUERY_STRING} [L]
&%{QUERY_STRING}を追記しないと、商品一覧でカゴに商品が入りません。
htaccessへの記述が問題なければ、
「 http://example.com/products/detail2.html 」
にアクセスすれば問題なく表示されるはずです。




2)管理画面のパラメータ設定を変更する

「システム設定」→「パラメーター設定」を選択します。



[P_DETAIL_URLPATH]のパスを以下に変更
ROOT_URLPATH . "products/detail.php?product_id="

↓↓変更↓↓

ROOT_URLPATH . "products/detail"




3)テンプレート(.tpl)のURLを静的に変更する

変更したテンプレート(.tpl)ファイルのサンプルをダウンロード


メイン(TOP)

/data/Smarty/templates/originalPC/index.tpl

<!–{$smarty.const.P_DETAIL_URLPATH}–>1
の後ろに「.html」を追加します。
<a href="<!--{$smarty.const.P_DETAIL_URLPATH}-->1" onmouseover="chgImg('<!--{$TPL_URLPATH}-->img/banner/bnr_top_main_on.jpg','bnr_top_main');" onmouseout="chgImg('<!--{$TPL_URLPATH}-->img/banner/bnr_top_main.jpg','bnr_top_main');">

↓↓変更↓↓

<a href="<!--{$smarty.const.P_DETAIL_URLPATH}-->1.html" onmouseover="chgImg('<!--{$TPL_URLPATH}-->img/banner/bnr_top_main_on.jpg','bnr_top_main');" onmouseout="chgImg('<!--{$TPL_URLPATH}-->img/banner/bnr_top_main.jpg','bnr_top_main');">


おすすめ商品情報(TOP)

/data/Smarty/templates/originalPC/frontparts/bloc/recommend.tpl

<!–{$arrProduct.product_id|u}–>
の後ろに「.html」を追加します。
<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->">

↓↓変更↓↓

<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->.html">


<h3>
	<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->"><!--{$arrProduct.name|h}--></a>
</h3>

↓↓変更↓↓

<h3>
	<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->.html"><!--{$arrProduct.name|h}--></a>
</h3>


カテゴリブロック

/data/Smarty/templates/originalPC/frontparts/bloc/category.tpl

list.php?category_id=<!–{$arrTree[cnt].category_id}–>

list<!–{$arrTree[cnt].category_id}–>.html
に変更しています。
<!–{$arrTree[cnt].category_id}–>には商品IDが出力されますので、
list1.htmlとなります。
<a href="<!--{$smarty.const.ROOT_URLPATH}-->products/list.php?category_id=<!--{$arrTree[cnt].category_id}-->"<!--{if in_array($arrTree[cnt].category_id, $tpl_category_id)}--> class="onlink"<!--{/if}-->><!--{$arrTree[cnt].category_name|h}-->(<!--{$arrTree[cnt].product_count|default:0}-->)</a>

↓↓変更↓↓

<a href="<!--{$smarty.const.ROOT_URLPATH}-->products/list<!--{$arrTree[cnt].category_id}-->.html"<!--{if in_array($arrTree[cnt].category_id, $tpl_category_id)}--> class="onlink"<!--{/if}-->><!--{$arrTree[cnt].category_name|h}-->(<!--{$arrTree[cnt].product_count|default:0}-->)</a>


商品一覧ページ

/data/Smarty/templates/originalPC/products/list.tpl

<!–{$arrProduct.product_id|u}–>
の後ろに「.html」を追加します。
<!--★画像★-->
	<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->" class="over">

↓↓変更↓↓

	<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->.html" class="over">


<!--★商品名★-->
<h3>
	<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->"><!--{$arrProduct.name|h}--></a>
</h3>

↓↓変更↓↓

<h3>
	<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->.html"><!--{$arrProduct.name|h}--></a>
</h3>


<!--★商品詳細を見る★-->
<div class="detail_btn">
                    <!--{assign var=name value="detail`$id`"}-->
                    <a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->" onmouseover="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_detail_on.jpg','<!--{$name}-->');" onmouseout="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_detail.jpg','<!--{$name}-->');">

↓↓変更↓↓

<div class="detail_btn">
                    <!--{assign var=name value="detail`$id`"}-->
                    <a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->.html" onmouseover="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_detail_on.jpg','<!--{$name}-->');" onmouseout="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_detail.jpg','<!--{$name}-->');">


商品詳細ページ(オススメ商品)

/data/Smarty/templates/originalPC/products/detail.tpl

<!–{$arrRecommend[cnt].product_id|u}–>
の後ろに「.html」を追加します。
<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrRecommend[cnt].product_id|u}-->">

↓↓変更↓↓

<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrRecommend[cnt].product_id|u}-->.html">


<h3><a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrRecommend[cnt].product_id|u}-->"><!--{$arrRecommend[cnt].name|h}--></a></h3>

↓↓変更↓↓

<h3><a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrRecommend[cnt].product_id|u}-->.html"><!--{$arrRecommend[cnt].name|h}--></a></h3>


MYページ 購入履歴詳細

/data/Smarty/templates/originalPC/mypage/history.tpl

<!–{$orderDetail.product_id|u}–>
の後ろに「.html」を追加します。
<td><a<!--{if $orderDetail.enable}--> href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$orderDetail.product_id|u}-->"<!--{/if}-->><!--{$orderDetail.product_name|h}--></a></td>

↓↓変更↓↓

<td><a<!--{if $orderDetail.enable}--> href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$orderDetail.product_id|u}-->.html"<!--{/if}-->><!--{$orderDetail.product_name|h}--></a></td>


MYページ お気に入り一覧

/data/Smarty/templates/originalPC/mypage/favorite.tpl

<!–{$product_id|u}–>
の後ろに「.html」を追加します。
<td class="alignC"><a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$product_id|u}-->"><img src="<!--{$smarty.const.ROOT_URLPATH}-->resize_image.php?image=<!--{$arrFavorite[cnt].main_list_image|sfNoImageMainList|h}-->&amp;width=65&amp;height=65"></a></td>
<td><a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$product_id|u}-->"><!--{$arrFavorite[cnt].name}--></a></td>

↓↓変更↓↓

<td class="alignC"><a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$product_id|u}-->.html"><img src="<!--{$smarty.const.ROOT_URLPATH}-->resize_image.php?image=<!--{$arrFavorite[cnt].main_list_image|sfNoImageMainList|h}-->&amp;width=65&amp;height=65"></a></td>
<td><a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$product_id|u}-->.html"><!--{$arrFavorite[cnt].name}--></a></td>


管理画面 商品マスター

data/Smarty/templates/admin/products/index.tpl

detail.php?product_id=<!–{$arrProducts[cnt].product_id}–>

detail<!–{$arrProducts[cnt].product_id}–>.html
に変更します。
<td class="menu" rowspan="2"><span class="icon_confirm"><a href="<!--{$smarty.const.HTTP_URL|sfTrimURL}-->/products/detail.php?product_id=<!--{$arrProducts[cnt].product_id}-->&amp;admin=on" target="_blank">確認</a></span></td>

↓↓変更↓↓

<td class="menu" rowspan="2"><span class="icon_confirm"><a href="<!--{$smarty.const.HTTP_URL|sfTrimURL}-->/products/detail<!--{$arrProducts[cnt].product_id}-->.html&amp;admin=on" target="_blank">確認</a></span></td>
                    <!--{if $smarty.const.OPTION_CLASS_REGIST == 1}-->


<div id="disp_url<!--{$smarty.section.cnt.iteration}-->" style="display:none">
                            <!--{$smarty.const.HTTP_URL|sfTrimURL}-->/products/detail.php?product_id=<!--{$arrProducts[cnt].product_id}-->
                        </div>

↓↓変更↓↓

<!--{* URL *}-->
                        <div id="disp_url<!--{$smarty.section.cnt.iteration}-->" style="display:none">
                            <!--{$smarty.const.HTTP_URL|sfTrimURL}-->/products/detail<!--{$arrProducts[cnt].product_id}-->.html
                        </div>


※変更は以上ですが抜けがあったら随時更新します。
その他に新規で作ったページなどがあったらこちらも同様に変更してください。


モジュールで簡単に静的化できるモジュールもあるようです。
商品一覧・詳細URL静的化対応モジュール



6-2)動的URLを静的URLに変更する(スマートフォンサイト)-hetemlのサーバでEC-CUBE(2.11.3)を使ってみる
hetemlのサーバでEC-CUBEインストール~公開までの道のり

Sponsored Links

コメント

コメントする

  1. eccubeorg より:

    Eccube

    ありがとうございました!無事に解決いたしました!

    ずっと悩んでいたところなので大変助かりました。

コメントする

Eメールアドレスは公開されません。