ロッカールーム

科目一覧

EC-CUBEのためのレンタルサーバー「EC-CUBEのサーバー」 会員登録(無料)はこちら
サイトマップ ご意見箱

EC-CUBEのモバイルサイトで、PCサイトとは異なる詳細コメントを表示させる

カスタマイズ講座

ホーム > カスタマイズ講座 > 【上級】カスタマイズ > EC-CUBEのモバイルサイトで、PCサイトとは異なる詳細コメントを表示させる
【上級】カスタマイズ2
2008.10.22 (更新日: 2009.07.06)

EC-CUBEのモバイルサイトで、PCサイトとは異なる詳細コメントを表示させる

【用意するもの】
・EC-CUBE2系がインストールされたサーバ・・・1アカウント
・PostgreSQL 8.3以降
・ユーザーを思いやるまごころ・・・適量


こんにちは。料理といえば卵焼きと焼きそば、パスタくらいしか作れない家庭科の穂満です。


さて、今日のレシピは、「モバイルサイトで、PCサイトとは異なる詳細コメントを表示させる」です。詳細コメントはとってもたくさんの文字が書き込めますから、商品を愛して止まないオーナーさんは語りつくせないくらいの文字を書き込まれることがあります。

また、タグが許可されている関係でガッツリHTML書かれたりして、どちらにしてもモバイル端末ユーザーには少々過酷な表示をさせられてしまいます。そこで、PC用詳細コメントとモバイル用詳細コメントを別に登録できるようにすることで、どちらのユーザーにも快適にご閲覧して頂けるようにしましょう。

尚、利便性を考えてモバイル用詳細コメントを省略したら、通常どおりPC用詳細コメントを表示するようにします。

調理例
フロント画面は下図のようになります。

PC用コメントとモバイル用コメントを別にする



管理画面「商品登録」イメージは以下のようになります。

管理画面「商品登録」のイメージ


どういうことを学ぶか

このレシピを通じて、管理画面に新しいフィールドを追加し、データベースに登録する方法と表示する方法を学びます。つまり、以下のような作業が必要になってきます

※このレシピではPostgreSQL 8.3系の場合の作業で、phpPgAdminを利用することを前提としています

  1. データベースにカラム(フィールド)追加
  2. データベースのビューを再構築し、追加したカラムを呼び出せるようにする
  3. 商品登録のPHPスクリプトを料理する
  4. 管理画面の商品登録・確認テンプレートを修正
  5. モバイル用詳細テンプレートを修正



(2ページへ続く)

ここから先は、会員限定の特別公開記事になっております。
ここから先は、会員限定の特別公開記事になっております。
ここから先は、会員限定の特別公開記事になっております。
ここから先は、会員限定の特別公開記事になっております。
ここから先は、会員限定の特別公開記事になっております。

このページを見ている人は、以下のページも参照しているようです・・・!

レビュー

レビューによるご意見・ご質問は会員登録された方のみとなっております。
  • ★★★★★ モバイル専用が良い 2008/10/27
    レビュアー:yuji

    お世話になってます

    EC-CUBEは同時にモバイルサイトも構築してくれるので大変重宝しますが

    やはりPCサイトとモバイルサイトの
    詳細は別々にしたいですね
    テーブルなどを使うのでモバイルではすごいレイアウトで表示されてましたので
    大変重宝する情報でした。

  • ★★★★★ ちょっと外れた質問なのですが・・・ 2008/12/02
    レビュアー:tonton

    こちらの記事を見せて頂いて、ポスグレでやってみることにしたのですが、DBを作成してインストールもできて、phpPgAdminでフィールドの値を確認しようとしたら、表示リンクをクリックすると、
    ERROR: permission denied for relation dtb_baseinfo
    といった感じで、表示ができないのです。
    これは標準の動作でしょうか?フィールドを閲覧するときにphpPgAdminではどのようにすればいいものでしょうか。
    ポスグレは初めて触るので確認しながら行いたいのですが、その手前でつまづいてしまいました;
    なんとなく、初期のユーザー権限の問題のような気もするのですが、、、

  • エラーについて 2008/12/03
    レビュアー:homan

    > DBを作成してインストールもできて、phpPgAdminでフィールドの値を確認しようとしたら、表示リンクをクリックすると、
    > ERROR: permission denied for relation dtb_baseinfo
    といった感じで、表示ができないのです。
    > これは標準の動作でしょうか?フィールドを閲覧するときにphpPgAdminではどのようにすればいいものでしょうか。

    ご利用のサーバーの設定に依りますので何とも言えませんが、発生したエラーの内容はご察しのとおり、phpPgAdminにアクセスしたユーザーで閲覧や変更する権限がないのだと思います。

    phpPgAdminでアクセスした際、dtb_baseinfoの所有者はログインIDと同じになっていますでしょうか?レンタルサーバなどのサービスで簡単にEC-CUBEがインストールできる機能などがあった場合は、この辺の権限がそれぞれちがったりするので、詳しくはサーバー管理者様にお聞きになるといいと思います。

  • ★★★★★ homanさん、レスありがとうございます。 2008/12/15
    レビュアー:tonton

    あきらめて、mySQLでやってみました。
    無事登録はできたのですが、登録した後、編集しようとすると、管理画面に、携帯用のコメントが表示されません。
    mySQLなので、VIEWの作成というステップを飛ばしたのですが、そのせいでしょうか?それとも、それが標準の動作でしょうか。
    とりあえず、登録はできるので、進めているのですが、ここだけ、疑問を残してしまいました。
    お時間あるときに、アドバイスいただけるとうれしいです。

  • MySQLの場合のVIEW 2008/12/15
    レビュアー:homan

    tontonさん

    > あきらめて、mySQLでやってみました。
    本当ですか・・・うまくいかなかったですか?

    > 無事登録はできたのですが、登録した後、編集しようとすると、管理画面に、携帯用のコメントが表示されません。
    > mySQLなので、VIEWの作成というステップを飛ばしたのですが、そのせいでしょうか?それとも、それが標準の動作でしょうか。


    ご察しの通り、VIEWを飛ばしたからですね。
    MySQLの場合は以下のファイルを確認して修正して下さい(僕の環境にMySQLに2系をインストールしたものがないので、未検証でのアドバイスとなります)

    /data/class/db/dbfactory/SC_DB_DBFactory_MYSQL.php

    このPHPを「vw_products_allclass_detail」で検索して、そのすぐ2行くらい下にある「comment3」の後ろに「comment7」を追記して保存してアップロードして下さい(念のためバックアップも取っておいてくださいね。)


    ちなみに、本当は直接「SC_DB_DBFactory_MYSQL.php」を編集するのではなく、「SC_DB_DBFactory_MYSQL_Ex.php」というファイルが「/data/class_extends/db_extends/dbfactory/」にあるので、そちらでカスタマイズしてほしいですが、よくわからなければとりあえず「SC_DB_DBFactory_MYSQL.php」を編集してお試しください。

  • ★★★★★ 追記です。 2008/12/15
    レビュアー:tonton

    どうも、編集時に、登録画面を表示するとき、comment7(=携帯用コメント)のDBデータを読み込んできておらず、この時点では、DBにはデータが残っているのですが、このあと再登録するときには、データが消えてしまっています。
    カスタマイズ時に、もうひとつ、DBから編集画面にデータを読み込んでくる処理を探して、そこにcomment7も読み込み追加しないといけないようです。
    ここの処理をもしかしたら、ポスグレでは、VIEWでしているのかもしれないですが、mySQLでは、別途処理が必要、と言うことなのかな、と想像しています。

  • ★★★★★ 度々にわたる自己レスですみません;;; 2008/12/15
    レビュアー:tonton

    自己解決しました。
    お騒がせしてしまってすみませんでした。

  • ★★★★★ MySQL使用時の変更点 2009/01/10
    レビュアー:3AWorks

    tontonさんが自己解決で終わってしまっているので追記させていただきます。

    MySQLを使用し、phpMyAdminを使用した場合の処理は、
    フィールド追加時の
    カラム「comment7」はデータ型「text」ではなく、
    データ型「mediumtext」での登録となり、

    /data/class/db/dbfactory/SC_DB_DBFactory_MYSQL.php

    の2箇所ある「comment3」の後ろに「comment7」を追記、
    "vw_products_nonclass"の"T1.comment6,"直下に"T1.comment7,"を追記します。

    わたしはコチラで表示されるようになりました。


    当方phpなどは初心者である為無駄な記述が入ってしまっているかもしれませんが、コチラで大丈夫だと思います。

    ちなみに環境は
    EC-CUBE   Ver.2.3.2
    PHP     5.2.6
    MySQL    4.1.22-log
    です。

  • ★★★★★ CSV登録の場合。 2009/01/23
    レビュアー:しましま

    この記事は大変役に立ちました。

    CSVで一括登録する場合、モバイル用説明文はどのようにすればよいのでしょうか?

  • Re: CSV登録の場合 2009/01/24
    レビュアー:homan

    そういえばCSVの問題がありますね。
    正直申し上げますと、この記事の内容ではCSV書き出し、登録に関する部分までは網羅されておりません。

    CSVの場合はCSV吐き出し部分、及び登録時用のPHPとDBを別途修正・追加する必要があるためです。

    最近CSV項目の追加などについてノウハウができましたので、近々記事にできそうならばしたいと思います。

  • ★★★★★ 絵文字の入力は無理でしょうか? 2009/02/06
    レビュアー:ebina

    たいへんすばらしいサイトをありがとうございます。とても助かっております。

    できれば、絵文字コードを入力したいのですが、
    いただいた方法では消えてしまいます。
    何か対応策はありますでしょうか?

  • TONTONさんが書き込まれていたエラーに似ているのですが、、、 2009/04/08
    レビュアー:TITO

    ポスグレを使っているのですが、商品登録画面にてモバイル用のコメントを入力出来るようになったのですが、再登録もしくは商品検索をして内容を確認すると登録したデータが消えてしまっています。
    ec cubeのバージョンの問題でしょうか?
    ちなみに、現在最新版を使用しております、、、

  • ★★★★★ やっと表示できました! 2009/05/02
    レビュアー:TOMY

    いつも参考にさせていただいております。本当に感謝しています。
    何度も致命的なシステムエラーを起こしてページの表示が大崩れになったりで苦労しましたが、今は達成感さえ抱いています。
    特に3AWorksさんのコメントが参考になりました。
    僕もMySQLを使用しているので、これはちょっと無理かなと思っていましたが。
    やはりポスグレのVIEWの部分がひっかかっていました。
    /data/class/db/dbfactory/SC_DB_DBFactory_MYSQL.php

    3AWorksさんの書き込み『の2箇所ある「comment3」の後ろに「comment7」を追記』の2箇所という部分につまづいてしまったんです。
    結局は、homanさんの書き込みのように「vw_products_allclass_detail」のそのすぐ2行くらい下にある「comment3」の後ろに「comment7」を追記、更に「vw_products_nonclass」の"T1.comment6,"直下に"T1.comment7,"を追記して保存、これをFTPでアップロードして表示成功しました。2箇所とはこういうことだったのかな?
    でも、成功して今は正直嬉しいです。ありがとうございました。

  • Re:TONTONさんが書き込まれていたエラーに似ているのですが、、、 2009/06/08
    レビュアー:ALEX

    TITOさん、他同様の方に。
    TOMYさんや3AWorksさんがMySQLの場合として、vw_products_nonclassにも"T1.comment7,"を追記という風に記載されていますが、ポスグレでも同様の対応が必要なようです。
    2ページのvw_products_allclass_detailにcomment7を追加するように、vw_products_nonclassも同様に追加してみてください。
    これで再登録時などでも表示されるようになります。

    ちなみに絵文字はドコモが配布してるi絵文字ツールで挿入すれば反映されます。
    www.nttdocomo.co.jp/service/imode/make/content/pictograph/tool/
    試してください。

  • 絵文字に関して 2009/07/15
    レビュアー:ALEX

    ひとつ前のコメントで絵文字はi絵文字ツールで挿入すれば反映されます。と書き込みましたが、確認しましたところ、ドコモとauおよびイーモバイルは双方でほぼ互換性がある変換がされるので表示上問題ないのですが、ソフトバンクでは互換性にかなり問題があり、全然違う絵文字が表示されてしまったりするようです。(例:1の絵文字がケーキになったり)
    なのでソフトバンク端末の利用も想定されているでしたらあまりオススメできません。

    できれば標準絵文字入力のなどの形式で挿入できればよいのでしょうが。

    どなたか対策があれば教えてください。

  • ★★★★★ 絵文字に関して遂に解決しました!! 2009/10/08
    レビュアー:ALEX

    以下の方法でEC-CUBE標準の絵文字形式でも入力可能になりました。

    下記2つのファイルを修正してください。
    /data/require_base.php
    97行目あたり
     // 絵文字変換 (除去) フィルターを組み込む。
     ob_start(array('SC_MobileEmoji', 'handler'));
    この2行を削除

    /html/require.php
    29行目あたりの
    if (SC_MobileUserAgent::isMobile()) {
    の次に
     // 絵文字変換 (除去) フィルターを組み込む。
     ob_start(array('SC_MobileEmoji', 'handler'));
    前述で削除した2行を追加。

    これでやの形式で絵文字が入力できるようになり、修正・登録等を行っても消えなくなります。
    お試しください。

  • ★★★★★ MySQL使用で 2009/12/06
    レビュアー:eriko

    お世話になっております。

    書籍も購入させていただきまして、詳しく解説はこちらとなっていたので拝見させて頂きました。
    書籍と違うようでわからなくなっているのですが。

    MYSQLを使用している場合、書籍の通りフィールドを追加してSmartyなどを変更しました。
    ただ、登録画面に表示されません。
    皆さんと同じようにVIEWのところでつまずいているようで、/SC_DB_DBFactory_MYSQL_EX.phpに
    追加を行うと以下のようなエラーが表示されるようになります。
    「システムエラーが発生しました。大変お手数ですが、サイト管理者までご連絡ください。」

    また、書籍のダウンロードから落としてコピーしてみたのですが結果が変わりません。

    やはり環境下でかわるのでしょうか。

    なにかアドバイスなどを頂ければと思います。

    よろしくお願い致します。

  • ★★★★★ 商品一覧に新しい値を表示するには 2009/12/24
    レビュアー:ゆたか

    この記事と投稿、大変参考になりました。ありがとうございます。

    これを応用するにあたって、ひとつご質問させていただきたいのですが、

    新しい値を商品一覧のarrProductsに追加し、表示させたいのですが、どうもうまくいきません。

    LC_Page_Products_List.phpの415行目あたりがそれっぽいのですが、いじるとエラーになります。

    ご教授いただきたく思います。
    よろしくお願いいたします。

  • ★★★★★ ビューが破棄できませんでした 2010/01/10
    レビュアー:hassle

    大変お世話になっています

    vw_products_allclass_detailを破棄しようとしたところ、

    EC-CUBE2.4.1でインストールしたサイトでは破棄できました。2.4.2では破棄できませんでした。

    サーバーはコアサーバーです。

    とりあえず、2.4.1でインストールしてから、必要なファイルを2.4.2に変更していくことで対応しようと思ってますが、もっと簡単な方法はないでしょうか?

  • サーバーが古いと追加できない機能なのでしょうか・・・。 2010/05/12
    レビュアー:abnet

    現在EC-CUBE 2.4.3の設置までできました。

    そこで「PC・ケータイ」コメント切り分けできないかと四苦八苦していたところ、こちらを見つけました。

    ところが、サーバーが「PostgreSQL 7.4.25」と古いため「ビュー作成」のところでくじけてしまいました。

    何か良い方法はないものでしょうか。

この記事に対するトラックバック

この記事のトラックバック先URL

EC-CUBE+安心=カゴラボ