navigation>年末年始休業につきまして【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。長いスマホ商品ページでも購入導線をわかりやすく表示し離脱を防ぐ長いスマホ商品ページでも購入導線をわかりやすく表示し離脱を防ぐ画像やテキストで商品が訴求された長い商品ページは商品の情報が充実していてるのですが、いざ買おうと思ったときに「どっから買うたらええねん」となってしまうことがあります。スマートフォンでは画面が小さい分注意。なってしまわないように、今回は商品ページでユーザーにを迷わせないようにカートボタンへの固定ボタンを表示させます。サンプル下記がサンプルの商品詳細ページです。iframe内をスクロールしてみてください。スクロールすると、「この商品を購入する」のボタンをふわっと表示。ボタンをタップすると、「カートに入れる」へ。レジまで連れて行ってくれます。下記の方法で実装可能です。src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>JQueryを使用しますのでライブラリを読み込んでおきます。新しいバージョンのほうが読み込み速度が速いです。</a></div>☆☆☆☆の部分は、ボタンをタップしたときにスクロールする先のIDを記載して下さい。表示速度のことを考えると、htmlの下部に記述するほうが良いです。3.ボタンを固定するCSSを追加CSSでボタンをページ下部に固定します。100%;}こちらのCSSでページ下部にボタンを固定します。Laboなお、ボタンの上に影を付ける場合は下記のCSSで設定可能。});});どのくらいスクロールしたら表示するかは、上の数字を書き換えると調整可能です。Laboこちらで完成です!いかがでしたでしょうか。近年はモバイルファーストなサイトや1カラムのページが増えて、1ページが長いサイトが増加傾向にあります。そのようなサイトでは是非ともお試しください。);”スマホで売れる”ためには必須の「レスポンシブECサイト」とは?2019年、ECサイトの利用者は今やスマ―トフォンからが7割を超え、市場のニーズは完全にPCからスマホに転換しました。検索エンジン大手のGoogleも「モバイルファーストインデックス」を打ち出し、スマホ対応の手段として正式に「レスポンシブWEBデザイン」を推奨しています。そのような背景から、昨今のEC市場ではスマートフォンへの適切な対応が急務となっており「レスポンシブECサイト」のニーズが非常に高まってきています。本パンフレットではECサイト運営を取り巻く環境の変化を、レスポンシブECサイト構築導入実績No.1のプラットフォームである「aishipR」の機能や実績を踏まえながらまとめました。・レスポンシブECサイトがなぜ今選ばれるのか・これまでのECサイトの課題とは何なのか・どのようにすれば解決できるのかといったノウハウから、プラットフォーム変更で得られる効果の実例まで網羅して解説しています。ECサイトの運営されておられる経営者様だけでなく、運営担当者様にも必ずお役に立つ内容となっておりますので、是非ご活用ください。無料パンフレットを請求するABOUTモバイルファーストマーケティングラボとは、スマートフォン/タブレット/PCに対応したレスポンシブECサイトの構築や成功事例の最新情報を発信するブログです。京都と琵琶湖の水上で送る。レスポンシブECサイト構築ASP「aishipR」の情報発信、導入前のご相談や使い方のご案内、大阪でのセミナー運営等を担当しています。EC事業者様にとって有益な情報を発信することを目指します。2014.02.04こんにちは。ECプロデュース部の岡本です。コメントをキャンセルメールアドレスが公開されることはありません。コメント名前メールアドレスサイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。自社ECサイト運営でASPをオススメする理由モバイルファーストラボ。