『 Vita 』オンラインマニュアル（テーマの設定方法）

BASEデザインテンプレート【Vita】

『Vita（ヴィータ）』は様々なカスタマイズを誰でも簡単に行うことができます。
BASE管理画面の「デザイン」の「テーマ設定」で各種機能の設定を行うことができます。

テーマ設定

はじめに

『Vita』に搭載されている主な機能を、デモショップのスクリーンショットに名称を示してご案内します。
設定したいテーマ機能の名称がわからない時にご覧ください。
（別ウィンドウで開きます）

トップページ
トップページ
アバウトページ
アバウトページ
商品ページ
商品ページ
カテゴリページ
カテゴリページ

また、ご参考用としてデモショップ1の設定内容をこちらからPDFにてご確認いただけます。


全体設定ショップ全体（全てのページ）で共通する設定項目です。

フォント / カラー

BASEショップのスクリーンショット

1-1【 フォント / カラー 】 フォントサイズ

ショップ全体のフォントサイズを『小（標準）』『中』『大』『極小』『極大』から選択することができます。
（一部のフォントサイズはテーマデザインで固定されているため変更できない部分があります。）
初期状態では『小（標準）』になっています。

明朝体フォント ON/OFF

フォントを『ゴシック体』と『明朝体』から選択することができます。
OFFの状態では『ゴシック体』、ONの状態では『明朝体』で表示されます。
初期状態ではOFF（ゴシック体）になっています。

メインエリア 背景色

メインエリアの背景色を変更することができます。
初期値は「 #ffffff 」になっています。

* ショップ全体の背景色について
デザイン画面の「背景」でショップ全体の背景色を設定することができます。
「メインエリア 背景色」と同じ色を設定することで統一感のある配色にすることができます。

メインエリア テキストカラー

商品説明等の通常のテキストの色を変更することができます。
（一部のテキスト色はテーマデザインで固定されているため変更できない部分があります。）
初期値は「 #333333 」になっています。

メインエリア サブテキストカラー

注釈等のサブテキストの色を変更することができます。
初期値は「 #999999 」になっています。

フッター 背景色

フッターの背景色を変更することができます。
初期値は「 #fafafa 」になっています。

フッター テキストカラー

フッターのテキストカラーを変更することができます。
初期値は「 #333333 」になっています。

リンクカラー

リンクテキスト色を変更することができます。
初期値は「 #01579b 」になっています。

ボタン 背景色

ボタンの背景色を変更することができます。
初期値は「 #ffffff 」になっています。

ボタン 枠線カラー

ボタンの枠線の色を変更することができます。
初期値は「 #dddddd 」になっています。

ボタン テキストカラー

ボタンのテキストの色を変更することができます。
初期値は「 #333333 」になっています。

購入ボタン カラー

商品ページの「カートに入れる」ボタンの色を変更することができます。
初期値は「 #1E90FF 」になっています。

セール価格 / SOLD OUT カラー

セール価格やSOLD OUTの色を変更することができます。
初期値は「 #E50F0D 」になっています。

ワンポイントアイコン

デザインのアクセントとしてワンポイントアイコンを表示することができます。
画像をアップロードしてオリジナルのアイコンを表示することも可能です。
BASEショップのスクリーンショット

1-2【 ワンポイントアイコン 】ON/OFF

ワンポイントアイコンの表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

アイコンカラー

ワンポイントアイコンの色を設定することができます。
初期値は「 #DA0F0F 」になっています。

アイコンタイプ

         
お好みのアイコンタイプを選択してください。

ワンポイントアイコン オリジナル画像

画像をアップロードすることで、オリジナルのワンポイントアイコンを表示することができます。

アイテム設定

商品一覧や商品（アイテム）の表示に関する設定を行うことができます。

1-3【 アイテム設定 】トップページに商品一覧を表示 ON/OFF

ONにするとトップページに商品一覧が表示されます。
OFFにするとトップページの商品一覧は非表示になります。
初期状態ではONになっています。
BASEショップのスクリーンショット

商品に1行の「商品説明」を表示 ON/OFF

ONにすると商品画像の下に1行の「商品説明」が表示されます。
初期状態ではONになっています。
BASEショップのスクリーンショット

商品一覧の画像を正方形に切り抜く ON/OFF

トップページやカテゴリページの商品一覧の商品画像を正方形に切り抜いて表示することができます。
ONにすると画像サイズが商品ごとに異なる場合でも統一感のある商品一覧にすることができます。
商品一覧の各商品画像の元の縦横比率を維持したい場合にはOFFにしてご利用ください。
初期状態ではOFFになっています。

商品ページの商品画像を正方形にする場合には、「4-1【 商品ページ 】商品ページの商品画像を正方形に切り抜く」にて設定を行ってください。

商品一覧（PC）を横に4～6アイテム表示 ON/OFF

OFFの場合、PC閲覧時の商品一覧が画面サイズに応じて「横に3～4アイテム」で表示されます。
ONの場合、PC閲覧時の商品一覧が画面サイズに応じて「横に4～6アイテム」で表示されます。
初期状態ではOFF（横に3～4アイテム）になっています。

商品一覧（スマホ）を横に3アイテム表示 ON/OFF

OFFの場合、スマホ閲覧時の商品一覧が横に2アイテムになります。
ONの場合、スマホ閲覧時の商品一覧が横に3アイテムになります。
初期状態ではOFF（横に2アイテム）になっています。

在庫表示（残りわずか）

指定した在庫数を下回った場合、トップページと商品ページの商品に在庫僅少のラベルを表示することができます。
「残りわずか」のように在庫が少ないことを示唆するだけでなく、
「残り {x} 点」のように設定することで、具体的な在庫数を表示することもできます。

1-4【 在庫表示 】「残りわずか」を表示 ON/OFF

ONにすると指定した在庫数を下回った商品に在庫僅少ラベルを表示することができます。 初期状態ではOFFになっています。

「残りわずか」と表示される在庫数

ここで設定した数よりも商品の在庫が少ない場合に「残りわずか」が表示されます。
1以上の整数を設定してください。
初期値は「 5 」になっています。

「残りわずか」の表記テキスト

「残りわずか」表示の表記テキストを設定することができます。
{x} というテキストを入れると、自動的にその商品の在庫数に置き換わります。
残り {x} 個
具体的な在庫数を表示したくない場合には「 残りわずか 」のようなテキストを設定してください。 
残りわずか

初期値は「 残り {x} 個 」になっています。

お気に入り機能

ユーザーが商品を「お気に入り」に登録することができます。
お気に入りアイテムはその端末のみで最大24件保存されます。
上部メニューのをクリックすることでお気に入りリストが表示されます。
トップページ下部にリストを表示することも可能です。

ヘッダーのアイコンからお気に入りリストを表示
お気に入りリスト

商品ページでお気に入り登録可能
お気に入りリスト

1-5【 お気に入り機能 】ON/OFF

ONにするとユーザーが「お気に入り」を登録したり表示することができます。
初期状態ではONになっています。

タイトル

お気に入りのタイトルを変更することができます。 初期値は「 お気に入り 」になっています。

商品一覧にハートボタンを表示 ON/OFF

ONにすると、商品ページだけでなく、トップページの商品一覧の各アイテムにもお気に入り登録ボタンが表示されます。
OFFにすると、商品ページだけにお気に入り登録ボタンが表示されます。
商品一覧をすっきりと見せたい場合にはOFFにしてご利用ください。
初期状態ではONになっています。
（ON/OFFどちらの場合も、お気に入りリストを開くための上部メニューののアイコンはすべてのページで表示されます。）

トップページ下部にお気に入りリストを表示 ON/OFF

ONにすると、トップページ下部にお気に入りリストを表示することができます。
初期状態ではOFFになっています。

未登録 ハート色

お気に入り未登録時のハートの色を変更することができます。
初期値は「 #c0c0c0 」になっています。

登録済 ハート色

お気に入り登録済時のハートの色を変更することができます。
初期値は「 #d32f2f 」になっています。

メニュー設定

BASEショップのスクリーンショット

1-6【 メニュー設定 】Homeのタイトル

ナビゲーションのHomeへのリンクテキストを変更することができます。
初期値は「 HOME」になっています。

Categoryのタイトル（カテゴリ管理 Apps）

カテゴリのタイトルを変更することができます。
初期値は「 CATEGORY」になっています。

Informationのタイトル

インフォメーションのタイトルを変更することができます。
初期値は「 SHOP INFO 」になっています。

Linkのタイトル

外部リンクのタイトルを変更することができます。
初期値は「 LINK 」になっています。

Aboutのタイトル

ナビゲーションのAboutへのリンクテキストを変更することができます。
初期値は「 ABOUT 」になっています。

Blogのタイトル

ナビゲーションのBlogへのリンクテキストを変更することができます。
初期値は「 BLOG 」になっています。

Contactのタイトル

ナビゲーションのContactへのリンクテキストを変更することができます。
初期値は「 CONTACT 」になっています。

トップページ商品一覧のタイトル

商品一覧のタイトルを変更することができます。
初期値は「 NEW ARRIVAL 」になっています。

関連商品のタイトル

関連商品のタイトルを変更することができます。
初期値は「 関連商品 」になっています。

外部リンク 1 テキスト

外部リンク1のタイトルを設定することができます。

URL

外部リンク1のURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

外部リンク 2 テキスト

外部リンク2のタイトルを設定することができます。

URL

外部リンク2のURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

外部リンク 3 テキスト

外部リンク3のタイトルを設定することができます。

URL

外部リンク3のURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

メニューのツールチップ（PC）

PC閲覧時の上部メニューアイコン（≡）にマウスを乗せた際のツールチップ（吹き出し）のテキストを設定することができます。
ツールチップのタイトルは14文字以内で設定してください。
初期値は「 メニュー 」になっています。

ショッピングカートのツールチップ（PC）

PC閲覧時の上部メニューのカートアイコンにマウスを乗せた際のツールチップ（吹き出し）のテキストを設定することができます。
ツールチップのタイトルは14文字以内で設定してください。
初期値は「 お買い物かご 」になっています。

検索のツールチップ（PC）

PC閲覧時の上部メニューの検索アイコンにマウスを乗せた際のツールチップ（吹き出し）のテキストを設定することができます。
ツールチップのタイトルは14文字以内で設定してください。
初期値は「 商品検索 」になっています。

検索ボックスのプレースホルダー

検索ボックスに薄く表示されている初期テキストの内容を「Search」や「アイテム検索」などに変更することができます。
初期値は「 何をお探しですか？ 」になっています。

トップページ商品一覧のタイトル

トップページの商品一覧タイトルを変更することができます。
初期値は「 NEW ARRIVAL 」になっています。

商品一覧の「More」ボタンのタイトル

トップページの商品一覧の追加読み込みボタンのテキストを変更することができます。
初期値は「 MORE 」になっています。

PCヘッダーにSNSアイコンを表示 ON/OFF

ONにすると、PC閲覧時のヘッダーにSNSアイコンを表示することができます。
OFFにすると、SNSアイコンはフッターのみに表示されます。
初期状態ではONになっています。
ヘッダーに表示されるSNSアイコンが多いと2段になってしまうため、
アイコンの数が多い場合にはOFF（SNSアイコンをフッターのみに表示）にしてご利用ください。

追加PCヘッダーメニュー

PC閲覧時のヘッダーに「追加PCヘッダーメニュー」を3つまで表示することができます。
スマホ閲覧時には表示されないため、補助的な目的にご利用ください。

1-7【追加PCヘッダーメニュー】1 テキスト

追加PCメニュー 1 のタイトルを設定することができます。
タイトルが長く複数行になるとレイアウトが崩れる場合がありますので、1行に収まる短いメニュー名を設定してください。

URL

追加PCヘッダーメニュー 1 のURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

「追加PCヘッダーメニュー 2」～「追加PCヘッダーメニュー 3」も同様の設定方法となっています。

メインメニュー

ショップ上部に自由なリンク先のメニューを最大6項目まで表示することができます。
PCでは画面サイズに応じて自動的にサイズが調整され、スマホでは横にスクロールすることができます。
BASEショップのスクリーンショット
BASEショップのスクリーンショット

1-8【 メインメニュー 】ON/OFF

メインメニューの表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

メインメニュー 1 テキスト

メインメニュー 1 のタイトルを設定することができます。

URL

メインメニュー 1 のURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

「メインメニュー 2」～「メインメニュー 6」も同様の設定方法となっています。

無限スクロールバナー

1枚のバナーを自動的に横方向に複製した無限スクロールバナーを表示することができます。
トップページだけでなく、すべてのページに表示することも可能です。
BASEショップのスクリーンショット
BASEショップのスクリーンショット

1-9【 無限スクロールバナー 】 ON/OFF

無限スクロールバナーの表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

バナー画像

無限スクロールバナーの画像をアップロードする事ができます。

URL

無限スクロールバナー のURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

トップページ以外にも表示 ON/OFF

ONにすると無限スクロールバナーが全てのページに表示されます。
OFFの場合はトップページのみに表示されます。
初期状態ではOFF（トップページのみに表示）になっています。

【画像の推奨サイズ】

『無限スクロールバナー』の推奨サイズは「 縦100px 」です。横の長さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横800px / 縦120px 」の画像を使用しています。

送料表示

サイドバー/スライドメニュー/フッター/アバウトページに送料を表示することができます。
送料のテキスト内容やカラーを自由に設定することが可能です。

BASEショップのスクリーンショット

1-10【送料表示】 ON/OFF

送料表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

送料カラー

送料のテキストカラーを変更することができます。
初期値は「 #D50000」になっています。

条件テキスト

条件テキストを設定することができます。
例:「5,000円以上のご購入で」

送料テキスト

送料テキストを設定することができます。
例:「全国送料無料」

補足テキスト

補足テキストを設定することができます。
例:「＊沖縄・離島は除きます」

詳細説明 テキスト

送料の下に掲載する詳細説明テキストを設定することができます。
「詳細説明テキスト」はABOUTページの「送料について」ブロックにのみ表示されます。
例:「通常商品は宅配便にてお届けいたします。送料は一律800円(北海道・沖縄を除く／北海道:1,500円、沖縄・離島:2,000円)です。」

「はじめにお読みください（README）」ボタン

サイドバー/スライドメニューにREADMEボタンを設置することができます。
テキスト内容、カラー、リンクを自由に設定することが可能です。
ブログAppsで作成したページや外部サイトにリンクさせることで、
ショップを利用されるお客様への注意事項や告知を伝えることができます。

BASEショップのスクリーンショット

1-11【 READMEボタン 】 ON/OFF

送料表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

テキストカラー

READMEのテキストカラーを変更することができます。
初期値は「 #FFFFFF 」になっています。

背景色

READMEの背景色を変更することができます。
初期値は「 #D50000 」になっています。

テキスト

READMEのタイトルを設定することができます。
例:「はじめにお読みください」

URL

READMEのURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

サイドバナー

サイドバー/スライドメニューにバナーを4枚まで設定可能です。
各バナーには自由なリンク先を設定することができます。
バナーを含めたサイドバーのパーツは「サイドバーレイアウト」で並び替えることができます。
BASEショップのスクリーンショット

1-12【 サイドバナー 】① 画像

サイドバナー①の画像をアップロードする事ができます。

URL

サイドバナー①のリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

サイドバナー ② 画像

サイドバナー②の画像をアップロードする事ができます。

URL

サイドバナー②のリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

「サイドバナー ③」～「サイドバナー ④」も同様の設定方法となっています。

【画像の推奨サイズ】

『サイドバナー』の推奨サイズは「 横560px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横600px / 縦315px 」の画像を使用しています。

カテゴリーメニュー画像

大カテゴリーを画像にすることで、ショップ全体の構成がひと目でわかります。
ブランド別や価格別などの特別なカテゴリも自然な形で区分することができます。
カテゴリーメニュー画像は最大15カテゴリまで設定可能で、一部のカテゴリだけ画像にしたり、画像を角丸にすることも可能です。

BASEショップのスクリーンショット

1-13【 カテゴリーメニュー画像 】 ON/OFF

カテゴリーメニュー画像のON/OFFを切り替えることができます。
ONにすると画像を設定した大カテゴリーが画像で表示されます。
OFFにするとデフォルト状態（テキストリンク）で表示されます。
初期状態ではOFFになっています。

カテゴリー画像を角丸にする ON/OFF

ONにするとカテゴリー画像が角丸に切り抜かれます。
初期状態ではOFFになっています。

カテゴリー 1 画像

一番上のカテゴリーの画像を設定することができます。

カテゴリー 2 画像

上から2番目のカテゴリーの画像を設定することができます。

「カテゴリー 3 画像」～「カテゴリー 15 画像」も同様の設定方法となっています。

カテゴリーメニュー画像はカテゴリIDと対応する仕組みではなく、表示されているカテゴリーの上から順番に「カテゴリー1」「カテゴリー2」…と対応しています。 BASE管理画面の『カテゴリ管理』でカテゴリの順番を並び替えた際には、カテゴリーメニュー画像を手動で変更してください。

TIPS （設定のヒント）
  • デモショップのように「すべてのアイテム」「ブランドから探す」「価格帯から探す」などのカテゴリを作成する方法

    デモショップでは「トップス」「ボトムス」といった通常のカテゴリに加えて、全商品をまとめた「すべてのアイテム」という大カテゴリを作成しています。 商品は複数のカテゴリに登録できるため、各商品を「すべてのアイテム」と個別カテゴリ（例：「トップス」「ボトムス」など）に設定します。 こうすることで、「すべてのアイテム」を開けば、ショップ内の全商品を一覧表示できる仕組みになります。

    同様に、デモショップでは「ブランドから探す」「価格帯から探す」などの大カテゴリを作成しています。 『カテゴリーメニュー画像』機能を利用してこれらの大カテゴリに見出し的な画像を指定することで、特別なカテゴリも自然な形で見せることが可能です。

    下記に、デモショップ の設定内容のスクリーンショットを掲載していますので、ご参考にしてください。
    （「カテゴリ管理 App」の操作方法や設定方法についてはBASEへ直接お問い合わせください。）


    カテゴリ管理 App
    「トップス」「ボトムス」のような大カテゴリに加えて、「すべてのアイテム」「ブランドから探す」「価格帯から探す」という大カテゴリを作成しています。

    テーマ設定 - カテゴリーメニュー画像
    一番上の「すべてのアイテム」は画像ではなくテキストリンクにするために「カテゴリー 1 画像」は設定していません。
    また、「ブランドから探す」「価格帯から探す」の画像は通常のカテゴリとは異なり、見出し的なデザインの画像を設定しています。

    商品 - 商品編集
    デモショップでは、各商品を「すべてのアイテム」「個別カテゴリ（例：「トップス」「ボトムス」など）」「ブランド」「価格帯」など複数のカテゴリに指定することで、商品への多角的な導線を確保しています。

HOME設定トップページに関連する設定項目です。

メインビジュアル

ドラッグ操作/スワイプ操作対応の機能的なレスポンシブスライダーです。
画像はPC用とスマホ用を各6枚まで設定可能で、商品ページ / カテゴリページ / 検索結果 / 外部サイトなど自由なリンク先を設定することができます。 PCでは画面幅いっぱいに広がるワイド表示にすることも可能です。
（スライダー機能を利用せず画像1枚のみをメインビジュアルとして設定することもできます。）

BASEショップのスクリーンショット

2-1【 メインビジュアル 】 ON/OFF

メインビジュアルの表示ON/OFFを切り替えることができます。
初期状態ではONになっています。
BASEショップのスクリーンショット

ワイド表示 ON/OFF

ONにすると、メインビジュアルがPC閲覧時に画面幅いっぱいに広がる状態になります。
OFFにすると、PC閲覧時のメインビジュアルはメインコンテンツと同じ横幅（サイドバーの右側）に配置されます。
初期状態ではON（ワイド表示）になっています。

メインビジュアル 1 画像（PC）

メインビジュアルの1枚目の画像（PC用）をアップロードする事ができます。

画像（スマホ）

メインビジュアルの1枚目の画像（スマホ用）をアップロードする事ができます。
（PC用の画像と同じ画像を指定しても問題ありません。）

URL

メインビジュアルの1枚目のリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

メインビジュアル 2 画像（PC）

メインビジュアルの2枚目の画像（PC用）をアップロードする事ができます。
（2枚目以降の画像がアップロードされていない場合にはスライダー機能がOFFとなり1枚目の画像のみがメインビジュアルとして表示されます。）

画像（スマホ）

メインビジュアルの2枚目の画像（スマホ用）をアップロードする事ができます。
（PC用の画像と同じ画像を指定しても問題ありません。）

URL

メインビジュアルの2枚目のリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

「メインビジュアル 3」～「メインビジュアル 6」も同様の設定方法となっています。

【画像の推奨サイズ】

メインビジュアルをワイド表示にする場合（ワイド表示ON）

「PC用」の推奨サイズは「 横 1920px 」です。
縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横3840px / 縦1728px 」の画像を使用しています。

「スマホ用」の推奨サイズは「 横 840px 」です。
縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横 840px / 縦 1000px 」の画像を使用しています。

メインビジュアルを通常の表示形式する場合（ワイド表示OFF）

「PC用」のスライド画像の推奨サイズは「 横1440px 」です。
縦の高さはお好みのサイズで構いません。

「スマホ用」のスライド画像の推奨サイズは「 横840px 」です。
縦の高さはお好みのサイズで構いません。

イメージスライダー

ドラッグ操作/スワイプ操作対応の機能的なレスポンシブスライダーです。
ループ表示型のスライダーを設置することができます。
画像は6枚まで設定可能で、自由なリンク先を設定することができます。

BASEショップのスクリーンショット

2-2【 イメージスライダー 】 ON/OFF

イメージスライダーの表示ON/OFFを切り替えることができます。
初期状態ではOFFになっています。
（イメージスライダーをONにする場合は「スライド 1 画像」～「スライド 6 画像」の6枚すべての画像を設定することを推奨します。
また、すべての画像は同じサイズにすることを推奨します。）

スライド 1 画像

【イメージスライダー】の1枚目の画像をアップロードする事ができます。

URL

【イメージスライダー】の1枚目のリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

スライド 2 画像

【イメージスライダー】の2枚目の画像をアップロードする事ができます。

URL

【イメージスライダー】の2枚目のリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

「スライド 3」～「スライド 6」も同様の設定方法となっています。

【画像の推奨サイズ】

「イメージスライダー」の画像の推奨サイズは「 横 600px 」です。
ご参考までに、デモショップでは「 横800px / 縦500px 」の画像を使用しています。

重要なお知らせ

トップページに重要なお知らせを表示することができます。

BASEショップのスクリーンショット

2-3【重要なお知らせ】 ON/OFF

重要なお知らせ表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

テキストカラー

お知らせのテキスト色を選択することができます。
初期値は「 #FFFFFF 」になっています。

背景色

お知らせの背景色を選択することができます。
初期値は「 #111111 」になっています。

テキスト

お知らせの内容をテキストで入力することができます。

URL

（任意）お知らせのリンク先URLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください

トップページバナー

トップページにバナーを2枚まで表示することができます。
自由なリンク先を設定可能で、リンクを設定せずに告知エリアとしても利用することも可能です。
トップページバナーを2枚設定した場合、PCでは横に並び、スマホでは縦に並びます。

BASEショップのスクリーンショット

2-4【 トップページバナー 】 ① 画像

トップページバナー ① の画像をアップロードする事ができます。
トップページバナーの画像の推奨サイズは「 横1440px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1440px / 縦648px 」の画像を使用しています。

URL

（任意）トップページバナー ① のリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

【 トップページバナー 】 ② 画像

トップページバナー ② の画像をアップロードする事ができます。
トップページバナーの画像の推奨サイズは「 横1440px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1440px / 縦648px 」の画像を使用しています。

URL

（任意）トップページバナー ① のリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

ピックアップ

ピックアップアイテムを6件まで表示することができます。
画像/テキスト/リンクを自由に設定可能で、リンクを設定せずに告知エリアとしても利用可能です。
レイアウトはピックアップの件数に応じて自動的に調整されます。
BASEショップのスクリーンショット

2-5【 ピックアップ 】 ON/OFF

「ピックアップ」の表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

ピックアップ タイトル

任意のタイトルに変更することが可能です。

ピックアップ 1 画像

1件目のピックアップアイテムの画像をアップロードすることができます。
画像の表示サイズは画面サイズに応じて自動的に調整されます。
推奨サイズは「 横600px 」です。縦の高さはお好みのサイズで構いません。
デザインの仕様上、全ての画像サイズを合わせることをお勧めします。
ご参考までに、デモショップでは「 横800px / 縦400px 」の画像を使用しています。

テキスト

（任意）1件目のピックアップアイテムの内容をテキストで入力することができます。

URL

（任意）1件目のピックアップアイテムのURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

「ピックアップ2」～「ピックアップ6」も同様の設定方法となっています。

ランキング

ランキングを6件まで表示することができます。
画像/テキスト/リンクを自由に設定可能で、リンクを設定せずに告知エリアとしても利用可能です。
PCでは横に最大6アイテム、スマホでは横に2または3アイテム表示されます。
ランキングアイコンを非表示にしてピックアップのように使うことも可能です。
BASEショップのスクリーンショット

2-6【 ランキング 】 ON/OFF

「ランキング」の表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

ランキングアイコンを表示 ON/OFF

ONにすると順位ラベル（1～6）が表示されます。
初期状態ではONになっています。

タイトル

任意のタイトルに変更することが可能です。

ランキング 1 画像

1件目のランキングアイテムの画像をアップロードすることができます。
推奨サイズは「 横600px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横600px / 縦600px 」の画像を使用しています。

テキスト

（任意）1件目のピックアップアイテムの内容をテキストで入力することができます。

URL

（任意）1件目のピックアップアイテムのURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

「ランキング 2」～「ランキング 6」も同様の設定方法となっています。

おすすめアイテム

トップページに「おすすめアイテム」を2つまで表示することができます。
画像/見出し/テキスト/リンクボタン/背景色を設定することができ、写真風のレイアウトも可能です。
おすすめ商品を紹介するだけでなく、ショップのコンセプトを掲載する目的にも利用することができます。

BASEショップのスクリーンショット

2-7【 おすすめアイテム 】 ON/OFF

「おすすめアイテム」の表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

タイトル

任意のタイトルに変更することが可能です。

テキストカラー

「おすすめアイテム」のテキスト色を選択することができます。
初期値は「 #333333 」になっています。

背景色

「おすすめアイテム」の背景色を選択することができます。
初期値は「 #fafafa 」になっています。

テキストを中央寄せ ON/OFF

ONにすると「おすすめアイテム」の見出しやテキスト、リンクボタンが中央寄せになります。
初期状態ではONになっています。

写真風レイアウト ON/OFF

ONにすると「おすすめアイテム」の画像が写真風のレイアウトになります。
初期状態ではOFFになっています。

おすすめアイテム ① ON/OFF

おすすめアイテム ① の表示のON/OFFを切り替えることができます。
初期状態ではONになっています。

画像

おすすめアイテム ① の画像をアップロードする事ができます。
画像の推奨サイズは「 横800px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1600px / 縦1000px 」の画像を使用しています。

見出し

おすすめアイテム ① の見出しテキストを設定することができます。

テキスト

おすすめアイテム ① のテキストを設定することができます。

URL

おすすめアイテム ① のリンク先を設定することができます。
URLが設定されている場合、自動的にリンクボタンが表示されます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

ボタンテキスト

おすすめアイテム ① のボタンテキストを設定することができます。
初期値は「 VIEW 」になっています。

おすすめアイテム ② ON/OFF

おすすめアイテム ② の表示のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

画像

おすすめアイテム ② の画像をアップロードする事ができます。
画像の推奨サイズは「 横800px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1600px / 縦1000px 」の画像を使用しています。

見出し

おすすめアイテム ② の見出しテキストを設定することができます。

テキスト

おすすめアイテム ② のテキストを設定することができます。

URL

おすすめアイテム ② のリンク先を設定することができます。
URLが設定されている場合、自動的にリンクボタンが表示されます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

ボタンテキスト

おすすめアイテム ② のボタンテキストを設定することができます。
初期値は「 VIEW 」になっています。

ピックアップカテゴリー

トップページに任意のカテゴリー（4カテゴリーまで）をスライダー形式で表示することができます。
1カテゴリーにつき最大24アイテムが表示され、カテゴリページへのリンクも表示されます。
カテゴリーごとにアイキャッチ画像を設定することも可能です。

BASEショップのスクリーンショット

2-8 ピックアップカテゴリー 】 ON/OFF

ピックアップカテゴリーのON/OFFを切り替えることができます。
初期状態ではOFFになっています。

ボタンテキスト

カテゴリーページ（一覧）へのボタンのテキストを変更することが可能です。
初期値は「 VIEW ALL 」になっています。

ピックアップカテゴリー ① カテゴリID

表示するカテゴリーを設定することができます。
下記の例のようにカテゴリIDを数字のみで入力してください。
カテゴリIDの確認方法はこちら

タイトル

任意のタイトルに変更することが可能です。

アイキャッチ画像

カテゴリーのアイキャッチ画像を設定することができます。

「ピックアップカテゴリー ②」～「ピックアップカテゴリー ④ 」も同様の設定方法となっています。

  • ⇒ カテゴリIDの確認方法

    方法① 管理画面から確認する方法

    1. 「カテゴリ管理App」をインストールしていない場合にはBASE Appsよりインストールしてカテゴリを作成します。
    2. BASE管理画面の左メニューにある「Apps」→「利用中のApps」の「カテゴリ管理」→「一括カテゴリ登録」タブへ進みます。
    （BASEへログインした状態でこちらをクリックして直接開くこともできます。）
    3. 「カテゴリID確認表」で各カテゴリーの「カテゴリID」を確認することができます。

    【具体例】

    下記の例はデモショップの場合であり、ショップごとにカテゴリIDは異なりますのでご注意ください。
    この場合「トップス」のカテゴリIDは「 6898964 」だということが確認できます。

    方法② ショップ画面から確認する方法

    1. 「カテゴリ管理App」をインストールしていない場合にはBASE Appsよりインストールしてカテゴリを作成します。
    2. ブラウザでご自身のショップを開き、設定したいカテゴリーのページへ移動します。
    3. ブラウザのアドレスバーに表示されているURLがカテゴリーページのURLです。
    4. URLの/categories/以降の数字が「カテゴリID」になります。

    ※ご注意
    誤ってBASE管理画面上のプレビュー画面からURLをコピーしないようにご注意ください。
    「https://admin.thebase.in」からはじまるURLは管理画面のURLであり、お客様からはアクセスできないURLです。

    【具体例】

    下記の例はデモショップの「トップス」カテゴリーの場合です。
    表示されているURLが「 https://vitademo.base.ec/categories/6898964 」なので、カテゴリIDは「 6898964 」になります。

    カテゴリ管理Appについてはサポート対象外となります。
    Appsのインストール方法や設定方法についてはBASEへ直接お問い合わせください。

キーワードリスト

「検索結果ページへのリンク付きのキーワード」を50件まで表示可能です。
ハッシュタグのようにキーワードやカテゴリー等を表示することができます。

BASEショップのスクリーンショット

2-9【 キーワードリスト 】 ON/OFF

キーワードリストのON/OFFを切り替えることができます。
初期状態ではOFFになっています。

タイトル

キーワードリストのタイトルを変更することが可能です。
初期値は「 人気のキーワード 」になっています。

キーワード

表示するキーワードを50件まで設定することができます。
全てのキーワードをカンマ区切りで1行にしてください。
カンマ「 , 」は半角です。
半角ドット「 . 」や全角句読点「 、 」などにならないようご注意ください。

【具体例】
下記のようなキーワードリストを表示したい場合
「キーワード（カンマ区切り）」には下記のような文字列を設定する形になります。

セール,新作,ソファ,ベッド,ラグ,クッション,ホワイト家具,モノトーン,シンプル,おしゃれ

テキスト入力欄は下記のような形になります。

最近チェックした商品

トップページと商品ページに「最近チェックした商品（閲覧履歴）」を表示することができます。
閲覧履歴はトップページではPCで4件、スマホで3件が表示されます。
商品ページではPC/スマホ共に3件が自動的に取得されて表示されます。

BASEショップのスクリーンショット

2-10【 最近チェックした商品 】 ON/OFF

「最近チェックした商品」のON/OFFを切り替えることができます。
初期状態ではONになっています。

タイトル

「Recently Viewed」や「閲覧履歴」などの任意のタイトルに変更することができます。
初期値は「 最近チェックした商品 」になっています。

新着情報

新着情報を3件まで表示することができます。
日付、内容、リンクを自由に設定することができます。

BASEショップのスクリーンショット

2-11【 新着情報 】 ON/OFF

新着情報表示（3件まで設定可能）のON/OFFを切り替えることができます。
初期状態ではOFFになっています。

タイトル

新着情報表示のタイトルを変更することができます。

新着情報 1 日付

1件目の新着情報の日付/タイトルをテキストで入力することができます。
ニュース機能として利用する場合には「2025.01.01」や「7月10日」などのように設定してください。
ランキング機能として利用する場合には「人気No.1」などのように設定してください。

内容

1件目の新着情報の内容をテキストで入力することができます。

リンク先

（任意）1件目の新着情報のURLを設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

「新着情報 2」～「新着情報 3」も同様の設定方法となっています。

ブログ最新記事

トップページに「ブログApps」の記事を4件まで自動的に取得して表示可能です。
「この記事を固定にする」に設定した記事はトップページにも表示されます。
テーマ設定の『5-1【 Blog App 】』でブログの日付を非表示にして常設コンテンツのように見せることもできます。

BASEショップのスクリーンショット

2-12【 ブログ最新記事 】 ON/OFF

トップページのブログ最新記事の表示ON/OFFを切り替えることができます。
初期状態ではOFFになっています。

ブログAppsについてはサポート対象外となります。
Appsのインストール方法や設定方法についてはBASEへ直接お問い合わせください。

Instagram

“SnapWidget” のような外部サービスを利用してInstagramの埋め込みが可能です。
アカウントのリンクボタンを表示させることもできます。

BASEショップのスクリーンショット

2-13【 Instagram 】 ON/OFF

InstagramのON/OFFを切り替えることができます。
初期状態ではOFFになっています。

タイトル

（任意）Instagramのタイトルを設定することができます。

埋め込みコード（PC）

PC用のInstagram埋め込みコードを設定することができます。

埋め込みコード（スマホ）

スマホ用のInstagram埋め込みコードを設定することができます。
PCとスマホで別のコードを入れることで、例えばPCでは横6アイテム、スマホでは横3アイテムのInstagramを埋め込むことが可能です。
（PC用のInstagram埋め込みコードと同じ内容を記述していただいても問題ありません。）

アカウント表示 ON/OFF

ONにすると、BASE管理画面の「ショップ情報」で設定したInstagramのアカウント名が表示されます。
初期状態ではOFFになっています。
「Instagram 埋め込みコード」には、Instagram埋め込みコード以外にも自由なHTMLを記述していただくことが可能です。
自由なHTMLを記述することで「フリースペース」として利用することもできますが、HTMLについてはサポート対象外となっております。
HTMLの記述方法や記述内容のご案内等は致しかねますことを予めご了承ください。
また、閉じタグの漏れや記述内容の誤りによってショップ全体の表示に影響が出る場合がありますので、
HTMLを記述される場合には十分に注意して設定を行ってください。

Instagramの埋め込み方法

Instagramをショップに埋め込む方法はいくつかありますが、“SnapWidget”を利用する方法が簡単でオススメです。
SnapWidget等の外部サービスについてはサポート対象外となっていますが、下記に簡単な設定方法をご案内しています。

  • ⇒ Instagramを埋め込むことができる “SnapWidget” の利用方法

    “SnapWidget”はウェブサイトやブログにInstagram、Twitter、FacebookなどのSNSのコンテンツを埋め込むことができるオンラインサービスです。 無料版と有料版があるため、目的に応じてご利用ください。

    SnapWidgetの使い方

    1. SnapWidgetにアクセス

    SnapWidgetにアクセスして「GET A FREE WIDGET」をクリックします。

    https://snapwidget.com/

    2. SIGN UP

    名前、メールアドレス、パスワードを入力し、「SIGN UP」をクリックします。

    3. ダッシュボードにアクセス

    無料版を利用する場合は「SKIP THIS」をクリックします。

    4. 埋め込みレイアウトを選択

    「FREE」とあるものが、無料で利用できる埋め込みウィジェットです。
    デモショップのようなレイアウトで埋め込みたい場合には、 「 instagram grid 」を選択します。

    5. Instagramアカウントと連携

    Usernameをクリックして、埋め込みたいインスタグラムのアカウントでログインすると連携が完了します。

    6. 埋め込みコードを取得

    必要に応じてキャンプション表示の有無、画像同士の間隔等の調整項目を設定してから「GET WIDGET」をクリックします。
    （レイアウト崩れを防ぐために[Responsive]の項目は[YES]に設定することを推奨します。）

    下記のようなコードが表示されますので、コピーします。 

    <!-- SnapWidget -->
<script src="https://snapwidget.com/js/snapwidget.js"></script>
<iframe src="https://snapwidget.com/embed/1037526" class="snapwidget-widget" allowtransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden;  width:100%; "></iframe>

    7. 埋め込みコードを貼り付け

    テーマ設定の「Instagram 埋め込みコード」に埋め込みコードをペーストして保存します。

“SnapWidget” をはじめとした外部サービスについてはサポート対象外となります。
本オンラインマニュアルに記載されている以上の情報はご案内致しかねます。
個別のお問い合わせに対してもご回答致しかねますことを予めご了承ください。
また、Instagram公式のツールではないため将来的に突然利用できなくなる可能性もありますが、一切の責任は負いかねます。

YouTube

トップページにYouTubeの動画を埋め込み表示することができます。

BASEショップのスクリーンショット

2-14【 YouTube 】 ON/OFF

YouTube埋め込み動画の表示ON/OFFを切り替えることができます。
初期状態ではOFFになっています。

タイトル

（任意）YouTubeのタイトルを設定することができます。

埋め込みコード

YouTube動画の埋め込みコードを入力することで、自動的に動画が埋め込み表示されます。

  • ⇒ YouTube動画 埋め込みコードの取得方法はこちら
    1. 埋め込みたいYouTube動画のページを表示します。
    2. 動画の右下にある『共有』をクリックします。
    3. 「埋め込む」をクリックします。
    4. 「コピー」をクリックして埋め込みコードをコピーします。
    5. BASEのデザイン画面の「YouTube 埋め込みコード」のテキストエリアにペーストします。

フローティングバナー

トップページの固定位置に追従するフローティングバナーを設置することができます。
フローティングバナーは「毎回表示」と「閉じられた後は10分後に再度表示」が選択可能です。

BASEショップのスクリーンショット

2-15【フローティングバナー】 ON/OFF

フローティングバナーの表示ON/OFFを切り替えることができます。
初期状態ではOFFになっています。

バナーを左側に表示（PC） ON/OFF

ONにすると、PC閲覧時のフローティングバナーがショップ左側に表示されます。
「おみせコネクト」等の別のパーツがショップ右側にある場合には、ONにすることで被らずに表示することができます。
初期状態ではOFF（右側に表示）になっています。

バナーが閉じられた後は10分間再表示しない ON/OFF

商品ページなどからトップページに戻る度に毎回バナーが表示されると煩雑に感じる場合があります。
ONにすることで一度フローティングバナーが閉じられた後は10分間再表示されなくなります。
10分間再表示されないのは「その端末から再度アクセスした場合のみ」となります。
別の端末やお客様がショップにアクセスした場合には通常通り表示されますのでご安心ください。
 初期状態ではOFF（トップページを開くたびに毎回表示）になっています。

バナー画像

フローティングバナーの画像をアップロードする事ができます。

URL

フローティングバナーのリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

【画像の推奨サイズ】

フローティングバナーは最大で横280pxで表示されますが、Retinaディスプレイを考慮して大きめの画像をご利用いただくことを推奨します。
『フローティングバナー』の推奨サイズは「 横560px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横790px / 縦340px 」の画像を使用しています。

トップページレイアウト

トップページ各パーツの並び順を変更することができます。
表示しない機能は並び順を設定しなくても問題ありません。
「 1 」の値を設定した項目が一番上に表示され、「 14 」の値を設定した項目が一番下に表示されます。
（「メインビジュアル」と「お気に入りリスト」の位置は固定となっています。）

2-16【 トップページレイアウト 】パーツを並び替える ON/OFF

ONにすることで変更したパーツの並び順を有効にすることができます。
初期状態ではOFFになっています。

表示順: イメージスライダー

「 1 」～「 14 」の値を設定してください。
「 1 にすると最上部に表示され、「 14 」にすると最下部に表示されます。
初期値は「 1 」になっています。

表示順: 重要なお知らせ

「 1 」～「 14 」の値を設定してください。
「 1 にすると最上部に表示され、「 14 」にすると最下部に表示されます。
初期値は「 2 」になっています。

「表示順: トップページバナー」～「表示順: Instagram」も同様の設定方法となっています。

サイドバーレイアウト

サイドバー（PC閲覧時のサイドバー / スマホ閲覧時のスライドメニュー）の各パーツの並び順を変更することができます。
表示しない機能は並び順を設定しなくても問題ありません。
「 1 」の値を設定した項目が一番上に表示され、「 8 」の値を設定した項目が一番下に表示されます。

2-17【 サイドバーレイアウト 】パーツを並び替える ON/OFF

ONにすることで変更したパーツの並び順を有効にすることができます。
初期状態ではOFFになっています。

表示順: 送料

「 1 」～「 8 」の値を設定してください。
「 1 にすると最上部に表示され、「 8 」にすると最下部に表示されます。
初期値は「 1 」になっています。

表示順: READMEボタン

「 1 」～「 8 」の値を設定してください。
「 1 にすると最上部に表示され、「 8 」にすると最下部に表示されます。
初期値は「 2 」になっています。

「表示順: カテゴリー」～「表示順: サイドバナー ④」も同様の設定方法となっています。

ABOUT設定アバウトページに関連する設定項目です。

ABOUT設定

アバウトページ画像、カスタムショップ情報、送料、お支払い方法を表示できる他、
『FAQ』や『お買い物ガイド』等の自由な内容を掲載できる「フリースペース」機能を搭載しています。

BASEショップのスクリーンショット

3-1【 アバウトページ 】アバウトページ画像

アバウトページに掲載する画像をアップロードすることができます。
画像は縦長/横長に関わらずお好みのサイズで構いません。
ご参考までに、デモショップでは「 横3000px / 縦1000px 」の画像を使用しています。

住所

ショップの所在地を表示することができます。

TEL

ショップの電話番号を表示することができます。

FAX

ショップのFAX番号を表示することができます。

営業時間

ショップの営業時間を表示することができます。

定休日

ショップの定休日を表示することができます。

E-Mail

ショップのメールアドレスを表示することができます。

アバウト フリースペース

「FAQ」や「お買い物ガイド」などの自由な内容を2つまで掲載することができます。
⇒具体例：デモショップ アバウトページ「FAQ」

3-2【 アバウトページ フリースペース 】① ON/OFF

アバウトページ フリースペース ① の表示ON/OFFを切り替えることができます。
初期状態ではOFFになっています。

タイトル

アバウトページ フリースペース ① のタイトルを設定することができます。

画像

アバウトページ フリースペース ① の画像をアップロードすることができます。

テキスト1

アバウトページ フリースペース ① のテキストを設定することができます。
1つのテキストエリアは1,000文字までの文字数制限があるため、文章量が多い場合には「アバウト フリースペース ① テキスト2」に続きを記載してください。

テキスト2

（任意）アバウトページ フリースペース ① のテキストを設定することができます。

「アバウトページ フリースペース ②」も同様の設定方法となっています。

TIPS （設定のヒント）
トップページのバナー等から「アバウトページ フリースペース」で設定したコンテンツにリンクを貼りたい場合には、
[ショップURL]/about#[フリースペースタイトル]
というURLでリンクすることができます。
例えば、デモショップの場合であれば
・ショップURLが「 https://vitademo.base.ec/ 」
・フリースペースのタイトルが「 お買い物ガイド 」
であるため、
https://vitademo.base.ec/about#お買い物ガイド
というURLになります。
同様に、デモショップのもうひとつのフリースペースのURLは
https://vitademo.base.ec/about#FAQ
となっています。
上記をご参考にして、ショップURLやフリースペースタイトルを変更してご利用ください。
TIPS （設定のヒント）
「アバウトページ フリースペース」等のテキストエリアではHTMLが利用可能です。
「 <br> 」と入力すると改行され、「 <p> ～ </p> 」で囲むと段落になり、「 <b> ～ </b> 」で囲むと太字になります。 

<p>
<b>【営業時間】</b>
<br>
11:30-15:00（L.O. 14:30）
<br>
18:00-23:00（L.O. 22:00）
</p>

<p>
<b>【定休日】</b>
<br>
日曜日・祝日
<br>
神戸市中央区山本通1-1
</p>
以下のように表示されます。
上記以外の自由なHTMLを記述することも可能です。
但し、HTMLについてはサポート対象外となっておりますので、
HTMLの記述方法や記述内容のご案内等は致しかねますことを予めご了承ください。
また、閉じタグの漏れや記述内容の誤りによってショップ全体の表示に影響が出る場合がありますので、
HTMLを記述される場合には十分に注意して設定を行ってください。

お支払い方法の表示設定

フッターやアバウトページにお支払い方法（利用可能な決済方法）を表示できます。
表示する決済方法のON/OFFを手動で切り替えてください。（BASEかんたん決済の設定内容は自動的に反映されません。）
フッター
アバウトページ

3-3【お支払い方法の表示】 表示 ON/OFF

お支払い方法の表示ON/OFFを切り替えることができます。
初期状態ではONになっています。

Pay ID 翌月あと払い

利用可能な決済方法として「Pay ID 翌月あと払い」を表示する場合にはONにしてください。
（BASEかんたん決済の設定内容は自動的に反映されません。）

Pay ID 3回あと払い

利用可能な決済方法として「Pay ID 3回あと払い」を表示する場合にはONにしてください。
（BASEかんたん決済の設定内容は自動的に反映されません。）

クレジットカード

利用可能な決済方法として「クレジットカード」を表示する場合にはONにしてください。
（BASEかんたん決済の設定内容は自動的に反映されません。）

キャリア決済

利用可能な決済方法として「キャリア決済」を表示する場合にはONにしてください。
（BASEかんたん決済の設定内容は自動的に反映されません。）

銀行振込

利用可能な決済方法として「銀行振込」を表示する場合にはONにしてください。
（BASEかんたん決済の設定内容は自動的に反映されません。）

コンビニ決済

利用可能な決済方法として「コンビニ決済」を表示する場合にはONにしてください。
（BASEかんたん決済の設定内容は自動的に反映されません。）

Amazon Pay

利用可能な決済方法として「Amazon Pay」を表示する場合にはONにしてください。
（BASEかんたん決済の設定内容は自動的に反映されません。）

PayPal

利用可能な決済方法として「PayPal」を表示する場合にはONにしてください。
（BASEかんたん決済の設定内容は自動的に反映されません。）

PayPay

利用可能な決済方法として「PayPay」を表示する場合にはONにしてください。
（BASEかんたん決済の設定内容は自動的に反映されません。）

Google マップ

アバウトページにGooleマップを埋め込んで表示することが可能です。
最寄り駅や経路などの補足情報を記載することもできます。

3-4【Google マップ】 表示 ON/OFF

Googleマップの表示ON/OFFを切り替えることができます。
初期状態ではOFFになっています。

案内テキスト

最寄り駅、経路、住所、電話番号等の補足情報をテキストで入力することができます。

埋め込みコード

Googleマップの埋め込みコードを入力することで、自動的にトップページに地図が表示されます。

  • ⇒ Googleマップ 埋め込みコードの取得方法はこちら
    1. Google マップで埋め込みたい地図の場所を表示します。
    2. 画面の左上にある『≡』をクリックします。
    3. 「地図を共有または埋め込む」をクリックします。
    4. 「地図を埋め込む」のタブを選択して「HTMLをコピー」をクリックします。
    5. BASEのデザイン画面にある「埋め込みコード」のテキストエリアにHTMLをペーストします。

商品ページ設定商品ページに関連する設定項目です。

商品ページ設定

BASEショップのスクリーンショット

4-1【 商品ページ 】商品ページの商品画像を正方形に切り抜く ON/OFF

ONにすると商品ページの商品一覧の商品画像を正方形に切り抜いて表示することができます。
クリックした際の拡大画像は元の縦横比率の画像が表示されます。
元の縦横比率を維持したい場合にはOFFにしてご利用ください。
初期状態ではOFFになっています。
BASEショップのスクリーンショット

スマホ商品ページ下部に購入ボタンを固定表示 ON/OFF

スマホ閲覧時の商品ページ下部に購入ボタンを固定表示することができます。
(ページ内のカートボタンよりも下にスクロールした際に自動的に表示されます。)
初期状態ではONになっています。
BASEショップのスクリーンショット

「この商品をアプリで見る」ボタンを表示 ON/OFF

スマホ閲覧時、BASEアプリとの連携として、商品ページに「この商品をアプリで見る」ボタンを表示することができます。
初期状態ではONになっています。

商品ページバナー

全ての商品ページに共通したバナーを表示することができます。
バナーには自由なリンク先を設定することができ、リンクを設定せずに告知エリアとしても利用することもできます。

BASEショップのスクリーンショット

4-2【 商品ページバナー 】 画像

商品ページバナーの画像をアップロードする事ができます。
商品ページバナーの画像の推奨サイズは「 横800px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1200px / 縦1600px 」の画像を使用しています。

URL

（任意）商品ページバナーのリンク先を設定することができます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。

商品ページ共通テキスト

【サイズガイド】や【注意事項】など、全ての商品ページで共通して表示させたい内容を一元管理することができます。

BASEショップのスクリーンショット

4-3【 商品ページ共通テキスト 】 ON/OFF

全ての商品ページで共通のテキストを表示することができます。
初期状態ではOFFになっています。

テキスト1

「商品ページ共通テキスト」のテキストを設定することができます。
1つのテキストエリアは1,000文字までの文字数制限があるため、文章量が多い場合には「テキスト2」に続きを記載してください。

テキスト2

（任意）「商品ページ共通テキスト」のテキストを設定することができます。
TIPS （設定のヒント）
「商品ページ共通テキスト」等のテキストエリアではHTMLが利用可能です。
「 <br> 」と入力すると改行され、「 <p> ～ </p> 」で囲むと段落になり、「 <b> ～ </b> 」で囲むと太字になります。 

<p>
<b>【営業時間】</b>
<br>
11:30-15:00（L.O. 14:30）
<br>
18:00-23:00（L.O. 22:00）
</p>

<p>
<b>【定休日】</b>
<br>
日曜日・祝日
<br>
神戸市中央区山本通1-1
</p>
以下のように表示されます。
上記以外の自由なHTMLを記述することも可能です。
但し、HTMLについてはサポート対象外となっておりますので、
HTMLの記述方法や記述内容のご案内等は致しかねますことを予めご了承ください。
また、閉じタグの漏れや記述内容の誤りによってショップ全体の表示に影響が出る場合がありますので、
HTMLを記述される場合には十分に注意して設定を行ってください。

Apps設定BASE Appsに関連する設定項目です。

各種BASE Appsのインストール方法や設定方法についてはBASEへ直接お問い合わせください。

Blog App

BASEショップのスクリーンショット

5-1【 Blog App 】ブログをメニューに表示 ON/OFF

OFFにすると、サイドバー/スライドメニューにブログ一覧へのリンクが表示されなくなります。
「Blog App」を任意の内容のページを追加する目的のみに利用する場合で、一覧ページを見せたくない場合にはOFFにしてご利用ください。
但し、一覧ページを経由した各記事への導線がなくなりますので、ピックアップやバナー等から各記事へリンクを設定する必要があります。
「Blog App」を通常通りブログとして利用する場合にはONにすることを推奨します。
初期状態ではON（ブログをメニューに表示）になっています。

日付を表示 ON/OFF

OFFにすると、ブログ一覧やブログ記事に日付が表示されなくなります。
「Blog App」で『お買い物ガイド』や『はじめにお読みください』などの常設コンテンツのみを作成する場合には、
日付表示をOFFにすることで掲載情報が古く見えないメリットがあります。
「Blog App」をニュースやブログを掲載する目的で利用する場合にはONにすることを推奨します。
初期状態ではON（日付を表示）になっています。

メンバーシップ App

5-2【 メンバーシップ App 】メンバーシップページのタイトル

ナビゲーションのメンバーシップページへのリンクテキストを変更することができます。
初期値は「 メンバーシップ 」になっています。

マイページ / ログインのタイトル

ナビゲーションのマイページ/ログインへのリンクテキストを変更することができます。
初期値は「 マイページ 」になっています。

コミュニティ App

5-3【 コミュニティApp 】コミュニティ カラー

コミュニティAppで表示される「会員限定商品」などの色を変更することができます。
初期値は「 #212121 」になっています。

コミュニティページ ヘッダー画像

コミュニティページに表示するヘッダー画像をアップロードする事ができます。

コミュニティページ タイトル

ナビゲーションのコミュニティページへのリンクテキストを変更することができます。
初期値は「 Community 」になっています。

販売期間設定 App

5-4【 販売期間設定 App 】販売期間設定 カラー

販売期間設定Appで表示される「COMING SOON」などの色を変更することができます。
初期値は「 #00C7B6 」になっています。

予約販売 App

5-5【 予約販売 App 】予約販売 カラー

予約販売Appで表示される「予約商品」などの色を変更することができます。
初期値は「 #1e88e5 」になっています。

テイクアウト App

5-6【 テイクアウト App 】テイクアウト カラー

テイクアウトAppで表示される「テイクアウト」などの色を変更することができます。
初期値は「 #ff9800 」になっています。

抽選販売 App

5-7【 抽選販売 App 】抽選販売 カラー

抽選販売Appで表示される「抽選商品」などの色を変更することができます。
初期値は「 #5e35b1 」になっています。

メールマガジン App

5-8【 メールマガジン App 】登録フォーム タイトル

メールマガジン登録フォームのタイトルを設定することができます。
初期値は「 NEWSLETTER 」になっています。

登録フォーム テキスト

(任意)メールマガジン登録フォームのテキストを設定することができます。
例：「ショップからのお得な情報やクーポンなどをお送りします。」

その他設定その他の設定項目です。

フッターカスタマイズ

フッターを自由にカスタマイズすることができます。
ONにしたパーツが自動的に最適化されたレイアウトで表示されます。

BASEショップのスクリーンショット

6-1【 フッターカスタマイズ 】 フッター フリースペース ON/OFF

フッター フリースペースの表示ON/OFFを切り替えることができます。
初期状態ではOFFになっています。

タイトル

（任意）フッター フリースペースのタイトルを設定することができます。

テキスト

（任意）フッター フリースペースのテキストを設定することができます。

画像

（任意）フッター フリースペースの画像をアップロードする事ができます。

リンクテキスト

（任意）フッター フリースペースの右下にリンクを設定することができます。

URL

リンクのURLを設定することができます。 「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
BASEショップのスクリーンショット

フッター カレンダー ON/OFF

カレンダーの表示ON/OFFを切り替えることができます。
初期状態ではOFFになっています。

タイトル

カレンダーのタイトルを設定することができます。
初期値は「 営業日カレンダー 」になっています。

マーカーの曜日

マーカーを曜日で一括指定することができます。
マークしたい曜日を『 mon,tue,wed,thu,fri,sat,sun 』の形式でカンマ区切りで設定してください。

「月、水、金」の場合 
mon,wed,fri
「土、日」の場合 
sat,sun

マーカーの指定日

具体的な日付でマーカーを指定することができます。
「12月1日、2日、3日」であれば「12:1,2,3」のように、『 月:日,日,日 』の形式でコロンとカンマ区切りで複数指定可能です。
また、スラッシュ（/）で区切ることで複数の月を指定することもできます。

「1月1日、1月2日、1月3日、12月30日、12月31日」の場合 
1:1,2,3/12:30,31

マーカーの説明

カレンダーの凡例テキストを設定することができます。
初期値は「 休業日 」になっています。
BASEショップのスクリーンショット

フッターに「ショップ情報」を表示 ON/OFF

フッターの「ショップ情報」の表示ON/OFFを切り替えることができます。
初期状態ではONになっています。

フッターに「カテゴリー」を表示 ON/OFF

フッターの「カテゴリー」の表示ON/OFFを切り替えることができます。
初期状態ではOFFになっています。

中カテゴリを表示 ON/OFF

ONにするとフッターの「カテゴリー」が中カテゴリまで表示されます。
OFFにすると大カテゴリのみが表示されます。
初期状態ではOFF（大カテゴリのみ表示）になっています。

フッターに「お支払い方法」を表示 ON/OFF

フッターの「お支払い方法」の表示ON/OFFを切り替えることができます。
初期状態ではONになっています。
表示内容は『 3-3【 お支払い方法の表示 】 』で設定することができます。

フッターに「送料」を表示 ON/OFF

フッターの「送料」の表示ON/OFFを切り替えることができます。
初期状態ではONになっています。
表示内容は『 1-10【 送料表示 】 』で設定することができます。

カテゴリページ設定

カテゴリページに、カテゴリごとに異なるヘッダー画像を表示することができます。
カテゴリページヘッダーは15種類まで設定可能で、1つのヘッダーに対して複数のカテゴリを指定することができます。

例えば「リング」という大カテゴリの下に「シルバー」「ゴールド」「プラチナ」という中カテゴリがある場合、 1種類の『指輪のヘッダー画像』に「リング」「シルバー」「ゴールド」「プラチナ」という複数のカテゴリを一括して指定することが可能であるため、 結果として多数のカテゴリにヘッダー画像を表示することができます。

6-2【 カテゴリページ設定 】 カテゴリページヘッダー ON/OFF

カテゴリページヘッダーのON/OFFを切り替えることができます。
初期状態ではOFFになっています。

カテゴリーページ1 カテゴリID

表示するカテゴリーの「カテゴリID」を設定することができます。
単一のカテゴリーを指定する場合
下記の例のようにカテゴリIDを数字のみで入力してください。
例として、https://vitademo.base.ec/categories/6898972 という1つのカテゴリページにヘッダー画像を表示させたい場合には、
カテゴリIDである「 6898972 」を記述します。
カテゴリIDの詳細は「 カテゴリIDの確認方法 」をご確認ください。

複数のカテゴリーを指定する場合
下記の例のようにカテゴリIDをカンマ区切りで1行にして入力してください。
例として、
https://vitademo.base.ec/categories/6898965
https://vitademo.base.ec/categories/6898980
https://vitademo.base.ec/categories/6898979
https://vitademo.base.ec/categories/6898978
という5つのカテゴリページに同じヘッダー画像を表示させたい場合には、
カテゴリIDをカンマ区切りで「 6898965,6898980,6898979,6898978 」と1行にして記述します。
カテゴリIDの詳細は「 カテゴリIDの確認方法 」をご確認ください。

カンマ「 , 」は半角です。半角ドット「 . 」や全角句読点「 、 」などにならないようご注意ください。

画像

「カテゴリーページ1」に表示する画像をアップロードすることができます。
推奨サイズは「 横1440px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横2880px / 縦800px 」の画像を使用しています。

「カテゴリーページ2」～「カテゴリーページ15」も同様の設定方法となっています。

  • ⇒ カテゴリIDの確認方法

    方法① 管理画面から確認する方法

    1. 「カテゴリ管理App」をインストールしていない場合にはBASE Appsよりインストールしてカテゴリを作成します。
    2. BASE管理画面の左メニューにある「Apps」→「利用中のApps」の「カテゴリ管理」→「一括カテゴリ登録」タブへ進みます。
    （BASEへログインした状態でこちらをクリックして直接開くこともできます。）
    3. 「カテゴリID確認表」で各カテゴリーの「カテゴリID」を確認することができます。

    【具体例】

    下記の例はデモショップの場合であり、ショップごとにカテゴリIDは異なりますのでご注意ください。
    この場合「トップス」のカテゴリIDは「 6898964 」だということが確認できます。

    方法② ショップ画面から確認する方法

    1. 「カテゴリ管理App」をインストールしていない場合にはBASE Appsよりインストールしてカテゴリを作成します。
    2. ブラウザでご自身のショップを開き、設定したいカテゴリーのページへ移動します。
    3. ブラウザのアドレスバーに表示されているURLがカテゴリーページのURLです。
    4. URLの/categories/以降の数字が「カテゴリID」になります。

    ※ご注意
    誤ってBASE管理画面上のプレビュー画面からURLをコピーしないようにご注意ください。
    「https://admin.thebase.in」からはじまるURLは管理画面のURLであり、お客様からはアクセスできないURLです。

    【具体例】

    下記の例はデモショップの「トップス」カテゴリーの場合です。
    表示されているURLが「 https://vitademo.base.ec/categories/6898964 」なので、カテゴリIDは「 6898964 」になります。

    カテゴリ管理Appについてはサポート対象外となります。
    Appsのインストール方法や設定方法についてはBASEへ直接お問い合わせください。

上級者向けの設定

Ex.【上級者向けの設定】独自CSS

オリジナルのスタイルシートを記述することができます。 
p { font-size:14px !important;}
独自スタイルシート(CSS)は知識のある上級者向けの設定です。
CSSについてはサポート対象外となっておりますので、
CSSの記述方法やclass名のご案内等は致しかねますことを予めご了承ください。

独自OGP画像

商品ページ以外のOGP画像をアップロードすることができます。
通常、BASEでは商品ページ以外では「ショップのロゴ画像」が自動的にOGP画像として使用されますが、さらに独自のOGP画像を指定できます。
（商品ページでは従来どおり、商品画像がOGP画像として使用されます。）

OGPの扱われ方はSNS側の仕様よって異なります。
設定した画像はOGP候補となりますが、必ずその画像がOGP画像として反映されることを保障するものではありません。
OGP画像についてはサポート対象外となっておりますことを予めご了承ください。

Webフォントを利用する ON/OFF

デザインよりパフォーマンスを優先する場合には、WebフォントをOFFにすることができます。
OFFにした場合はWebフォントの読み込み/ダウンロードも行われません。
初期状態ではON（Webフォントを利用する）になっています。
よくわからない場合にはONのままでご利用ください。

サポート情報

推奨画像サイズ

Vitaをご利用いただく際の登録する画像の推奨サイズは以下の通りです。
推奨サイズ以外のサイズの画像をご利用いただいても基本的には問題ありませんが、目安としてご参考になさってください。

【ロゴ画像】

お好みのサイズで構いません。
正方形や縦長のロゴの場合、スマホサイトでは表示が小さくなる場合がありますので横長の画像をお勧めします。
ご参考までに、デモショップでは「 横500px / 縦120px 」の画像を使用しています。

【ワンポイントアイコン オリジナル画像】

推奨サイズは「 横50px / 縦50px 」です。横の長さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横50px / 縦50px 」の画像を使用しています。

【カテゴリーメニュー画像】

推奨サイズは「 縦560px 」です。横の長さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横560px / 縦120px 」の画像を使用しています。

【無限スクロールバナー】

推奨サイズは「 縦100px 」です。横の長さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横800px / 縦120px 」の画像を使用しています。

【メインビジュアル】

メインビジュアルをワイド表示にする場合（ワイド表示ON）

「PC用」の推奨サイズは「 横 1920px 」です。
縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横3840px / 縦1728px 」の画像を使用しています。

「スマホ用」の推奨サイズは「 横 840px 」です。
縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横 840px / 縦 1000px 」の画像を使用しています。

メインビジュアルを通常の表示形式する場合（ワイド表示OFF）

「PC用」のスライド画像の推奨サイズは「 横1440px 」です。
縦の高さはお好みのサイズで構いません。

「スマホ用」のスライド画像の推奨サイズは「 横840px 」です。
縦の高さはお好みのサイズで構いません。

【イメージスライダー】

推奨サイズは「 横600px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横800px / 縦500px 」の画像を使用しています。
デザインの仕様上、「スライド 1 画像」～「スライド 6 画像」の6枚すべての画像を設定することを推奨します。
また、すべての画像は同じサイズにすることを推奨します。

【フローティングバナー】

推奨サイズは「 横560px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横790px / 縦340px 」の画像を使用しています。

【ピックアップ】

推奨サイズは「 横600px 」です。縦の高さはお好みのサイズで構いません。
デザインの仕様上、全ての画像サイズを合わせることをお勧めします。
ご参考までに、デモショップでは「 横800px / 縦400px 」の画像を使用しています。

【ランキング】

推奨サイズは「 横600px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横600px / 縦600px 」の画像を使用しています。

【おすすめアイテム】

推奨サイズは「 横800px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1600px / 縦1000px 」の画像を使用しています。

【トップページバナー】

推奨サイズは「 横1440px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1440px / 縦648px 」の画像を使用しています。

【サイドバナー】

推奨サイズは「 横560px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横600px / 縦315px 」の画像を使用しています。

【商品ページバナー】

推奨サイズは「 横800px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1200px / 縦1600px 」の画像を使用しています。

【カテゴリページヘッダー】

推奨サイズは「 横1440px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横2880px / 縦800px 」の画像を使用しています。

【フッター フリースペース 画像】

推奨サイズは「 横800px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1000px / 縦450px 」の画像を使用しています。

【アバウトページ画像】

縦長/横長に関わらずお好みのサイズで構いません。
ご参考までに、デモショップでは「 横3840px / 縦1728px 」の画像を使用しています。

【アバウト フリースペース 画像】

縦長/横長に関わらずお好みのサイズで構いません。
ご参考までに、デモショップでは「 横400px / 縦370px 」の画像を使用しています。

【商品画像】

推奨サイズは「 横1200px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1200px / 縦1600px 」の画像を使用しています。

TIPS （設定のヒント）

  • （ご参考用）デモショップの設定内容

    デモショップ1の設定内容をこちらからPDFにてご確認いただけます。

  • テキストエリアで改行や段落を入れる方法

    テーマ設定のテキストエリアではHTMLが利用可能です。
    「 <br> 」と入力すると改行され、「 <p> ～ </p> 」で囲むと段落になり、「 <b> ～ </b> 」で囲むと太字になります。

    
<p>
<b>【営業時間】</b>
<br>
11:30-15:00（L.O. 14:30）
<br>
18:00-23:00（L.O. 22:00）
</p>

<p>
<b>【定休日】</b>
<br>
日曜日・祝日
<br>
神戸市中央区山本通1-1
</p>
    以下のように表示されます。
    上記以外の自由なHTMLを記述することも可能です。
    但し、HTMLについてはサポート対象外となっておりますので、HTMLの記述方法や記述内容のご案内等は致しかねますことを予めご了承ください。
    また、閉じタグの漏れや記述内容の誤りによってショップ全体の表示に影響が出る場合がありますので、
    HTMLを記述される場合には十分に注意して設定を行ってください。

  • 「FAQ」「お買い物ガイド」「はじめにお読みください」など任意のコンテンツを作る方法

    BASEには自由な内容のページを作成するための「ページ追加 App」がありますが、
    「ページ追加 App」は無料テーマのみが対象のAppsとなっているため、有料テーマではご利用いただくことができません。

    そこで、任意のコンテンツを追加するための代替案として下記2つの方法をご提案いたします。

    ①「Blog App」を利用する方法

    ▼ Blog App
    https://apps.thebase.in/detail/43

    「Blog App」を利用することでブログ記事として自由な内容を記載したページを作成することが可能です。

    具体例として、デモショップではブログ記事として「 はじめにお読みください 」のページを作成しています。
    ⇒ デモショップ「 はじめにお読みください 」
    （トップページの「バナー」「ピックアップ」「外部リンク」等からその記事ページへリンクさせるイメージとなります。）

    テーマ設定の『5-1【 Blog App 】』で、ブログをメニューから非表示にしたり、ブログの日付を非表示にすることで、常設コンテンツのように見せることもできます。

    ※「Blog App」をはじめとしたBASE Appsのインストール方法や設定方法についてはBASEへ直接お問い合わせください。

    ② Vitaのテーマ機能【 アバウトページ フリースペース 】を利用する方法

    Vitaのテーマ機能を利用して、アバウトページに「FAQ」や「お買い物ガイド」などの自由な内容を2つまで掲載することが可能です。 詳しい設定方法は、オンラインマニュアル「 3-2 アバウトページ フリースペース 」をご覧ください。

    具体例として、デモショップではアバウトページに「 FAQ 」を掲載しています。
    ⇒ デモショップ アバウトページ「 FAQ 」

    トップページのバナー等から「アバウトページ フリースペース」で設定したコンテンツにリンクを貼りたい場合には、

    [ショップURL]/about#[フリースペースタイトル]

    というURLでリンクすることができます。
    例えば、デモショップの場合であれば

    ・ショップURLが「 https://vitademo.base.ec/ 」
    ・フリースペースのタイトルが「 お買い物ガイド 」

    であるため、

    https://vitademo.base.ec/about#お買い物ガイド

    というURLになります。
    同様に、デモショップのもうひとつのフリースペースのURLは

    https://vitademo.base.ec/about#FAQ

    となっています。
    上記をご参考にして、ショップURLやフリースペースタイトルを変更してご利用ください。


  • ショップを公開する前に商品ページを確認する方法

    ショップの準備を進める際、BASE管理画面の「ショップ公開状況」を「公開」にすると商品が購入できる状態になってしまい、「非公開」にするとショップオーナーも商品ページを見ることができなくなります。
    デザイン画面の「プレビュー」でもある程度実際の画面を確認することができますが、バナーやピックアップで設定するために商品ページURLを取得したいような場合、プレビュー画面では確認することができません。

    そこで、ショップの準備中は「公開」した状態で「シークレットEC」でパスワードをかけることをお勧めします。

    ▼ シークレットEC App
    https://apps.thebase.com/detail/12

    実際にショップを公開する際には、「シークレットEC Apps」を無効にすることで、誰でもショップを閲覧できる状態になります。

  • デモショップのように「すべてのアイテム」「ブランドから探す」「価格帯から探す」などのカテゴリを作成する方法

    デモショップでは「トップス」「ボトムス」といった通常のカテゴリに加えて、全商品をまとめた「すべてのアイテム」という大カテゴリを作成しています。 商品は複数のカテゴリに登録できるため、各商品を「すべてのアイテム」と個別カテゴリ（例：「トップス」「ボトムス」など）に設定します。 こうすることで、「すべてのアイテム」を開けば、ショップ内の全商品を一覧表示できる仕組みになります。

    同様に、デモショップでは「ブランドから探す」「価格帯から探す」などの大カテゴリを作成しています。 『カテゴリーメニュー画像』機能を利用してこれらの大カテゴリに見出し的な画像を指定することで、特別なカテゴリも自然な形で見せることが可能です。

    下記に、デモショップ の設定内容のスクリーンショットを掲載していますので、ご参考にしてください。
    （「カテゴリ管理 App」の操作方法や設定方法についてはBASEへ直接お問い合わせください。）


    カテゴリ管理 App
    「トップス」「ボトムス」のような大カテゴリに加えて、「すべてのアイテム」「ブランドから探す」「価格帯から探す」という大カテゴリを作成しています。

    テーマ設定 - カテゴリーメニュー画像
    一番上の「すべてのアイテム」は画像ではなくテキストリンクにするために「カテゴリー 1 画像」は設定していません。
    また、「ブランドから探す」「価格帯から探す」の画像は通常のカテゴリとは異なり、見出し的なデザインの画像を設定しています。

    商品 - 商品編集
    デモショップでは、各商品を「すべてのアイテム」「個別カテゴリ（例：「トップス」「ボトムス」など）」「ブランド」「価格帯」など複数のカテゴリに指定することで、商品への多角的な導線を確保しています。