「重大なモバイルユーザビリティの問題が検出されました」
という通知がGoogleウェブマスターツールから届くようになったんですね。

突然、となりの席のワニタがつぶやきました。
何を言っているのかすぐには理解できませんでしたが、
どうやら、知人のネットショップのウェブマスターツールに自身のメールアドレスを登録していたところ上記のような通知が届いた模様です。

昨年の10月に、モバイルユーザビリティに関するレポートがgoogleウェブマスターツールに追加されましたが、まさかメールで通知までするとは、Googleがいかにモバイルを重要視しているかということですね。
モバイルファーストなる言葉を初めて耳にしてから久しいですが、もはやサイト管理者なる者、モバイル(スマホ)を重要視していて当たり前！という時代のようです。

そういえば、e-shopsカート2のネットショップ開業CMSプランでご利用いただいているCMSのモバイルユーザビリティはどのような評価を受けるのか？

気になったので、早速チェックをしてみました。
内心ドキドキしながら「モバイルフレンドリーテスト」のサイトに
ネットショップ開業CMSプランのデモサイトのURLを入力してテストを実施してみると結果は・・・ モバイルフレンドリーしてますか？の続き＞

秋ですね。ワニタです。

今回は、「カゴに入れる」ボタンをオリジナル画像にする方法について紹介します。

e-shopsカート2では、「カゴに入れる」ボタンのHTMLソースを商品ページに 貼り付けて、ご利用をいただきますが、HTMLソースの編集を行う必要なく「カゴに入れる」 ボタンをオリジナル画像にすることもできます。
この機能を利用すると、オリジナル画像を含んだ「カゴに入れる」ボタンの HTMLソースになります。そのHTMLソースを商品ページに貼り付けることで、 オリジナルの画像を「カゴに入れる」ボタンとして表示できます。

管理画面上で「カゴに入れる」ボタン用のオリジナル画像を変更すると、 既にその機能によりオリジナル画像を表示しているページでも新しい画像に 表示が切り替わります。
全商品にて共通のオリジナル画像を利用する場合には、画像変更しても 貼り直しが必要でなく便利にご利用いただけますが、商品によって表示する カゴに入れるボタン画像を変更したい場合には、対応できません。

前置きが長くなりましたが、今回は管理画面から取得したHTMLソースを編集 することで、商品毎にオリジナル画像を利用する方法について案内致します。

※今回の記事では、「カゴに入れる」ボタンのHTMLソースの編集を紹介致しますが、HTMLソースの編集はご自身の責任にて行って下さい。
e-shopsカート2では管理画面から取得したHTMLソースをそのままご利用頂くようお願いしており、このHTMLソースの編集方法や、編集に起因した問題等についてはサポート対象外とさせて頂いています。

今回の記事は、「カゴに入れる」ボタンのHTMLソースを取得した通常カゴにのみ有効であり、ネットショップ開業CMSプランでのページ自動生成機能とシンクロカゴ機能には対応していません。

ご利用ショップ様から熨斗の設定についてご質疑を頂くことがあります。

ワニタの回答は、

「のし専用の設定は用意がございませんが、ラッピング機能やアンケート機能等にて代用されてはいかがでしょうか。
それぞれ、購入手続き画面にて表示されますが、追加代金を徴収される場合にはラッピング機能、追加代金を徴収されない場合にはアンケートが向いています。」

と案内をしています。

お電話でのご質疑では、その時は設定されずに「検討する」としてこの話題が終わることが多いです。

お電話を終えて、ワニタは毎回、

「のしってナニ？」

と思うのです。
そして、

「今、忙しいから、いつか調べよう。」

と。

お恥ずかしい話ですが、ワニタ自身、”のし”というものを良くわかっておりません。（汗）

スタッフブログのネタとして調査したら誰かの役に立つのでは？ということで、今回、のし（の設定）について紹介してみます。
以下、ネットで調べた情報です、ご参考程度にご覧いただけると幸いです。

熨斗（のし）の設定についての続き＞

スマートフォンが着々と普及している昨今ですが、タブレットも魅力的な新機種がそろってきて、そろそろ一つ欲しいな～　などと考えておりましたら、なんと弊社スタッフ全員にネクサス７がサプライズ支給されました。（嬉しいです！ありがとうございます）

プライベートではノートPCとスマートフォンを併用している私にとっては、当初はタブレットの利用シーンて？と戸惑いもありましたが、今では社内でのミーティング資料閲覧はもちろんのこと帰宅してからの電子書籍の閲覧やちょっとしたブラウジングにとっても重宝しております。

ふと思ったのですが、タブレットでHPを閲覧する時って、PC用のページのほうが見やすいのでしょうか？それともスマートフォン用？

答えは「人それぞれ」、といったところでしょうか。

アクセスするサイトによってPC用が表示されたりスマートフォン用が表示されたりすることがあるのですが、どちらのページを表示するかは基本的にはアクセスしたブラウザから送信される「ユーザーエージェント」で判断しているそうです。(HP側がスマートフォン対応している場合のお話です、念のため...)

ユーザーエージェント？　と思われた方、すみません。ざっくり申し上げると、HPを閲覧するためにアクセスした端末の情報をHP側のサーバに伝える役割を担っているのがユーザーエージェントです。個人情報ではないので全く問題ないと思いますが、知らずのうちに自身の端末の情報がサーバ側に伝わっているということになります。そこには例えばAndroidやiphoneなどの端末の種類やブラウザの種類に加えて、モバイル端末であればMobileという記述もありますので、この情報を元に表示するページの種類をPC用かスマートフォン用かに切り替えているという具合です。

この表示の件で同僚から質問されたことがありました。「同じサイトでも、Android搭載のタブレットであるギャラクシータブではスマートフォン用ページが表示されるのに、同じくAndroid搭載のタブレットであるネクサス７ではPC用ページが表示されるのは、何故？・・・」と。

これは、ギャラクシータブ標準搭載のブラウザーである「ブラウザ」のユーザーエージェントに【Mobile】の記載があるのに対し、ネクサス７標準搭載のブラウザーである「Chrome」ではユーザーエージェントに【Mobile】の記述がないためだと思われます。

いずれは何らかのう方向に統一されていくかもしれませんが、現状ではタブレットも「それぞれ」のようです。ちなみにe-shopsカート2のスマートフォン対応もユーザーエージェントを元に判定をおこなっていますので、ネクサス７でアクセスして商品をカゴに入れるとPC用の買い物かご画面が表示されます。