フォトパック(Photo Pack)|商品画像を美しく見せるBASE有料テンプレート

商品が映える、おしゃれに作れるデザインテーマ

商品写真の見せ方にこだわりたい方のためのBASEデザインテーマです
画像の形を縦長・正方形・横長の3種類から選べるので、商品の特性に合わせた最適な表示ができます。ヘッダーバーやボタンの色もカスタマイズ可能。ビジュアルでの訴求を重視するアパレル・小物・フードなどのショップにおすすめです。

「商品を見せて売る」——写真の力でブランドの世界観を伝えたい方に向けたテーマです。おしゃれでスタイリッシュな雰囲気を、写真の見せ方から作り上げます。

フォトパックを使用したデモショップ

https://photopack.base.ec/

フォトパックの特徴

フォトパックは、商品写真の魅力を最大限に引き出すことに特化したBASEデザインテーマです。

最大の特徴は、商品画像の形を「縦長(横3:縦4)」「正方形」「横長(横3:縦2)」の3種類から選べることです。アパレルのように全身を見せたい商品は縦長に、アクセサリーのように形をきれいに見せたい商品は正方形に、料理やインテリアのように雰囲気を伝えたい商品は横長に。商品の特性に合った形で表示できるので、写真の魅力がそのまま伝わります。
シンプルでミニマルな雰囲気にも、ナチュラルで温かみのある雰囲気にも、上品でモダンな雰囲気にも。背景色とヘッダーバー、ボタンの色の組み合わせ次第で、狙ったテイストに仕上げられます。

ヘッダーバーの色、ボタンの色、文字リンクの色もそれぞれ自由に変更でき、ブランドのイメージカラーに合わせた統一感のあるショップを作ることができます。背景色との組み合わせ次第で、白背景の明るいショップにも、黒背景のシックなショップにも対応できます。

トップページにはスライド画像に見出しと文章を重ねて表示する機能があり、写真の上に商品名やキャッチコピーを載せることができます。ピックアップ機能では4つのエリアを使ってビジュアルストーリーを構成でき、おすすめ商品は最大10個まで掲載可能。写真でショップの世界観を伝えたい方のために設計されたテーマです。

他のテーマとフォトパックの違い

スターターパックは「はじめてのネットショップに必要な機能を厳選」、ベーシックパックは「本格的な運営に必要なパーツを豊富に搭載」したテーマです。フォトパックは「写真を美しくおしゃれに見せること」に特化しています。

フォトパックだけの機能は、商品画像の形を縦長・正方形・横長の3種類から選べること、ヘッダーバーの色を変更できること、ピックアップを4エリア(1・2A・2B・3)に分けてビジュアルストーリーを構成できること、おすすめ商品を最大10個まで登録できることです。スライド画像に見出しと文章を重ねる表示や、ボタン・文字リンクの色変更にも対応しています。

商品写真のクオリティに自信がある方、ブランドの世界観を写真で伝えたい方、商品の形状に合わせて画像の表示を最適化したい方は、フォトパックが最もフィットするテーマです。

おすすめのショップ

アパレル・小物・フードなど、さまざまなジャンルで利用いただけます。

BASEの基本機能である背景色の変更と、【フォトパック ( Photo Pack )】のヘッダーバー・ボタンカラーの組み合わせで、いろいろなイメージになります。

基本のスタイル

白背景の場合:トップーページの表示サンプル
白背景の場合:商品詳細ページの表示サンプル

変更例

黒背景の場合の表示サンプル
ベージュ背景の場合の表示サンプル
ボタンが赤の場合の表示サンプル

機能紹介

ショップのイメージに合わせて変更

「背景色」「ヘッダーバーの色」「ボタンの色」などを変更することができます。変更可能な箇所について詳しくは「設定方法」をご確認ください。

背景色を変更する

BASEの基本機能で背景色を好きな色に変更することができます

ボタンの色を変更する

ボタンの色を好きな色に変更することができます

ヘッダーバーの色を変更する

ヘッダーバーの色を変更することができます

商品画像の形は縦長・正方形・横長の3種類

トップページや一覧ページで表示される商品画像の形は、「縦長(横3縦4)」「正方形」「横長(横3縦2)」の3種類からお選びください。

「縦長(横3縦4)」「正方形」「横長(横3縦2)」の3種類から選択できます

トップページの機能

トップページに表示される内容の一覧

POINT1 タイトルを変更して好きなコンテンツを掲載

「ショップについて」「ピックアップ」「おすすめ」項目は、タイトルを自分で設定することができます。

例:「おすすめ」のタイトルをSTYLINGにしてコーディネート例に

「おすすめ」のタイトルをSTYLINGにした場合の表示例

POINT2 必要なものだけ表示

各項目は表示ONOFFが可能です。ショップに必要なものだけ表示することができます。

一部の表示をOFF

ABOUTページの機能

ABOUTページに画像、テキスト、地図を追加できます

設定方法

設定箇所

テーマ設定ボタンを押して設定してください

テーマの設定は、上部バーの「デザイン」を押した後に表示される画面で、「テーマ設定」を押すと、各設定項目が表示されます。

ロゴ・背景色を変更する場合

「テーマ設定」ではなく、それぞれ「ロゴ」「背景」で変更します。

ロゴ・背景ボタンを押して設定してください

文字を白にする※濃い背景色用

濃い背景色に対応する為、文字などを白くするできます

文字を白にする※濃い背景色用
【ON】黒などの濃い色の背景色の時に、見え難くなる文字を白くするなど、濃い背景色に対応した配色に全体を変更します

文字リンク色

文字リンク色を変更できます

※「デモショップ」の青色の文字リンク部分です

文字リンク色
【色選択】商品一覧の商品名、ブログ一覧の記事タイトルなど、一部のリンクの文字カラーを変更します

ボタンの色の変更

ボタンの色を変更できます

※「デモショップ」の紫色のボタン部分です

ボタン背景色
【色選択】ボタンの色を変更します
ボタン文字色
【色選択】ボタン内の文字・マークの色を変更します

ボタンの色の変更例

ボタンの色を変更した場合の表示例

ヘッダーバーの色の変更

ヘッダーバーの色を変更できます

ヘッダーバー背景色
【色選択】ヘッダーバーの色を変更します
ヘッダーバーのアイコンを白にする
BASEロゴ・カートアイコンを白にします。ヘッダーバーを濃い色にして見え難くなった場合にご利用ください

ヘッダーバーの色の変更例

ヘッダーバーの色を変更した場合の表示例

商品画像の形

商品画像の形を変更できます

商品画像の形
トップページ(おすすめ/商品一覧)・一覧ページ・商品ページで表示される商品画像の形を「縦長(横3縦4)」「正方形」「横長(横3縦2)」の3種類から選択。
※トップページ(おすすめ/商品一覧)・一覧ページでは、選択した形に画像がトリミングされて表示されます

正方形の表示例

商品画像の形で正方形を選択した場合の表示例

横長(横3縦2)の表示例

商品画像の形で横長(横3縦2)を選択した場合の表示例

トップページ

スライド(1~3個)表示OFF可能

スライドを変更できます

スライド表示
表示/非表示を切り替え
スライドサイズ
全画面/比率固定(スマホ2対3、PC2対1)を切り替えられます
スライド
スマートフォン用画像必須
【全画面】やや縦長~正方形推奨
【比率固定】横2:縦3
スライド
パソコン用画像必須
【全画面】横長推奨
【比率固定】横2:縦1
スライド 見出し
~20文字くらい推奨
スライド 文章
~30文字くらい推奨
スライド
リンク
画像にリンクを入れたい場合はここに、「https://photopack.base.ec/」のような「https://」で始まるURLを入れてください。空欄にするとリンクなしになります。

※画像1枚のみ設定すると、スライドせず、静止画像になります

※登録可能な個数の上限は3個です。

スライドサイズ【全画面】

スライドサイズで全画面を選択した場合の表示例

画面いっぱいに表示するために、画像の一部を切り取ります。表示させたい対象物がなるべく中央になるように写真をトリミングすると綺麗に表示することができます。

※スライド1にのみ画像を入れた場合、スライドなしの静止画像になります。

スライドサイズ【比率固定】

スライドサイズで比率固定を選択した場合の表示例

スマホ 横2:縦3、PC 横2:縦1の比率の画像をご用意ください。

※スライド1にのみ画像を入れた場合、スライドなしの静止画像になります。

ショップについて 表示OFF可能

ショップについてを変更できます

ショップについて表示
表示/非表示を切り替え
ショップについて
タイトル
タイトルを「ABOUT US」から変更できます
ショップについて
見出し
大きな文字です。見出しなどを入れてください。
ショップについて
文章必須
長めの文章を入れることができます。空欄OK。
ショップについて
リンク
リンクを入れたい場合はここに、「https://photopack.base.ec/」のような「https://」で始まるURLを入れてください。空欄にするとボタンが非表示になります。

※登録可能な個数の上限は1個です。

ピックアップ表示OFF可能

ピックアップを変更できます

ピックアップ表示
表示/非表示を切り替え
ピックアップ
画像必須
ピックアップ1・ピックアップ3:スマートフォン用画像…正方形推奨、パソコン用画像…横長推奨
ピックアップ2A・ピックアップ2B:正方形推奨
ピックアップ
見出し必須
大きな文字です。見出しなどを入れてください。
ピックアップ
文章
長めの文章を入れることができます。空欄OK。
ピックアップ
リンク
画像にリンクを入れたい場合はここに、「https://photopack.base.ec/」のような「https://」で始まるURLを入れてください。空欄にするとリンクなしになります。

※登録可能な個数の上限はピックアップ1・2A・2B・3それぞれ1個です。

おすすめ(3~10個)表示OFF可能

おすすめを変更できます

おすすめ表示
表示/非表示を切り替え
おすすめ
タイトル
タイトルを「RECOMMEND ITEM」から変更できます
おすすめ
画像必須
「商品画像の形」で選択した形を同じ比率で表示されます。
おすすめ
文章
文章を入れることができます。空欄OK。
おすすめ
リンク
画像にリンクを入れたい場合はここに、「https://photopack.base.ec/」のような「https://」で始まるURLを入れてください。空欄にするとリンクなしになります。

※登録可能な個数の上限は10個です。

INFORMATION(1~3個)表示OFF可能

INFORMATIONを変更できます

INFORMATION表示
表示/非表示を切り替え
INFORMATION
日付必須
日付や短めのタイトルを入れてください
INFORMATION
文章必須
文章が入ります。
INFORMATION
リンク
リンクを入れたい場合はここに、「https://photopack.base.ec/」のような「https://」で始まるURLを入れてください。空欄にするとリンクなしになります。

※登録可能な個数の上限は3個です。

ブログ新着記事表示 表示OFF可能

ブログ新着記事表示
表示/非表示を切り替え
※固定記事、新着記事の順番で4記事を表示します

表示順の変更

表示順変更可能な箇所

表示順
1~8を選択。数字が小さいものが上に表示されます。同じ数字の場合、設定が上にあるものが上に並びます

商品一覧の追加ロードをボタンクリックにする

商品一覧の追加ロードをボタンクリックにする設定のON/OFF比較

商品一覧の追加ロードをボタンクリックにする
商品一覧の24商品以上の商品の表示を
OFF:画面一番下に来た時に自動で表示します
ON :「VIEW MORE」ボタンを押すと表示します

ABOUTページ

ABOUTページに画像・テキスト・地図を追加できます

ABOUTページ 画像表示
表示/非表示を切り替え
ABOUTページ 画像
横長推奨
ABOUTページ フリーエリア
ABOUTページに表示される「ショップの説明」の下に文章を入れられます。空欄にすると非表示になります。
ABOUTページ Googleマップ共有地図を埋め込む
GoogleMapは共有地図の埋め込みタグの< iframe>~</iframe>を入れます。この欄では、地図のスマホでの表示を調整してあります。空欄にすると非表示になります。

※登録可能な個数の上限は1個です。

商品ページ

商品ページ 画像一覧の表示

商品ページ 画像一覧を全表示にする【OFF】

商品ページの画像一覧を全表示にする設定OFFの表示例

オフの場合、商品画像・画像一覧のサムネイルともにスライド形式で表示します。

商品ページ 画像一覧を全表示にする【ON】

商品ページの画像一覧を全表示にする設定ONの表示例

オンの場合、

商品画像をスライド形式、画像一覧のサムネイルをすべて表示します。

FAQ

商品写真を大きく見せたいのですが、フォトパックは向いていますか?

はい。商品の特性に合わせて画像の形(縦長・正方形・横長)を選べるので、写真を大きく、印象的に見せたい方に向いています。

スタイリッシュな、おしゃれなショップを作りたいのですが対応できますか?

はい。ヘッダーバー・ボタン・文字リンクの色を自由に組み合わせられるので、シンプルでスタイリッシュな雰囲気にも、華やかでおしゃれな雰囲気にも仕上げられます。

ブランドの世界観を伝えるショップを作りたいのですが、フォトパックで実現できますか?

はい。写真を中心にレイアウトを組み立てられるため、ブランドの世界観や商品のストーリーを伝えるショップづくりに向いています。

アパレルや雑貨など、写真映えする商品におすすめですか?

はい。アパレル・小物・フードなど、ビジュアルでの訴求を重視するジャンルに特に向いています。商品の魅力を写真でしっかり伝えたい方におすすめです。

シンプルでかわいい雰囲気にしたいのですが、実現できますか?

背景色や配色を自由に組み合わせられるので、シンプルでかわいい雰囲気にも、ナチュラルで優しい雰囲気にも仕上げられます。

高級感のあるショップにするには、どうすればいいですか?

落ち着いた配色と、商品写真を大きく見せるレイアウトを組み合わせることで、上品で高級感のある印象に仕上がります。

インスタ映えするようなデザインは作れますか?

写真を大きく、印象的に見せるレイアウトなので、写真の魅力をそのまま活かした、映える見た目に仕上げやすいテーマです。

トップページに表示させる商品やカテゴリーの選択方法は?

トップページに表示される「スライド」「ショップについて」「ピックアップ」「おすすめ」「INFORMATION」は、ショップに登録している商品やカテゴリーと連動していません。トップページに表示したい画像・文章を作成し、リンクにURLを入力してください。

「リンク」に何を入れる?

「リンク」には、リンクさせたいページを、実際に表示されるショップで表示して、URLをコピー&ペーストしてください。

リンクをコピーペーストする画面の例

購入前にテーマ設定を確認したい

テーマの説明ページの「購入する」ボタンの上にある「プレビュー」を押した後、「テーマ設定」を押すことで確認できます。

〇〇が表示されない

「必須」と記載されている箇所を設定してください。特に画像が必要なものの大部分は、画像を設定しなければ表示しないように設定されています。

スライドが表示されない

スマートフォン用画像を設定してください。パソコン用画像のみ設定では表示しません。

INFORMATIONが表示されない

【1】テーマ設定で、「ON」に変更したあと、「保存」ボタンを押してください。保存しないと「ON」に変更されません。

【2】「INFORMATION1 文章」「INFORMATION2 文章」「INFORMATION3 文章」の欄に何も入っていない場合、それぞれの行が表示されないようになっています。表示させたい行の「文章」に入力をお願いします。

在庫を表示したい

在庫がない場合以外の在庫表示(「残り〇個」「残りわずか」など)は対応しておりません。

商品画像の形はどれを選べばいい?

商品の特性に合わせて選ぶのがおすすめです。アパレルなど全身やシルエットを見せたい商品は「縦長(横3:縦4)」、アクセサリーや小物など形をきれいに見せたい商品は「正方形」、料理やインテリアなど空間の雰囲気を伝えたい商品は「横長(横3:縦2)」が向いています。テーマ設定でいつでも変更できるので、実際に表示を見ながら最適な形を試してみてください。

商品画像の推奨サイズは?

商品画像の形に合わせた比率で用意するのがベストです。縦長なら横750×縦1000pixel程度、正方形なら横1000×縦1000pixel程度、横長なら横1000×縦667pixel程度が目安です。高解像度で用意すればRetinaディスプレイでもきれいに表示されます。

スターターパックやベーシックパックから乗り換えられる?

はい。BASEではテーマをいつでも変更できます。ただし、テーマ固有の設定(スライド画像やピックアップなど)はリセットされますので、フォトパックのテーマ設定を改めて行ってください。商品データやショップの基本情報はそのまま引き継がれます。

テーマ選びで、写真以外にチェックすべきことは?

画像の形やレイアウトの自由度など、実際に使う機能面も見ておくと安心です。フォトパックは、写真の美しさと機能の両方を備えています。

対応APP

  • 送料詳細設定
  • カテゴリ管理
  • デジタルコンテンツ販売
  • 英語・外貨対応
  • メールマガジン
  • 年齢制限
  • Blog
  • ラベル
  • BASEロゴ非表示
  • 商品検索
  • 定期便
  • レビュー
  • セール
  • メッセージ
  • 販売期間設定
  • 予約販売
  • 抽選販売
  • 商品説明カスタム
  • 商品オプション
  • コミュニティ
  • テイクアウト
  • 再入荷自動通知
  • お知らせバナー
  • メンバーシップ

※その他、テーマに影響されないApps(送料無料設定、HTML編集など)も利用可能です。詳しくは、BASEのテーマ紹介のページの【対応Apps(拡張機能)】 でご確認ください。

対応していないApps

  • ページ追加
  • 海外販売代行

※「オフィシャルテーマのみ利用可能」といった注意書きが記載されているAppsは利用できません。

上記Appsで「オフィシャルテーマのみ利用可能」と記載しているのを確認していますが、すべてのAppsの確認はできていません。必ずAppsの注意書きをご確認ください。

商品写真の魅力を最大限に活かすなら

フォトパックは、商品写真の見せ方にこだわりたい方のためのBASEデザインテーマです。縦長・正方形・横長の3つの画像形状と、自由なカラーカスタマイズで、ブランドの世界観に合ったショップを作ることができます。

まずはシンプルに始めたい方にはスターターパック、トップページのパーツを充実させたい方にはベーシックパック、しっかりとコンテンツを訴求していきたい方にはコンテンツパックもご用意しています。ショップの目的や成長段階に合わせてテーマを選んでください。

▶ ベーシックパックを購入する
▶ BASE無料テンプレートのHTML編集・カスタマイズと作り方
▶ BASE 商品一覧ページの作り方

更新情報

2025年12月:
・一部スタイルをCSSファイルに移動しました

2025年7月:
・「商品ページ 画像一覧を全表示にする」を追加しました
・商品ページで、「商品画像が0~1枚」かつ「商品画像の形で設定した比率より横長の写真」の場合、スマートフォンなどで画像下に生じる空白を修正しました
・「文字を白にする※濃い背景色用」で、特定商取引法に基づく表記ページの電話番号のマウスオーバーで「有効であることが確認された正しい電話番号です」の文字が読みづらくなる問題を修正しました

2025年3月:
・「ヘッダーバーのアイコンを白にする」でカートバッジが白くなってしまう問題を修正しました

2025年2月:
・「カートバッジ表示機能」に対応しました

2025年1月:
・「商品一覧の追加ロードをボタンクリックにする」のボタンのデザインを、他のボタンを同じデザインに修正しました
・Aboutページに「フリーエリア4」「フリーエリア5」を追加しました

2025年1月:
・「商品一覧の追加ロードをボタンクリックにする」のボタンのデザインを、他のボタンを同じデザインに修正しました
・Aboutページに「フリーエリア4」「フリーエリア5」を追加しました

2025年1月:
・テーマ設定の編集項目を、全体設定・HOME設定・ABOUT設定に区分けしました
・「商品一覧の追加ロードをボタンクリックにする」を追加しました
 トップページ・カテゴリーページ・検索で表示される商品一覧について、
 OFF:画面の一番下に来た時に自動でさらに商品が表示
 ON:「VIEW MORE」ボタンを押すとさらに商品が表示
・Aboutページに「フリーエリア」と「Googleマップ共有地図を埋め込む」を追加しました
・(検索Appオンの場合)ヘッダーとサイドバーの検索窓のデザインを修正しました

2024年11月:
・Pay ID あと払いウィジェットに対応しました

2024年7月:
・iOS16.2以下で表示が崩れる問題を修正しました

2024年4月:
テーマ公開