ECサイト構築・リニューアルならクラウド型ECサイト構築ASPサービスサイトへ
資料請求
TOP

CATEGORY

SERVICE

スマートフォンECサイトデザインの基本~スマートフォンCSS活用基礎(14)~

  • 2012.04.20
  • 2012.04.17
  • 技術
スマートフォンECサイトデザインの基本~スマートフォンCSS活用基礎(14)~

以前の記事でご案内させていただいていた、ページをスクロールしても買い物カゴに入れるボタンがずっとついてくる機能につきまして、今月から新機能が追加されました!

【変わったこと】
今までの機能では、ボタンの位置は上部に固定されていました。
新機能では画面の下部に固定することができるようになっています!

比較してみると、こんな感じです。

上にするか下にするかは、商品購入ページの作り方や見やすさ、使いやすさ、ショップ様のお好みにあわせてチョイスしていただければと思います。

【使い方】
上に固定する時の設定方法とほとんど同じです。
機能カードをページに設置した後、aiship指定のdivタグで囲んで保存するだけでOK! 比較的カンタンな手順でした。

上にする時のclass名は「sp-fixed-top」でしたが、下に固定する場合はclass名を下記のものにするだけ!

CSS .sp-fixed-bottom

class名追加後はデザイン画面に戻して、ページを保存します。これでボタンは画面下部に固定され、スクロールするたびに画面下部にくっついてきてくれます。

上部固定の時と同様に、このclass名をHTMLに追加するのみではボタンのデザインまでは変わりません。過去の記事をご参照いただきながら、お好みのボタンになるようCSSでデザインを調整してくださいね!

( スマートフォンECクラウド型ASP『aiship(アイシップ)』 松井 )

                   
商品の販売に“夢中”になれる
クラウド型ECサイト構築ASP

ECサイト構築、リニューアルを2000社以上支援してきた知見から
ECの専門家として御社のEC事業成長をサポートします。

  • 導入実績2000社以上


    導入実績

  • 注文単価増加率114%

    導入1年後の
    注文単価
    増加率

  • 売上成長率128%

    導入1年後の
    売上成長率

  • EC支援歴20年


    EC支援歴

         

技術カテゴリの最新記事