スマートフォンでCSS3採用
スマートフォン対応カート−WEBインベンター

バージョンUP、最新情報、キャンペーン情報などを、月1回ほど配信 - WEBインベンター

新着情報/WEBインベンター 新着情報/WEBインベンター

スマートフォン対応ショッピングカートでHTML5/CSS3を採用 2011年08月01日

スマートフォン用ショッピングカートでHTML5/CSS3を採用

WEBインベンターのご利用に心から感謝いたします。
スマートフォン用ショッピングカートでHTML5/CSS3を採用し、スマートフォンらしい表示を実現しましたのでお知らせいたします。また、マイページにお気に入り商品を登録する機能を追加しました。また、東日本大震災復興支援キャンペーンについてお知らせいたします。さらに、今月のキャンペーンについてもお知らせいたします。詳しくは下記をご覧ください。

(1)スマートフォンでHTML5/CSS3を採用
(2)お気に入り商品登録機能
(3)東日本大震災復興支援キャンペーン
(4)今月のキャンペーン

━━━━━━━━━━━━━━━━━━━━━━━━━━━
1.スマートフォンでHTML5/CSS3を採用
━━━━━━━━━━━━━━━━━━━━━━━━━━━
これまで、ショッピングカートにスマートフォン(iPhone、iPod touch、Android)からアクセスした場合、暫定的な措置として携帯サイトを表示するようにしていました。しかし、今回、スマートフォン用ショッピングカートでHTML5/CSS3を採用し、スマートフォンらしいタップしやすい表示を実現しました。iPhoneやAndroidからアクセスした場合、下記のような動作となります。
  • ドキュメントタイプは『 HTML5
  • スタイルシートはCSS3を採用し、タップしやすい表示を実現。
  • metaタグ『 <meta name='viewport' content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no' /> 』(初期値)を出力。
  • 携帯の絵文字は非表示になり、半角カタカナは全角カタカナに変換されて出力されます。
  • 文字コードは、UTF-8(初期値)又はShift_JISを選択可能(k_shop_pl/design.plの5行目)。
スマートフォンの特色であるタッチパネルによる操作が楽なように、良く使うボタンやリンクはタップしやすく領域を広げてあります。数字の入力も自動で数字モードに切り替わります。
JQueryを活用してtextareaのリサイズ機能も搭載しました。しかし、JavaScriptは多用せず、動作の安定とスピードを重視しました。

さらに、商品画像は携帯用設定【20】で指定したサイズを約1.5倍に自動で拡大するようにしました。
  • サムネイル画像の場合は、1.5倍(75px→→→105px)
  • 拡大画像の場合は15/11倍(220px→→→300px)
スマートフォン用のHOME、TOP1〜TOP5、問合せフォームを携帯とは別にHTML5/CSS3で自由にカスタマイズできるようにしました。smartフォルダ内のファイルをテキストエディターで編集することにより可能となっています。詳しくは、スマートフォンのカスタマイズをご覧ください。

サンプルはこちらからご覧いただけます。
http://wb-i.net/spf_ex.htm

今回のバージョンUPの対象は下記のカートになります(バージョン番号が一つUPします)。
PCtoMobile Ver.15
PCtoMobile2 Ver.16
PCtoMobile-Unicode Ver.16
Contents-Cart Ver.15
Contents-Mall Ver.16

さらに、これに伴い、無料CSSテンプレートの調整も行いました。
http://wb-i.net/template.htm#css

━━━━━━━━━━━━━━━━━━━━━━━━━━━
2.お気に入り商品登録機能
━━━━━━━━━━━━━━━━━━━━━━━━━━━
お気に入り(マイページ)に登録する機能を追加いたしました。上記の新バージョンに搭載されています。

下記サンプルで確認できます。
http://wb-i.net/spf_ex.htm

━━━━━━━━━━━━━━━━━━━━━━━━━━━
3.東日本大震災復興支援キャンペーン
━━━━━━━━━━━━━━━━━━━━━━━━━━━
東日本大震災で被災された方の中には新たにネットで仕事を始めるという方もられるに違いありません。そうした方々の再出発を支援するために、被災された皆様にはショッピングカートを半額でご提供致します。ご希望の方は連絡事項に被災地域,、被災状況などをご記入の上、「東日本大震災復興支援特別価格を希望」と明記し、銀行振り込みにてお申し込みください。

【復興支援キャンペーン期間】2011年03月28日〜(締め切りは復興状況に応じて判断させていただきます)。

ご購入のお申し込みは下記からできます(会員登録が必要です)。
http://wb-i.net/system/shop.cgi

━━━━━━━━━━━━━━━━━━━━━━━━━━━
4.今月のキャンペーン
━━━━━━━━━━━━━━━━━━━━━━━━━━━
画像サイズ一括変換プログラムをリリースしました。Reserve〜Contents-Cartに対応した、サムネイル生成用のスクリプトで、商品一覧表用画像のサイズを一括変換する便利なプログラムです。ショッピングカートSPシリーズの新規購入者は無料で入手できます。
http://wb-i.net/soft2.HTML#Size

郵便番号から住所を検索する機能(Reserve以上のカート、及びMulti_Mail_Formでは携帯にも搭載)の組み込みマニュアルを用意しました。ショッピングカートSPシリーズ及び Multi_Mail_Formの新規購入者は無料で入手できます。
http://wb-i.net/soft2.HTML#Zip

【お求めはこちらから】⇒ http://wb-i.net/system/shop.cgi


引き続き皆様のご意見を取り入れながら、さらに優れたシステムを開発して行きたいと思います。
ご指導の程、よろしくお願いいたします。



Copyright (C) 2011  WEBインベンター All rights reserved.