はじめに
2026 年現在、EC 市場は依然として成長を続けており、中でも Shopify を利用する事業者は増加の一途をたどっています。世界規模でのシェア拡大に伴い、日本国内でもショップ運営者が Shopify に注目し、オンラインビジネスをスピーディーに構築するケースが増えてきました。
そんな中、ストアの第一印象を決める要素として注目を集めているのが 「テキスト付き画像のカードカルーセル」 です。Apple Store のような横スクロール型のカードカルーセルは、新商品の紹介・キャンペーンバナー・ブランドストーリーの訴求など、限られたファーストビューの中で複数のメッセージを伝えられる強力な見せ方です。画像だけのスライダーよりも情報量が多く、テキストだけのバナーよりも視覚的に訴求力が高いため、コンバージョン率の改善にも直結します。
しかし、残念ながら Shopify のデフォルトテーマだけでは、複数枚のカードを横スクロールさせ、テキスト付き画像をリンク付きで並べるカードカルーセルを柔軟に作ることはできません。 そのため、多くの事業者は アプリ を活用し、ノーコードで美しいカードカルーセルを設置できるように工夫しています。
この記事では、
- Shopify の カード・カルーセル・テキスト付き画像 表示の基礎
- Shopify ストアにカードカルーセルを設置するメリット・デメリット
- そして Shopify で テキスト付き画像のカードカルーセル を設置できる 5 つ のアプリ
をまとめてご紹介します。特に最初にご紹介する 「シンプルカードカルーセル｜お手軽テキスト付き画像スライダー」 は、Apple Store 風のおしゃれなカードカルーセルをノーコードで設置できる代表的なアプリで、導入・設定ともにシンプルでわかりやすいため、ボリュームたっぷりに丁寧に解説します。ぜひ参考にしてみてください。
今回は、以下の記事を参考にしています。
カードカルーセルとは？
「カードカルーセル」 とは、カード状にレイアウトされた複数のコンテンツ（画像 + テキスト）を、横方向にスクロールできる UI で表示する機能のことです。Apple Store の公式サイトや、Netflix の作品一覧などでよく見かけるあのデザインを、Shopify ストアでも実現できます。
カードカルーセルでは、1 枚のカードに以下の要素を含められるのが特徴です。
- 画像（写真・グラフィック） — 商品やキャンペーンのビジュアル
- サブタイトル — 「NEW」「期間限定」「Featured」などの小さなラベル
- メイン見出し — 商品名やキャッチコピー
- 補足テキスト — 商品の説明や訴求文
- リンク — 商品ページや特集ページへの遷移先
通常の画像スライダーが「1 枚の画像で 1 つのメッセージ」を伝えるのに対し、カードカルーセルは「複数のカードに分割しつつ、それぞれに個別のメッセージ・遷移先を設定できる」点が大きな違いです。情報量が多く、回遊動線を作りやすいため、トップページのヒーロー直下や、コレクションページ・商品ページの追加コンテンツとして活用されています。
Shopify でテキスト付き画像のカードカルーセルを表示するメリット・デメリット
メリット
-
限られたスペースで複数のメッセージを伝えられる
1 つのセクションの中で複数のカードを横スクロールできるため、新商品・セール・コレクションの 3 つを同時にアピールするなど、ファーストビューの情報量を大きく増やせます。スクロールせずに多くの情報を提示できるため、離脱を防ぎつつ訴求できます。 -
テキストと画像を組み合わせた訴求ができる
画像だけでは伝わりにくい価格や条件、商品の特徴などをテキストで補足できます。「NEW」「LIMITED」「30% OFF」などのサブタイトルを追加することで、視線を集めるアクセントにもなります。 -
回遊率・コンバージョン率の改善に貢献する
各カードに個別のリンクを設定できるため、商品ページや特集ページへの導線を増やせます。お客様が興味を持ったカードから直接遷移できるため、コンバージョンまでのクリック数を減らせます。 -
Apple Store 風のおしゃれなデザインでブランドの世界観を演出できる
横スクロールの動きや、影付きのカード、丸みのある角などを組み合わせると、ブランドのデザインをワンランク上に見せられます。プレミアム感を演出したいストアにも適しています。 -
自動再生でキャンペーンを順番にアピールできる
自動再生機能を有効にすれば、お客様が操作しなくてもカードが順番にスライドします。複数のキャンペーンを切り替えながら見せたい場合に便利です。
デメリット
-
カードの内容を作り込む手間がかかる
1 枚のカードに対して画像・サブタイトル・メイン見出し・補足テキスト・リンクを設定するため、シンプルなバナー設置よりも準備に時間がかかります。とはいえ、アプリを使えばノーコードで設定できるため、コーディングの手間は不要です。 -
画像のクオリティに依存する
カードカルーセルはビジュアルを大きく見せる UI のため、画像の品質や撮り方が見た目に大きく影響します。低解像度の画像や、構図のばらつきがあるとブランドイメージを損なう可能性があります。 -
モバイルでの表示確認が欠かせない
PC で美しく見えても、スマホでは文字が小さくなったり、カードの幅が中途半端に表示されたりすることがあります。レスポンシブ対応のアプリを選び、必ず実機で確認することが大切です。
Shopify のデフォルト機能ではテキスト付き画像のカードカルーセルが作りづらい
Shopify の標準テーマ（Dawn など）にも「画像バナー」「コラージュ」「マルチカラム」「スライドショー」といったセクションは用意されていますが、それぞれに制約があります。たとえば、「スライドショー」は 1 枚あたり 1 メッセージの大きなバナーが基本で、横スクロールで複数カードを並べるレイアウトには向きません。「マルチカラム」はカード状の配置はできますが、横スクロールやカードごとのリンク・自動再生に対応していないテーマも多いです。
そのため、
- 画像 + サブタイトル + メイン見出し + 補足テキスト + リンクをカード単位で設定したい
- 横スクロールで Apple Store 風に見せたい
- カードごとに画像レイアウト（全面・上半分・下半分）を変えたい
- 自動再生・無限スクロールを使いたい
といった要望がある場合には、専用のアプリを導入するのが最もシンプルで確実な方法です。
Shopify でテキスト付き画像のカードカルーセルを設置できるアプリ 5 選
ここからは、おすすめのアプリを 5 個ご紹介します。1 つ目の 「シンプルカードカルーセル｜お手軽テキスト付き画像スライダー」 は、ボリュームたっぷりに丁寧に解説します。
シンプルカードカルーセル｜お手軽テキスト付き画像スライダー
はじめに
「シンプルカードカルーセル｜お手軽テキスト付き画像スライダー」は、株式会社 UnReact が開発・提供する Shopify アプリです。Apple Store 風のおしゃれなカードカルーセルを、ノーコードでストアの好きなページに設置できます。最大 6 枚のカードに画像・サブタイトル・メイン見出し・補足テキスト・リンクを設定でき、画像レイアウトは「標準（画像全面）」「カードの下半分」「カードの上半分」の 3 種類から選択可能です。料金は Basic Plan 月額 $4.99（7 日間の無料体験あり、年払いで実質 2 ヶ月分無料）と、はじめての方にも導入しやすい価格設定になっています。
できること
「シンプルカードカルーセル｜お手軽テキスト付き画像スライダー」は、Apple Store 風のスタイリッシュなカードカルーセルをコーディング不要でストアに追加できるアプリです。新商品の紹介・キャンペーンバナー・ブランドストーリーの訴求など、さまざまなシーンで活用できます。
主な特徴は以下のとおりです。
- Apple Store 風のおしゃれなカードカルーセルをどのページにも追加できる
- 最大 6 枚のカードに画像・見出し・説明文・リンクを設定できる
- 3 種類の画像レイアウトをカードごとに選択できる
- カードの幅・比率・間隔・角丸・影・色・フォントを自由にカスタマイズできる
- 自動再生と無限スクロールに対応
- PC・タブレット・スマホすべてでレスポンシブ表示
- コーディング不要、ワンクリックでテーマに追加可能
ノーコードでカードカルーセルを挿入できる
専門的なコーディングの知識は一切不要です。テーマエディタからアプリブロックを追加するだけで、Apple Store のような洗練されたカードカルーセルをストアに簡単に表示できます。トップページや商品ページ、コレクションページなど、設置したい場所に自由に配置できます。
様々なスタイルでカードカルーセルを表示できる
カードの画像レイアウトは「標準（画像全面）」「カードの下半分」「カードの上半分」の 3 種類から、カードごとに自由に選択できます。商品の見せ方やキャンペーン内容に合わせてレイアウトを使い分けることで、訴求力の高い魅力的な売り場を演出できます。
ノーコードで見た目をカスタマイズできる
カードの幅・比率・間隔・角丸・影の有無・フォントサイズ・テキストカラーなど、見た目に関するあらゆる項目をテーマエディタからノーコードで細かく調整できます。ブランドのデザインやストアの世界観に合わせた、こだわりのカルーセルを簡単に作り込めます。
1 クリックでテーマに追加できる
アプリの管理画面から追加したいテーマを選び、「テーマに追加」ボタンを押すだけで、すぐにカードカルーセルがテーマに反映されます。難しい設定は一切不要なので、はじめての方でも安心してご利用いただけます。
アプリのインストール
アプリのインストールは、以下のアプリストアページから行えます。
👉 シンプルカードカルーセル｜お手軽テキスト付き画像スライダー｜Shopify App Store
インストール手順
-
Shopify 管理画面の左下にある「設定」をクリックします。
-
「アプリ」をクリックし、「Shopify App Store」へ移動します。
-
検索窓に「シンプルカードカルーセル｜お手軽テキスト付き画像スライダー」と入力し、表示されたアプリをクリックします。
-
アプリ詳細画面で「インストール」をクリックします。
-
権限の確認画面が表示されるので、内容を確認し「インストール」を完了します。
アプリブロックをテーマに追加
インストールが完了したら、テーマにカードカルーセルのアプリブロックを追加していきましょう。追加方法は 2 通りあります。
自動でテーマに追加（1 クリック追加）
アプリの管理画面から、ワンクリックでカードカルーセルを既定の位置に追加できる方法です。
-
アプリの管理画面を開きます。
-
「テーマを選択」で追加したいテーマを選び、「テーマに追加」をクリックします。
-
テーマエディタが開いたら、表示位置や設定を確認して「保存する」をクリックします。
手動でテーマに追加（任意ページに設置したい場合）
任意のページや位置にカードカルーセルを設置したい場合は、テーマエディタから手動で追加するのがおすすめです。
-
Shopify 管理画面で「オンラインストア」→「テーマを編集する」を開きます。
-
テーマエディタ上部のプルダウンから、追加したいページに移動します。
-
「セクションを追加」または「ブロックを追加」をクリックし、「アプリ」タブから「シンプルカードカルーセル｜お手軽テキスト付き画像スライダー」のアプリブロックを選んで追加します。
-
表示を確認し、問題なければ「保存する」をクリックします。
アプリの設定項目
カードカルーセルブロックは、見た目や挙動をテーマエディタから自由にカスタマイズできます。設定項目は以下のグループに分かれています。
見出し設定
カルーセルの最上部に表示される、セクションタイトルに関する設定です。「Featured」「新着商品」「ピックアップ」など、カルーセルの内容を一目で伝えるテキストを設定する場面で使用します。見出しテキストの内容、フォントサイズ（16〜48px）、文字色、配置（左揃え／中央揃え）、上下の余白を細かく調整できます。空欄にすると見出し自体が非表示になるため、シンプルにカードだけを並べたいときも対応できます。
自動再生設定
カードカルーセルを自動で動かすかどうか、また端まで進んだときに先頭へ戻すかどうかを設定するグループです。「自動再生を有効にする」をチェックすると、ページ表示時にカードが自動で 1 枚ずつスライドします。再生間隔は 3〜10 秒の範囲で調整可能。「無限スクロールを有効にする」をチェックすれば、最後のカードまで進んだあと先頭のカードへループします。トップページのヒーローエリアで複数のキャンペーンを順番にアピールしたい場合に効果的です。
カードスタイル設定
カードカルーセル全体の見た目（カードのサイズ・形・余白・文字サイズなど）を整える設定グループです。
- カードの横幅：200〜500px の範囲で 10px 刻みに設定
- カードの比率：4:5 / 3:4 / 1:1 / 3:2 / 16:9 から選択
- カードの角丸：0〜30px の範囲で 1px 刻み
- カードの間隔：0〜40px の範囲で 2px 刻み
- カードの影：チェックボックスで ON/OFF
- サブタイトル文字サイズ：8〜20px
- メイン見出し文字サイズ：14〜48px
- 補足テキスト文字サイズ：10〜24px
ブランドのデザインや表示するコンテンツの量に合わせて、細部まで作り込めます。
カード 1〜6 の個別設定
カルーセルに表示されるカード（最大 6 枚）の中身を 1 枚ごとに設定するグループです。「カード 1〜3」「カード 4〜6」の 2 つのヘッダーに分かれています。1 枚あたり以下の項目を設定できます。
- 画像 — カードに表示する画像をアップロード
- 画像レイアウト — 「標準（画像全面）」「カードの下半分」「カードの上半分」から選択
- サブタイトル＋色 — 「NEW」「期間限定」などの小さなラベル
- メイン見出し＋色 — 商品名やキャッチコピー
- 補足テキスト＋色 — リッチテキスト対応の説明文
- リンク URL — 商品ページや特集ページへの遷移先
💡 ワンポイント：画像と「メイン見出し」のいずれかが入力されているカードのみ表示されます。表示したくないカードは画像と見出しを空欄のままにしておくと、自動的にカルーセルから除外されます。
追加設定（カスタム CSS）
標準の設定では実現できない細かなデザイン調整を行いたい場合に使用するグループです。CSS の知識がある方は、フォントの変更、特定の要素の色調整、レスポンシブ時の細かな表示調整など、より高度なカスタマイズを行えます。
おわりに
「シンプルカードカルーセル｜お手軽テキスト付き画像スライダー」は、ストアの魅力を最大限に引き出すためのカードカルーセルアプリです。Apple Store 風のスタイリッシュなデザイン、3 種類の画像レイアウト、自動再生・無限スクロール、細かなカスタマイズ性など、Shopify ストアに「テキスト付き画像のカードカルーセル」を導入したいすべての方におすすめできます。
料金は Basic Plan 月額 $4.99（7 日間の無料体験あり、年払いで実質 2 ヶ月分無料）。まずは無料体験から始めて、ストアにマッチするかをじっくり試してみてください。
👉 シンプルカードカルーセル｜お手軽テキスト付き画像スライダー｜Shopify App Store
シンプル複数画像スライドショー｜お手軽イメージカルーセル
アプリ概要
| 項目 | 内容 |
|---|---|
| アプリ名 | シンプル複数画像スライドショー｜お手軽イメージカルーセル |
| 開発者 | UnReact Inc. |
| 価格設定 | Basic Plan $4.99/月（年払い $49.99 で 17% お得）、7 日間の無料体験あり |
| 主な機能・特徴 | 見切れ表示つきの画像スライダー、リンク設定、2 種類のデザイン、PC で複数画像を横並び表示、ノーコードでカスタマイズ |
| 対応言語 | 日本語、英語、ドイツ語、スペイン語、フランス語、イタリア語、中国語（簡体字／繁体字）、韓国語など 21 言語 |
| 評価 | ☆☆☆☆☆（0 レビュー） |
ワンポイント解説
「シンプル複数画像スライドショー｜お手軽イメージカルーセル」は、UnReact Inc. が開発する 見切れ表示つきの画像スライダー を実現できるアプリです。次の画像が少し見えることで「続きが気になる」視覚効果が生まれ、スクロールを促しながら特集ページへ誘導できます。各スライドにリンクを設定できるため、新作・セール・コレクションなどへの導線をスムーズに作れます。2 種類のデザインから選べ、PC では複数画像を横並びに表示するため、視認性と訴求力を両立できる点が特徴です。本記事のメインアプリと同じ UnReact 製で、テキスト付きカードカルーセルではなく「画像メインで見切れ表示を活かしたい」場合の有力な選択肢になります。
Hero Slider
アプリ概要
| 項目 | 内容 |
|---|---|
| アプリ名 | Hero Slider |
| 開発者 | neno |
| 価格設定 | Standard $6.50/月、14 日間の無料体験あり |
| 主な機能・特徴 | ヘッダー直下に設置できるヒーロースライダー、PC・スマホで別々の画像、テキスト＋CTA ボタン、アニメーションプリセット |
| 対応言語 | 英語（このアプリは日本語に翻訳されていません） |
| 評価 | ★★★★★（3 件） |
ワンポイント解説
「Hero Slider」は、ヘッダーの直下に配置できるヒーロースライダー型のアプリです。カードカルーセルというよりは大きめのバナーをスライドさせるタイプですが、各スライドに画像・テキスト・CTA ボタンを設定できる点で「テキスト付き画像」の訴求力は十分備わっています。PC・スマホでそれぞれ異なる画像を設定できるため、デバイスごとの最適化も可能です。アニメーションプリセットを使えば、エモーショナルな演出も簡単に作れます。本記事の文脈では、横スクロールのカードカルーセルではなく、フルワイドのヒーロー領域でテキスト付き画像をスライドさせたい場合の選択肢となります。
Auto Slider Pro
アプリ概要
| 項目 | 内容 |
|---|---|
| アプリ名 | Auto Slider Pro |
| 開発者 | No Plans Studio LLC |
| 価格設定 | Subscription $7/月、7 日間の無料体験あり |
| 主な機能・特徴 | 商品・コレクション・テキストマーキー対応の自動スライダー、サイズ・速度・余白・角丸の調整 |
| 対応言語 | 英語（このアプリは日本語に翻訳されていません） |
| 評価 | ☆☆☆☆☆（0 レビュー） |
ワンポイント解説
「Auto Slider Pro」は、商品・コレクション・テキストマーキーを エンドレスに動くカルーセル として表示できるアプリです。Shopify 標準のテーマエディタから商品やコレクションを選ぶだけで、ページ全体に動きのある演出を加えられます。サイズ・速度・余白・角丸など主要なカスタマイズ項目が揃っており、ブランドの世界観に合わせた調整もしやすいです。テキスト付き画像のカードカルーセルというよりは、自動的に流れ続けるマーキー演出を加えたい場合に向いており、本記事のメインアプリと組み合わせて、ストアの上下で異なる動きを見せる構成も可能です。
Carousify: Banner Image Slider
アプリ概要
| 項目 | 内容 |
|---|---|
| アプリ名 | Carousify: Banner Image Slider |
| 開発者 | SolverCircle |
| 価格設定 | FREE プラン（無料）／ Premium $9.99/月、3 日間の無料体験あり |
| 主な機能・特徴 | 商品・コレクションページ専用のバナースライドショー、リダイレクトリンク設定、ノーコード |
| 対応言語 | 英語（このアプリは日本語に翻訳されていません） |
| 評価 | ★★★★★（4 件） |
ワンポイント解説
「Carousify: Banner Image Slider」は、商品ページ・コレクションページ専用のバナースライドショー を作れるアプリです。トップページではなく、商品詳細やコレクションの上部にキャンペーンバナーを差し込みたいときに便利です。各バナーにリダイレクトリンクを設定できるため、特集ページや関連商品への導線として機能します。無料プランも用意されているため、まずは試してみたい方にも導入しやすいのが魅力です。本記事のメインアプリ（テキスト付き画像のカードカルーセル）と組み合わせると、トップページではカードカルーセル、商品ページでは Carousify のバナースライドショー、というように使い分けが可能になります。
まとめ
ここまで、Shopify ストアにテキスト付き画像のカードカルーセルを設置できるアプリを 5 個ご紹介しました。
「カードカルーセル」と一口にいっても、
- 横スクロールでテキスト付きカードを並べたい → シンプルカードカルーセル｜お手軽テキスト付き画像スライダー
- 見切れ表示つきの画像スライダーで続きが気になる演出をしたい → シンプル複数画像スライドショー｜お手軽イメージカルーセル
- ヘッダー直下にフルワイドのヒーロースライダーを置きたい → Hero Slider
- 商品・コレクションをエンドレスに動かして見せたい → Auto Slider Pro
- 商品ページ・コレクションページ専用のバナーが欲しい → Carousify: Banner Image Slider
というように、目的によって最適なアプリが変わります。
その中でも、Apple Store 風のおしゃれなカードカルーセルで、テキスト付き画像をリンク付きで並べたい場合に最もおすすめなのは、1 つ目にご紹介した 「シンプルカードカルーセル｜お手軽テキスト付き画像スライダー」 です。最大 6 枚のカード、3 種類の画像レイアウト、自動再生・無限スクロール、細かなカスタマイズ性、月額 $4.99 という導入しやすい価格、7 日間の無料体験など、はじめての方でも安心して試せる要素が揃っています。
カード・カルーセル・テキスト付き画像という UI を Shopify ストアに導入したい方は、ぜひ「シンプルカードカルーセル｜お手軽テキスト付き画像スライダー」から検討してみてください。
👉 シンプルカードカルーセル｜お手軽テキスト付き画像スライダー｜Shopify App Store