Slim & Fastテンプレートについて

らくうるカート用の汎用テンプレートです。

らくうるカートのテンプレート編集で、HTML、CSSをこの商品に含まれるコードに置き換えていただくことで動作します。

■最終更新日

2023年4月10日 * 2023年3月までに公開された機能に対応しています。

テンプレート動作デモ

Slim&Fastテンプレートのキャプチャ動画です。それぞれ15秒程度ですので実際の動作をご確認ください。

トップページは、メインビジュアル（スライド）、おすすめ商品など標準の設定内容に応じてコンテンツを表示します。

商品一覧ページ（商品カテゴリ・キャンペーン）はページ分割を行わずに、同じページ内で続きを読み込んでいく仕組みです。

商品ページでは、バリエーションごとの商品画像や価格、在庫状況に応じて表示コンテンツを切り替えるリアクティブなシステムを採用しています。

商品検索は専用のページに遷移するのではなく、その場で検索条件を反映・結果表示します。

全体で共通しているのは、ユーザーの待ち時間短縮による離脱率の低下、目的の商品を見つけやすくすることで、購入率を高めることです。

その他、適切なOGPタグの自動設置やリッチリザルト表示への対応。キーボードユーザーへのアクセシビリティ改善等を盛り込んだテンプレートに仕上げています。

商品の内容

この商品に含まれるテンプレートファイル内訳

HTML

• 1_common.html (共通)
• 2_top.html (トップ)
• 3_archive.html (商品一覧)
• 4_search.html (検索結果)
• 5_product.html( 商品詳細)
• 404.html (404ページ)

CSS

• common.css (共通)

以上の７種類です。

ショッピングカートやマイページ、ランディングページ等、上記以外のテンプレートコードは含めておりませんのでご了承ください。

Slim & Fastの主な特徴

Slim&Fastテンプレートの基本コンセプトは、「すべてのユーザー（お客様）にスムーズな購入体験を提供する」です。

不要なページ移動を減らし、離脱率をさげる

商品検索、商品一覧の並び替え、次ページの読み込みをページ移動なしでリアルタイムに行うことで、サイト離脱率の低下を図ります。

商品バリエーションに応じてページ表示を変更

バリエーションごとに異なる価格や在庫等が設定されている場合、選択されているバリエーションや在庫量に応じてリアルタイムで表示内容、カートボタンを変更します。

公式テンプレートでは、在庫がない商品であってもカートに入れることができるのでカートページに行くまで在庫の有無が分かりませんが、
Slim & Fastでは在庫なし商品をカートに入れられないようになっています。

アクセシビリティへの配慮

キーボードユーザー、スクリーンリーダーユーザーの方ができるだけストレスを感じずに操作できるように設計しています。

SEO対策

title, descriptionを自動で生成します。たとえ未入力であってもtitle descriptionが表示されるように設定しています。また、適切なcanonicalタグを発行し、重複誤認等のリスクを抑えます。

OGP設定

各ページのOGPタグ（SNSシェア時に表示される内容を指定）を自動で設定します

リッチリザルト表示に対応

商品、パンくずリスト、キーワード検索のリッチリザルトに対応しています。

検索結果にリッチリザルトが表示されることでクリック率の改善が期待されます。（100%リッチリザルト表示となるわけではありません）

ページ表示速度

ページ読み込みをスムーズに行うように設定しています。

らくうるカートの場合、CSSをすべてインラインで読み込めばさらに速度は速くなりますが、ご購入された方がカスタマイズされることを考え、CSSファイルを別にしています。