月: 2009年1月

【EC-CUBE】メール送信者を社名から店舗名に変更する

EC-CUBEでは、なぜか、お問い合わせの確認メールなどを配信するときに送信元が、基本情報の店名ではなく、社名になっている。

ので、これを店名に変更。

LC_Page_Admin_Mail_Sendmail.phpのL135あたり、

,$objSite->data[“company_name“]             // 送信元名

,$objSite->data[“shop_name“]             // 送信元名

と変更。これで、ショップ名でメールが配信される。

【EC-CUBE】トラブル回避のためのインストールTIPS

2月20日一部追記・編集しました。——————–

EC-CUBEをインストールすると、結構なトラブルに見舞われる(^^;
ざっと思いついただけでも、

  • DBの文字化け
  • 携帯サイトで購入フローエラー
  • 郵便番号住所データ登録でエラー
  • DBのタイムゾーン問題(海外サーバなどでシステム時計のタイムゾーンが日本の標準とあってない場合など)
  • HTACCESSとPHP.INIの設定

すでに対応策をメモったものがほとんどだけど、サーバーによって対応策は違うし、順不同に個別のものをメモっただけなので、一度整理して、クリーンインストールを前提にインストール方法としてまとめようと思う。

DBがpostgreSQLの場合は、EC-CUBEは比較的トラブルも少ないようなので&今のところB豚はポスグレでインストールすることがほぼ無いので、DBは取り合えずmySQL想定で。

【EC-CUBEのインストール】

1)まずは事前確認。インストールするサーバーの環境を確認しておく。

  1. PHPとmySQLのバージョンは5以上がベター。EC-CUBEの公式対応バージョンは、
    分類 ソフトウェア 動作確認済み
    OS Windows Windows 2000 ProfessionalWindows 2000 ServerWindows 2003 ServerWindowsXP ProfessionalWindowsNT Workstation 4.0WindowsNT Server 4.0
    UNIX Linux glibc 2.1/2.2/2.3
    FreeBSD 5.4以降
    言語 PHP PHP4.1.x以降
    PHP5.0.x以降
    ライブラリ 画像生成 freetype2 2.1.x以降
    gd 2.0.x以降
    データベース Postgres PostgreSQL 7.4.x以降
    MySQL MySQL4.1以上
    (MySQL5.x系を含む)

    となっているが、1系の開発&サポートが打ち切られることもあって、今後の運用を考えるとPHP、mySQLは、どちらもver.5以上にしておいたほうが無難。

  2. サーバーのPHPがapacheのモジュール版であるかCGI版であるかを確認しておく。また、HTACCESSやPHP.INIでのサーバー設定のオーバーライドができるかどうかも確認。注意点は、(特にHTACCESSで)php_valueとphp_flagの上書き設定ができるかどうかが重要な確認事項。
    EC-CUBEの各種設定を行う際に、サーバーのデフォルト設定を個別に上書きして使用しないといけないことが多い。特に携帯サイトも一緒に使用したい場合は、これが正しく設定できないと動作がおかしくなる原因になりやすい。
    EC-CUBEでは、サーバーのphp初期設定を、HTACCESSまたはカスタムのphp.iniファイルで上書き変更している。まずPCサイト用に設定変更を行って、さらに携帯サイトのみ、さらに設定を携帯用に上書きしている。(PCの文字エンコードがUTF-8で携帯がSHIFT_JISであるため。)
    その際、PHPがCGI版で動作しているのであれば、HTACCESSファイルでは、PHPの設定の上書きはできないため、ユーザーが自分のカスタムPHP.INIファイルでそれぞれ設定を行うことになり、PHPがAPACHEモジュールで動作している場合は、HTACCESSファイルでPHP設定を上書きすることになる。
    ここでさらに1つ留意点は、PHPがapache版でHTACCESSでphp初期設定の上書きを行う場合は、ユーザーはルートのディレクトリとmobileのメインディレクトリにそれぞれ設定事項を書いたHTACCESSファイルを1つずつ配置すればいいが、PHPがCGI版でphp.iniで設定を行う場合は、EC-CUBEの/html/ディレクトリ以下の、phpファイルがあるすべてのディレクトリにそれぞれ、php.iniファイルを置いていいかなければならない。これは結構面倒。もう1つ、さらにphp.iniがユーザーごとにメインディレクトリに1つしか設定できないサーバーがある。これは、つまり=EC-CUBEでは、携帯サイトのディレクトリで別のphp.ini設定が利用できないということなので、携帯サイトも運用したいのであれば、そういうサーバーは利用しないほうがいいと思う。
    扱いやすいのは、apache版PHPのサーバーでHTACCESSファイルでの設定。ただし、PHP自体の動作はCGI版のほうが速いとか・・・海外では、CGI版がほとんどですね。。。
    また、URLをSEO対策して静的HTML化するカスタマイズを行いたいのであれば、HTACCESSでMOD_REWRITEが使用できることも合わせて確認しておくと良い。
  3. 独自SSLの使用可否と固定IPアドレスを使用する際の追加料金、制限などについても確認。
    EC-CUBEは現バージョン(2009/01/17 ver.2.3.3)では、まだ共有SSLはほんの一部の特殊条件に当てはまる場合を除き使用できない。ショップとしてきちんとセキュリティ対策を行いながら運用したいのであれば、基本独自SSLを使用することになるだろうと思う。
    独自SSLを使用するために必要なのが、固定IPアドレスだ。ホスティングサービスによっては、1契約につき固定IPは1つしか使えない、ということがあり、または共有ホスティングサービスの場合は固定IPも独自SSLもそもそも全く使えない、ということが多い。複数のショップを同じサーバーのアカウントで運用したい場合もあると思う。そういった場合は複数の固定IPアドレスでそれぞれ独自SSLが使用できなければならないことになるので、この辺も確認しておきたい。(SSLでサブドメも含めたワイルドカードSSLを使用したい場合なら、ワイルドカードSSLが使用できるか確認しておいたほうが良いと思う。ワイルドカードSSLは高価だし、使用できるサーバーサービスも意外と少ない。専用サーバーを丸々1台借りて自由に設定できるSEがいれば別だろうけど、そうでなければ留意したほうがいいと思う。)
  4. まあ、特に後から引っかかりそうなところは↑この辺。あとは、SSHで接続できないサーバーの場合は、phpMyAdminなどDBの値を後から編集できるツールが使用できるか、など自分のスキルに合わせて細かく聞いておくと良いっすな。結構あとからDB触ったりカスタマイズしたりする必要性に見舞われることが多いので。。。

2)EC-CUBEパッケージのダウンロード

  1. EC-CUBEのホームページから、EC-CUBE2系→正式版をダウンロード、解凍しておく。ダウンロードするファイルをZIPにするかTAR.GZにするかは、自分が解凍しやすいほうでOK。普通WINDOWSユーザーはZIP、LINUXユーザーはTAR.GZをダウンロードする。
    ナイトリービルド版は、有志の開発者が日々新しい機能を組み込んだりバグを修正したりしている開発版なので、いち早く新しい機能を試したい、正式版でどうやっても解消できないバグが開発版で対策されている、といった場合には使用すると良い。ただし、あくまで開発中のベータ版であるのでテストなどが不十分なこともあるから、そのあたりは自己判断で。(ここでは正式版をDLしたものとして話を進める)
  2. パッケージの中身に抜けがないかチェックするため、念のためシステム要件や仕様、構成等をホームページを見ながら軽く確認。

3)PHPの設定。

PHPがapacheモジュール版の場合は、HTACCESSファイルで、CGI版の場合は、PHP.INIで、サーバーのPHP設定をEC-CUBE用に変更する。

  1. apache版の場合
    下記はいずれも、EC-CUBEのパッケージに入っているので、そのまま使用してかまわない。また、設定する値は自分の使用しているサーバーのデフォルトの値と矛盾するものだけセットすればいい。
    /html/のなかに、「.htaccess」ファイルを作成して、下記内容で保存。

    #基本はphp_ini.incで設定するが、ini_setで反映されないものはここで設定する
    php_value mbstring.language Japanese
    php_value output_handler mb_output_handler
    php_flag mbstring.encoding_translation 1
    php_flag magic_quotes_gpc 0
    #php_flag session.use_cookies 0
    #php_flag session.use_trans_sid 1
    # INI_ALL なのにもかかわらず, ini_set で指定しても反映されない環境がある…
    php_value mbstring.internal_encoding UTF-8
    # デフォルトテンプレートの状態で 2M近くになるため
    php_value upload_max_filesize 5M
    php_value date.timezone Asia/Tokyo

    /html/mobile/にも同様に、「.htaccess」ファイルを作成して、下記内容で保存。

    php_flag mbstring.encoding_translation 0
    php_value output_handler null
    php_value variables_order EGPS
    php_flag session.auto_start 0
    php_flag session.use_trans_sid 1
    php_value date.timezone Asia/Tokyo

  2. CGI版の場合
    設定する内容は「.HTACCESS」ファイルの場合と同じ。CGI版ではHTACCESSでのPHP設定の上書きができないため、php.iniで設定する。また、同様に、設定する値は自分の使用しているサーバーのデフォルトの値と矛盾するものだけセットすればいい。
    /html/の、phpスクリプトファイルが存在する全てのディレクトリに、「php.ini」ファイルを作成して、下記内容で保存。(※ルートのphp.iniだけ設定すれば良いサーバもあるが、mobileのほうではどのみち個別に設定しなければいけない)

    #基本はphp_ini.incで設定するが、ini_setで反映されないものはここで設定する
    mbstring.language= Japanese
    output_handler= mb_output_handler
    mbstring.encoding_translation= 1
    magic_quotes_gpc= 0
    #session.use_cookies= 0
    #session.use_trans_sid= 1
    mbstring.internal_encoding= UTF-8
    upload_max_filesize= 5
    date.timezone= Asia/Tokyo

    /html/mobile/にも同様に、「php.ini」ファイルを作成して、下記内容で保存。

    mbstring.encoding_translation= on
    output_handler= null
    variables_order= EGPS
    session.auto_start= off
    session.use_trans_sid= on
    date.timezone= Asia/Tokyo

4)サーバーのWEB公開領域にダウンロードしたEC-CUBEのパッケージをアップロードする。

  1. さて、ここでちょっと考えておくのがEC-CUBEのファイルディレクトリ構成。デフォルトでは、/html/と/data/の2つのディレクトリがあり、そのままアップロードして、/html/をwebサイトのデフォルトアクセスディレクトリに設定するんであるが、その構成に当てはまるサーバ(=つまりWEBの公開ルートディレクトリより上の階層にファイルを格納できるサーバ)は意外と少ない。
    ので、ここの構成を変えることにする。必要がない場合は、このステップはスキップね。
    今回は、/html/の中身をWEBのルートディレクトリ(メインのURL http://wwwdomain.com/などとして、アクセスできるWEB用の領域。通常は、/public_html/とか/web/とか/~user名/html/になっていると思う。)にアップロードし、/data/の中身は、その中に一階層下げてアップロードすることにする。
    /html/の中に、「define.php」というphpファイルがあるので、それを秀丸などのテキストエディタで開き、
    ——
    /** HTMLディレクトリからのDATAディレクトリの相対パス */
    define(“HTML2DATA_DIR”, “/data/“);
    /** DATA ディレクトリから HTML ディレクトリの相対パス */
    define(“DATA_DIR2HTML”, “../“);
    ——
    と変更。
  2. 「data」フォルダは、「html」フォルダの中に入れ、「html」フォルダを開いて、その中身のファイルを全てサーバーにアップロード。
  3. この時点でアップロードファイルの構成パターンは大体下記の3つ。
    • dataフォルダをhtmlフォルダの中に入れ、htmlはサーバのWEBルートディレクトリになっているパターン。
      (root)|—|about|  (htmlフォルダの中身)
      —|admin| (htmlフォルダの中身)
      —|data|
      —|その他のファイル| (htmlフォルダの中身)
    • /html/をWEBの公開ディレクトリに設定し、htmlフォルダとdataフォルダが平行してアップロードされているパターン。
      |html|—|about|
      —|admin|
      —|その他のファイル|
      |data|  (※htmlと同じ階層)
    • /html/の中身をWEBの公開ディレクトリに設定し、dataフォルダは、それと同階層になるように、WEBの公開ディレクトリより1段上の階層にアップロードされているパターン。
      (root)|—|about| (htmlフォルダの中身)
      —|admin| (htmlフォルダの中身)
      —|その他のファイル| (htmlフォルダの中身)
      |data|  (※htmlの中身=rootより1段上の階層)

5)データベースの作成と事前設定。

  1. まずは、EC-CUBE用のデータベースを作成する。
  2. 作成できたら、データベース内の文字化けを防ぐため、DB内のデフォルトの文字コード設定を確認、修正しておく。
    まずは、現状のデフォルト文字コードを確認。
    phpMyAdminで下記のSQLコードを実行し、現在サーバーで使用されている文字コードを確認する。

    show variables like “char%”;

    serverphp

    システムの文字コード以外は全てutf-8になっているか確認。(システム文字コードもUTF-8であればそれはそれでかまわない) 

  3. DBの文字コードがUTF-8になっていない場合は、再びSQLで、

    alter database 〜DB名 character set utf8;

    と打ち込んで文字コードを変更。変更後、先のshowコマンドで再びチェックしておく。
    上記のように正しく変更されていればOK。

  4. このままでは、スクリプトを起動したタイミングで文字コードはサーバーのデフォルトに戻ってしまうので、スクリプトにもコードを追加する。
    /data/class/SC_DbConn.phpの65行目あたりに下記コードを追加しておく。(多分、新しいバージョンのEC-CUBEであれば、ここはパッケージソース自体が修正されていると思う。一応確認。)

    if(defined(‘DEFAULT_DSN’)) {
    $objDbConn = DB::connect(DEFAULT_DSN, $options);
    $this->dsn = DEFAULT_DSN;
    } else {
    return;
    }
    }
    }
    if (DB_TYPE == ‘mysql’) {
    $objDbConn->query(‘SET NAMES utf8’);
    }

    $this->conn = $objDbConn;

これで、いよいよインストール。

6)ブラウザから、EC-CUBEをインストールするURLを開く。インストーラの手順に沿ってインストール。

  1. インストールが正常に完了したら、再び/data/class/SC_DbConn.phpを開き、
    $this->conn = $objDbConn;の下(先のコードのL69辺り)に
    $this->conn->query(“SET time_zone = ‘Asia/Tokyo'”);
    と追記して、保存。上書きアップロード。
    ※国内サーバの場合は、タイムゾーンはすでにアジアになっているだろうから、その場合はこの設定は不要。

7)管理画面からショップの設定を行う。

先に、基本情報と特定商取引法に関する表記を入力。その後、「郵便番号DB登録」をクリック。郵便番号辞書はすごいデータ量なので、途中で何とかサーバーエラーが表示されたり画面が真っ白になることがある。
そういう時は、phpMyAdminで、mtb_zipテーブルを確認してみて、その中のデータが増えていれば、問題なく登録されていっていると考えていいので、最終的に、ブラウザで完了画面が出るまで休み休みしながら何度か繰り返しページをリロードし続ける。

完了したら、再びphpMyAdminからmtb_zipテーブルの中身を確認して、データ登録が沖縄県まで全て完了しているか確認しておこう。

最後にメールの送信テスト。
ECサイトのお問い合わせから別のメールアドレスで問合せメールを送ってみて、正常に送信(管理者とお客様双方に確認メールが届く)されればメールはOK。
もし、送信されない場合は、ブラウザからEC-CUBEの管理画面にアクセスして、システム管理画面のパラメータ設定で、「MAIL_BACKEND」の値を”smtp”から”mail”または”sendmail”に変更してみる。たいていは、「mail」で送信できるようになると思う。

大体ここまでで、クリーンインストールでトラブルになる点を解消したインストールができていると思う。カスタマイズを行う前に、フロント画面でログインや注文動作などチェックしておく。

携帯サイト制作:PCで絵文字も表示確認する

1)外字ファイルの登録
DOCOMOサイトから”i絵文字”をダウンロード、解凍し、インストールする
→IEなどでDOCOMOの絵文字が見れるようになる。
ソフトバンクやauの絵文字は、基本のものは3キャリアで絵文字置き換えプログラムによって変換するからこれでOK。

2)FIREFOXでも絵文字を見る場合(シミュレーターなどで)

  1. コントロールパネルから、フォントフォルダを開き(Vista では、[デスクトップのカスタマイズ] [フォント])、i絵文字をインストールしたディレクトリにある外字フォント「docomo.tte」をインストールする。
  2. FireFox3でアドレスバーに 「about:config」 と入力して [Enter]キーを押す。
  3. 「フィルタ」の入力欄に 「font.name-list.*.ja」 と入力する。
  4. 表示された項目それぞれ、現在の設定文字列の先頭に「EUDC, 」を追加。emoji

おお~。確認できた♪

3)FIREFOXの携帯エミュレータ

FIREFOXで携帯のサイト確認ができる。ユーザーエージェントを携帯のものに置き換えて、見た目をシミュレートする。

http://firemobilesimulator.org/ (携帯用シミュレータ)

http://www.qooin.com/firefox/useragent.html (ユーザーエージェントをスイッチする)

3キャリア対応携帯サイト制作覚書

3キャリア共通でコード利用したいのであれば、基本3G以上を対応機種と考えて、古い機種についてはある程度の割りきりが必要。

XHTMLで記述
コンテンツのMIMEタイプもHTTPヘッダーも「application/xhtml+xml」
文字コードは、Shift-JIS
CSSは基本インライン
画像の全画面表示サイズは、240pxで作成してwidth=100%としておく
画像フォーマットは、JPEGかGIF
ページ全体の容量は、トップページで100KB以内(広範囲で対応させるには5KB)
文字サイズは、標準で全角10文字程度(小で13文字程度)
絵文字を共通化するにはPHPなどの絵文字共通化プログラムが必要
コーディングでインデントを使わない

【デザインのポイント】
<hr>はキャリアによって指定・表示に癖が出る
・ドコモでは、XHMLでは全ての属性に非対応
・ソフトバンクは、罫線の上下にマージンができる、hrの余白調整はmargin/paddingプロパティで対応可能、noshadeにも対応
・auは、ライン色はcolorで指定可能、height/borderは指定できない、text-alignプロパティが使用可能(au以外では、align属性を使用する)
・WIDTHは全キャリア使用可能
・hrを使うより画像使用したほうがキレイにできる

画像
・ドコモXHTMLではalign属性が非対応、CSSでのフロートはauが非対応のため、画像の回り込みをするには、両方の属性を併用しなければならない
・回り込みの解除は、<br clear=”all” />だが、ドコモ非対応、ドコモでは、「blockquote」「dl」「div」「form」「hr」「h1-h6」「ol」「ul」「p」「pre」にclear属性を記述すれば旧機種でも対応できる。
・画像のmarginはドコモでも対応
・画像のborderはドコモ非対応

リンク
・ドコモxhtmlは、<a>タグのname属性に非対応なので、<a>タグには、nameとidを両方使用する

・auでは、auではdivなどのブロックレベル要素間で1pxほどのすき間が生じてしまうというバグがある
・ドコモとau/ソフトバンクの違いということであれば、外部CSSにau/ソフトバンク用のCSSを書いておいて、ドコモにはインライン指定のCSSを優先させるといった手順をふむことで、違いを吸収するということが可能
・CSSはstyle属性が優先されるので、ドコモのインラインCSSとソフトバンク/auの外部CSSを共存する場合は、<DIV>タグを入れ子にして外側をインラインCSSにして内側のdivにソフトバンク/au用のクラスを指定する
・アクセスキーの設定:一般的には「[0]がトップページ」「[9]が1つ前のページへ戻る」「[5]更新」としているサイトが多い
・入力モードの設定:ドコモのiモードHTMLの場合は、「istyle」属性を、iモードXHTMLの場合は、style属性で「-wap-input-format(WCSS)」を指定します。auの場合は「format」属性で、ソフトバンクの場合は「mode」属性をinputタグに指定します。3キャリア対応で書く場合は、それぞれの属性をinputタグに併記すれば問題ない。ただし、-wap-input-format(WCSS)をソフトバンクで読み込むと入力制限がかかるバグがある。このため、入力設定をしたいフォームでは、スクリプト側でキャリアごとの振り分けをするとよい。
振り分けをする場合は
DoCoMo
style=-wap-input-formatのみ
au/SoftBank
istyle、format、modeをすべて記述
という感じになるように切り替えてやると、おかしな状況にも対応でき、きちんとした入力モードの切り替えが実装できる。

Smartyのプラグインなり、ヘルパーにまとめるなりしてやると、簡単に使える。

参考:http://www.thinkit.co.jp/channel/0810_2.html

パンくずリスト実装色々

http://www.tomcoote.co.uk/JavaScriptCookieCrumbs.aspx

http://coliss.com/articles/build-websites/operation/javascript/693.htmlで紹介されていた)

ユーザーが辿ってきたページの経路履歴をクッキーに保存して、その経路をパンくずリストとして書き出すタイプ

http://www.mtblue.org/pc/web/breadcrumbs.php

ディレクトリの構造を取得して、上の階層へ辿るリンクをパンくずリストとして書き出すタイプ

 

色々ありますな。