デモショップ
実際にBASEで開設したショップを「Twinkleのテーマ機能」と「無料のBASE Apps」のみを利用してカスタマイズしています。
Twinkle(トゥインクル)の特徴
美しく洗練されたデザイン
『Twinkle』は印象的なメインビジュアルをはじめとした洗練されたデザインと、
多彩なカスタマイズ機能を兼ね備えたおしゃれなテーマです。
人気テーマがさらに進化
『Twinkle』は人気テーマ『Fortune』の後継テーマとして、美しく洗練された印象はそのままに
多数のカスタマイズ機能が追加されており、ショップ表示速度も大幅に向上しました。
現在『Fortune』をご利用されているショップ様へ『Fortune』をご利用中のショップ様へ
『Fortune』は今後も引き続きご利用いただけますが、
機能やデザインがさらに進化した『Twinkle』へのアップグレードをおすすめします。
ショップの表示速度が大幅に向上
自然な印象のショップリニューアルが可能
顧客に違和感のないショップリニューアルが可能です。
ショップの印象やブランディングを損なわずに機能をアップグレードすることができます。
テーマ移行も簡単
『Fortune』と共通する機能の設定内容は『Twinkle』に移行しても維持されるため、
設定を0からやり直す必要がなく、簡単にテーマ移行することが可能です。
多数の新機能が追加
NEW「おすすめアイテム」表示機能
『Twinkle』ではトップページに「おすすめアイテム」を表示することができます。おすすめ商品を紹介するだけでなく、ショップのコンセプトなどを紹介する目的にも利用可能です。

NEW フローティングバナー機能
『Twinkle』ではトップページの固定位置に追従するフローティングバナーを設置することができます。
NEW 最近チェックした商品(閲覧履歴)機能
『Twinkle』ではトップページと商品ページに「最近チェックした商品(閲覧履歴)」を表示することができます。
NEW ブログ最新記事表示機能
『Twinkle』ではトップページに「ブログApps」の記事を4件まで自動的に取得して表示可能です。
NEW Instagram
『Twinkle』では“SnapWidget” のような外部サービスを利用してInstagramの埋め込みが可能です。
NEW 商品ページバナー機能
『Twinkle』では全ての商品ページに共通するバナーを設定することができます。
NEW 商品一覧の画像を正方形に切り抜くオプションが利用可能
『Twinkle』では商品画像を正方形に自動トリミングすることが可能です。商品の写真サイズがバラバラの場合でも加工する必要なく、統一感のあるレイアウトを実現します。
「商品ページでは縦長で見せたいけれど、トップページでは見やすく正方形にしたい」ということもできます。

UPDATE ピックアップエリアにランキングアイコンを表示可能
『Twinkle』ではピックアップ機能が進化し、ランキングアイコンを表示することができるようになりました。
UPDATE「カートバッジ表示機能」に対応
『Twinkle』ではカートアイコンにカート内の商品数を示すカートバッジが表示されます。また、カートアイコンが追従して常に画面内に表示されるため、ユーザーが購入状況をいつでも確認することができます。

UPDATE 簡単なカラー設定
『Twinkle』ではテーマカラーを「明るい背景用」と「暗い背景用」から選択してワンクリックで簡単に切り替えることができます。(『Fortune』のようにテキストやリンクの色を個別に指定することはできません。)

UPDATE サイドバナーが2枚に増加
『Twinkle』では設定可能な「サイドバナー」が2枚に増加しました。UPDATE 外部リンクが3件までに増加
『Twinkle』では設定可能な「外部リンク」が3件までに増加しました。UPDATE ショップ全体をWebフォント対応
『Twinkle』ではショップ全体がどのような環境でも美しい文字が表示されます。BASEにログインした状態でテーマ購入ページの「プレビュー」からも実際のイメージをご確認いただけます。
直感的な操作で簡単カスタマイズ
『Twinkle』は簡単な設定で自由にカスタマイズすることが可能となっており、
はじめて有料テーマをご利用される方にも最適なテーマです。
全ての設定や機能には分かりやすいオンラインマニュアルもご用意しています。
メインビジュアル
PCではサイドバー以外の画面全体、スマホではファーストビュー全体を覆う印象的なスライダーです。
どんな画面サイズでも最適化されて美しく表示されます。
画像はPC用/スマホ用にそれぞれ5枚まで設定可能です。
(スライダー機能を利用せず画像1枚のみをメインビジュアルとして設定することもできます。)
ワンポイントアイコン
デザインのアクセントとしてワンポイントアイコンを表示することができます。
ショップイメージに応じたアイコンを選ぶことが可能で、アイコンの色も自由に変更することができます。
ワンポイントアイコンが不要な場合は非表示にすることも可能です。
ピックアップ
ピックアップアイテムを4件まで表示することができます。
画像/テキスト/リンクを自由に設定可能で、ランキングアイコンを表示することもできます。
PCでは最大4アイテムが1行で表示され、スマホでは横に2アイテム表示されます。
おすすめアイテム
トップページに「おすすめアイテム」を表示することができます。
画像/見出し/テキスト/リンクボタンを設定することができ、
おすすめ商品を紹介するだけでなく、ショップのコンセプトなどを紹介する目的にも利用可能です。
“SnapWidget” のような外部サービスを利用してInstagramの埋め込みが可能です。
アカウントのリンクボタンを表示させることもできます。
(Instagramの埋め込みコードの取得方法はこちら)
商品ページカスタマイズ
全ての商品ページに共通するバナーを設定することができます。
購入ボタンのカラーを変更することも可能です。
商品ページには「関連商品」と「最近チェックした商品」を表示することができます。
自由なメニュー設定
「HOME」「ABOUT」「BLOG」「CONTACT」などのメニューテキストや、
「CATEGORY」「SHOP INFO」などのタイトルを変更することができます。
任意のタイトルとリンク先を設定できる『外部リンク』も3つまで表示可能です。
商品一覧 アイテム設定
商品画像を正方形に自動トリミングすることが可能です。
商品の写真サイズがバラバラの場合でも加工する必要なく、統一感のあるレイアウトを実現します。
1行の商品説明を表示したり、拡大エフェクトをつけることもできます。
上級者向けオプション機能
知識のある上級者の方は「 独自スタイルシート(CSS)設定 」でCSSを追加記述していただくことも可能です。
初めての方でも簡単にカスタマイズ可能
カスタマイズはBASE管理画面上で簡単に操作できます。
ON/OFFを切り替えたり、テキストを入れたり、色や画像を指定するだけで
どなたでも簡単にオリジナルのショップデザインにしていただけます。
スクリーンショット付きの丁寧で分かりやすいオンラインマニュアルもご用意しています。
詳しくは「オンラインマニュアル(テーマの設定方法)」をご覧ください。
安心の無料アップデート
BASEに新機能が追加された際には、新機能に合わせたテーマの無料アップデートを提供。
アップデートが行われた際には自動的に更新されますので、ご購入後も安心してご利用いただけます。
* BASEの『HTML編集Apps』でテーマを編集している場合には、編集内容を保護する為に自動アップデートは適用されません。
「カスタムテーマ(HTML編集したテーマ)」から「Twinkle」に変更することで、アップデートされた最新版のテーマが適用されます。
各種BASE Appsに対応
セール / レビュー / ブログ / ラベルをはじめとした全てのBASE Appsに対応しています。
HTML編集Appsにも対応しており、Twinkleを改造した独自のショップデザインを構築することも可能です。
* 例外として、「ページ追加 Apps」はデザインマーケットで販売されている全ての有料テーマでご利用いただけません。
実際にBASEで開設したショップを「Twinkleのテーマ機能」と「無料のBASE Apps」のみを利用してカスタマイズしています。
オンラインマニュアル(テーマの設定方法)

『Twinkle(トゥインクル)』は様々なカスタマイズを誰でも簡単に行うことができます。
BASE管理画面の「デザイン」の「テーマ設定」で各種機能の設定を行うことができます。
全体設定ショップ全体(全てのページ)で共通する設定項目です。
カラー設定
1-1.【 カラー設定 】 暗い背景用のテーマカラーを使用 ON/OFF
ON(緑の状態)にすると暗い背景用のテーマカラーとなり、テキスト等が白系に設定されます。
初期状態ではOFF(明るい背景用テーマカラー)になっています。
購入ボタン カラー
初期値は「 #000000 」になっています。
セール価格 / SOLD OUT カラー
初期値は「 #E50F0D 」になっています。
販売期間設定 カラー
初期値は「 #00C7B6 」になっています。
予約販売 カラー
初期値は「 #1e88e5 」になっています。
テイクアウト カラー
初期値は「 #ff9800 」になっています。
抽選販売 カラー
初期値は「 #5e35b1 」になっています。
コミュニティ カラー
初期値は「 #212121 」になっています。
ショップロゴ設定
1-2.【ショップロゴ】PCサイト ロゴ上下の余白(例:40px)
「 40px 」のような形式で入力して下さい。
初期設定は40pxです。
(スマホで閲覧した際には上部メニューの高さの都合上、余白設定は無視されます。)
アイテム設定
1-3.【 アイテム設定 】商品アイテムに1行の「商品説明」を表示 ON/OFF
初期状態ではONになっています。
商品一覧の画像を正方形に切り抜く ON/OFF
ONにすると画像サイズが商品ごとに異なる場合でも統一感のある商品一覧にすることができます。
(商品ページの商品画像はオリジナルの縦横比で表示されます。)
商品一覧の各商品画像の元の縦横比率を維持したい場合にはOFFにしてご利用ください。
初期状態ではOFFになっています。
商品アイテムの画像拡大エフェクト(マウスオーバー時) ON/OFF
OFFにするとマウスオーバーした際にも画像の大きさは変わりません。
初期状態ではONになっています。
トップページに商品一覧を表示する ON/OFF
OFFにするとトップページの商品一覧は非表示になります。
初期状態ではONになっています。
ワンポイントアイコン
1-4.【 ワンポイントアイコン 】ON/OFF
初期状態ではONになっています。
アイコンカラー
初期値は「 #DA0F0F 」になっています。
アイコンタイプ
お好みのアイコンタイプを選択してください。
メニュー設定
1-5.【 メニュー設定 】Homeのタイトル
初期値は「 HOME」になっています。
Categoryのタイトル(カテゴリ管理 Apps)
初期値は「 CATEGORY」になっています。
Informationのタイトル
初期値は「 SHOP INFO 」になっています。
Linkのタイトル
初期値は「 LINK 」になっています。
Aboutのタイトル
初期値は「 ABOUT 」になっています。
Blogのタイトル
初期値は「 BLOG 」になっています。
Contactのタイトル
初期値は「 CONTACT 」になっています。
トップページ商品一覧のタイトル
初期値は「 NEW ARRIVAL 」になっています。
関連商品のタイトル
初期値は「 関連商品 」になっています。
外部リンク1 テキスト
外部リンク1 URL
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
外部リンク2 テキスト
外部リンク2 URL
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
外部リンク3 テキスト
外部リンク3 URL
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
送料表示
1-6.【送料表示】 ON/OFF
初期状態ではOFFになっています。
送料 テキストカラー
初期値は「 #FFFFFF 」になっています。
送料 背景カラー
初期値は「 #000000 」になっています。
送料テキスト
例:「5,000円以上のご購入で送料無料」
補足テキスト
例:「*沖縄・離島は除きます」
サイドバナー
1-7.【 サイドバナー 】① 画像
サイドバナー ① URL
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
【 サイドバナー 】② 画像
サイドバナー ② URL
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
【画像の推奨サイズ】
ご参考までに、デモショップでは「 横600px / 縦400px 」の画像を使用しています。
HOME設定トップページに関連する設定項目です。
メインビジュアル
2-1.【 メインビジュアル 】 ON/OFF
初期状態ではONになっています。
スライド1 画像(PC)
スライド1 画像(スマホ)
PC用の画像と同じ画像を設定していただいても問題ありません。
スマホ用画像が設定されていない場合にはスマホ閲覧時にもPC用画像が表示されます。
スライド2 画像(PC)
(2枚目以降の画像がアップロードされていない場合にはスライダー機能がOFFとなり1枚目の画像のみがメインビジュアルとして表示されます。)
スライド2 画像(スマホ)
PC用の画像と同じ画像を設定していただいても問題ありません。
スマホ用画像が設定されていない場合にはスマホ閲覧時にもPC用画像が表示されます。
「スライド3」~「スライド5」も同様の設定方法となっています。
【画像の推奨サイズ】
ご参考までに、デモショップでは「 横3200px / 縦2160px 」の画像を使用しています。
ご参考までに、デモショップでは「 横 840px / 縦 1500px 」の画像を使用しています。
フローティングバナー
2-2.【フローティングバナー】 ON/OFF
初期状態ではOFFになっています。
フローティングバナーが閉じられた後は10分間再表示しない ON/OFF
ONにすることで一度フローティングバナーが閉じられた後は10分間再表示されなくなります。
10分間再表示されないのは「その端末から再度アクセスした場合のみ」となります。
別の端末やお客様がショップにアクセスした場合には通常通り表示されますのでご安心ください。
初期状態ではOFF(トップページを開くたびに毎回表示)になっています。
フローティングバナー 画像
フローティングバナー リンク
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
【画像の推奨サイズ】
ご参考までに、デモショップでは「 横560px / 縦240px 」の画像を使用しています。
重要なお知らせ
2-3.【重要なお知らせ】 ON/OFF
初期状態ではOFFになっています。
重要なお知らせ テキストカラー
重要なお知らせ 背景色
重要なお知らせ テキスト
重要なお知らせ URL
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください
ピックアップ
2-4.【 ピックアップ 】 ON/OFF
初期状態ではOFFになっています。
ランキングアイコンを表示 ON/OFF
初期状態ではOFFになっています。
ピックアップ タイトル
ピックアップ1 画像
画像の表示サイズは画面サイズに応じて自動的に調整されます。
推奨サイズは「 横640px 」です。縦の高さはお好みのサイズで構いません。
デザインの仕様上、全ての画像サイズを合わせることをお勧めします。
ご参考までに、デモショップでは「 横1200px / 縦900px 」の画像を使用しています。
ピックアップ1 テキスト
ピックアップ1 URL
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
「ピックアップ2」~「ピックアップ4」も同様の設定方法となっています。
トップページバナー
2-5.【 トップページバナー 】 画像
トップページバナーの画像の推奨サイズは「 横1800px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横2400px / 縦480px 」の画像を使用しています。
トップページバナー URL
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
おすすめアイテム
2-6.【 おすすめアイテム 】 ON/OFF
初期状態ではOFFになっています。
おすすめアイテム タイトル
おすすめアイテム 画像
画像の推奨サイズは「 横1200px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1200px / 縦680px 」の画像を使用しています。
テキストを中央寄せ ON/OFF
初期状態ではOFFになっています。
おすすめアイテム 見出し
おすすめアイテム テキスト
おすすめアイテム URL
URLが設定されている場合、自動的にリンクボタンが表示されます。
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
最近チェックした商品
2-7.【 最近チェックした商品 】 ON/OFF
初期状態ではOFFになっています。
「最近チェックした商品」 タイトル
初期値は「 最近チェックした商品 」になっています。
新着情報
2-8.【 新着情報 】 ON/OFF
初期状態ではOFFになっています。
新着情報のタイトル
新着情報 1 日付
ニュース機能として利用する場合には「2025.01.01」や「7月10日」などのように設定してください。
ランキング機能として利用する場合には「人気No.1」などのように設定してください。
新着情報 1 内容
新着情報 1 リンク先
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
「新着情報 2」~「新着情報 3」も同様の設定方法となっています。
2-10.【 Instagram 】 ON/OFF
初期状態ではOFFになっています。
Instagram タイトル
Instagram 埋め込みコード
Instagram アカウント表示 ON/OFF
初期状態ではOFFになっています。
自由なHTMLを記述することで「フリースペース」として利用することもできますが、HTMLについてはサポート対象外となっております。
HTMLの記述方法や記述内容のご案内等は致しかねますことを予めご了承ください。
また、閉じタグの漏れや記述内容の誤りによってショップ全体の表示に影響が出る場合がありますので、
HTMLを記述される場合には十分に注意して設定を行ってください。
ABOUT設定アバウトページに関連する設定項目です。
ABOUT設定
3.【 アバウトページ 】アバウトページ画像
画像は縦長/横長に関わらずお好みのサイズで構いません。
ご参考までに、デモショップでは「 横3000px / 縦1000px 」の画像を使用しています。
アバウトページ ショップ住所
アバウトページ ショップTEL
アバウトページ ショップFAX
アバウトページ ショップ営業時間
アバウトページ ショップ定休日
アバウトページ ショップE-Mail
商品ページ設定商品ページに関連する設定項目です。
商品ページ設定
4-1.【 商品ページ 】「この商品をアプリで見る」ボタンを表示 ON/OFF
初期状態ではONになっています。
商品ページバナー
4-2.【 商品ページバナー 】 画像
商品ページバナーの画像の推奨サイズは「 横900px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横900px / 縦400px 」の画像を使用しています。
商品ページバナー URL
「 https://dolcevivace.com/ 」のような形式でリンク先のURLを入力してください。
Apps設定BASE Appsに関連する設定項目です。
コミュニティApps
5-1.【 コミュニティApps 】コミュニティページ ヘッダー画像
コミュニティページ タイトル
初期値は「 Community 」になっています。
メンバーシップApps
5-2.【 メンバーシップApps 】メンバーシップページのタイトル
初期値は「 メンバーシップ 」になっています。
マイページ/ログインのタイトル
初期値は「 マイページ 」になっています。
メンバーシップApps
5-2.【 メールマガジン登録フォーム 】 タイトル
初期値は「 NEWSLETTER 」になっています。
登録フォーム テキスト
例:「ショップからのお得な情報やクーポンなどをお送りします。」
その他設定その他の設定項目です。
上級者向けの設定
Ex.【上級者向けの設定】独自CSS
p { font-size:14px !important;}
CSSについてはサポート対象外となっておりますので、
CSSの記述方法やclass名のご案内等は致しかねますことを予めご了承ください。
サポート情報
推奨画像サイズ
Twinkleをご利用いただく際の登録する画像の推奨サイズは以下の通りです。
推奨サイズ以外のサイズの画像をご利用いただいても基本的には問題ありませんが、目安としてご参考になさってください。
【ロゴ画像】
お好みのサイズで構いません。
正方形や縦長のロゴの場合、スマホサイトでは表示が小さくなる場合がありますので横長の画像をお勧めします。
ご参考までに、デモショップでは「 横660px / 縦140px 」の画像を使用しています。
【メインビジュアル】
Twinkleのメインビジュアルは、
PCではサイドバー以外の画面全体、スマホではファーストビュー全体を覆う形で、
画面サイズに応じて画像が切り抜かれて表示されます。
Retinaディスプレイを考慮して画像は大きめのものをご用意ください。
(メインビジュアルの画像は「PC用」と「スマホ用」で同じ画像を設定していただいても問題ありません。 )
「PC用」の推奨サイズは「 横 1600px / 縦 1080px 」です。
ご参考までに、デモショップでは「 横3200px / 縦2160px 」の画像を使用しています。
「スマホ用」の推奨サイズは「 横 840px / 縦 1500px 」です。
ご参考までに、デモショップでは「 横 840px / 縦 1500px 」の画像を使用しています。
【フローティングバナー】
推奨サイズは「 横560px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横560px / 縦240px 」の画像を使用しています。
【ピックアップ】
推奨サイズは「 横640px 」です。縦の高さはお好みのサイズで構いません。
デザインの仕様上、全ての画像サイズを合わせることをお勧めします。
ご参考までに、デモショップでは「 横1200px / 縦900px 」の画像を使用しています。
【おすすめアイテム】
推奨サイズは「 横1200px 」です。縦の高さはお好みのサイズで構いません。
デザインの仕様上、全ての画像サイズを合わせることをお勧めします。
ご参考までに、デモショップでは「 横1200px / 縦680px 」の画像を使用しています。
【トップページバナー】
推奨サイズは「 横1800px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横2400px / 縦480px 」の画像を使用しています。
【サイドバナー】
推奨サイズは「 横600px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横600px / 縦400px 」の画像を使用しています。
【商品ページバナー】
推奨サイズは「 横900px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横900px / 縦400px 」の画像を使用しています。
【アバウトページ画像】
縦長/横長に関わらずお好みのサイズで構いません。
ご参考までに、デモショップでは「 横3000px / 縦1000px 」の画像を使用しています。
【商品画像】
推奨サイズは「 横1200px 」です。縦の高さはお好みのサイズで構いません。
ご参考までに、デモショップでは「 横1200px / 縦1200px 」の画像を使用しています。
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を記述される場合には十分に注意して設定を行ってください。
「FAQ」「お買い物ガイド」「はじめにお読みください」など任意のコンテンツを作る方法
BASEには自由な内容のページを作成するための「ページ追加 Apps」がありますが、
「ページ追加 Apps」は無料テーマのみが対象のAppsとなっているため、
Twinkleをはじめとした有料テーマではご利用いただくことができません。
そこで、自由な内容のページを追加するための代替案として「Blog App」を利用する方法をご提案いたします。
▼ Blog App
https://apps.thebase.in/detail/43
「Blog App」を利用することでブログ記事として自由な内容を記載したページを作成することが可能です。
具体例として、デモショップではブログ記事として「 お買い物ガイド 」のページを作成しています。
⇒ デモショップ ブログ「 お買い物ガイド 」
(トップページの「バナー」「ピックアップ」「外部リンク」等からその記事ページへリンクさせるイメージとなります。)
※「Blog App」をはじめとしたBASE Appsのインストール方法や設定方法についてはBASEへ直接お問い合わせください。
ショップを公開する前に商品ページを確認する方法
ショップの準備を進める際、BASE管理画面の「ショップ公開状況」を「公開」にすると商品が購入できる状態になってしまい、「非公開」にするとショップオーナーも商品ページを見ることができなくなります。
デザイン画面の「プレビュー」でもある程度実際の画面を確認することができますが、バナーやピックアップで設定するために商品ページURLを取得したいような場合、プレビュー画面では確認することができません。
そこで、ショップの準備中は「公開」した状態で「シークレットEC」でパスワードをかけることをお勧めします。
▼ シークレットEC App
https://apps.thebase.com/detail/12
実際にショップを公開する際には、「シークレットEC Apps」を無効にすることで、誰でもショップを閲覧できる状態になります。
よくある質問
Twinkle(トゥインクル)に関するよくあるお問い合わせとその回答です。
テーマについて
- 有料テーマの利用は初めてなのですが、設定やカスタマイズは私にもできますか?
カスタマイズはBASE管理画面上で簡単に操作できます。
自由にカスタマイズしていただけるようにたくさんの設定項目をご用意しておりますが、
どれも「ON/OFFを切り替える」「テキストを入れる」「色を選ぶ」「画像を選ぶ」などの簡単な設定になっています。
どなたでも簡単にオリジナルのショップデザインにしていただけます。詳しくは「オンラインマニュアル(テーマの設定方法)」をご覧ください。
- 本当にデモショップのようなデザインになるのですか?
- 設定する画像の推奨サイズを教えてください。
Twinkleの各機能の推奨画像サイズは「 推奨画像サイズ 」をご覧ください。
- 対応している「BAES Apps」を教えてください。
Twinkleは「ページ追加 Apps」を除く全てのBASE Appsに対応しています。
「ページ追加 Apps」は無料テーマのみが対象のAppsとなっているため、
Twinkleをはじめとした有料テーマではご利用いただくことができません。ページ追加 Apps
「ページ追加 App」は、最新のショップデザイン機能利用時の、オフィシャルテーマのみが対象です。
BASEデザインマーケットで販売しているデザイナーズテーマ、および「HTML編集 App」で作成されたカスタムテーマには、現在対応しておりません。「ページ追加 Apps」以外のBASE Appsは全て利用可能となっておりますのでご安心ください。
▼ BASE Apps 一覧
https://apps.thebase.in/
※各種BASE Appsのインストール方法や設定方法についてはBASEへ直接お問い合わせください。
「ページ追加 App」を使わずにページを追加するための代替方法については、すぐ下の「ページを追加したいのですがどうすればいいですか?」をご覧ください。
- ページを追加したいのですがどうすればいいですか?
BASEには自由な内容のページを作成するための「ページ追加 Apps」がありますが、
「ページ追加 Apps」は無料テーマのみが対象のAppsとなっているため、
Twinkleをはじめとした有料テーマではご利用いただくことができません。そこで、自由な内容のページを追加するための代替案として「Blog App」を利用する方法をご提案いたします。
▼ Blog App
https://apps.thebase.in/detail/43
「Blog App」を利用することでブログ記事として自由な内容を記載したページを作成することが可能です。
具体例として、デモショップではブログ記事として「 お買い物ガイド 」のページを作成しています。
⇒ デモショップ ブログ「 お買い物ガイド 」
(トップページの「バナー」「ピックアップ」「外部リンク」等からその記事ページへリンクさせるイメージとなります。)※「Blog App」をはじめとしたBASE Appsのインストール方法や設定方法についてはBASEへ直接お問い合わせください。
- 「FAQ」「お買い物ガイド」「はじめにお読みください」などを掲載する方法を教えてください。
BASEには自由な内容のページを作成するための「ページ追加 Apps」がありますが、
「ページ追加 Apps」は無料テーマのみが対象のAppsとなっているため、
Twinkleをはじめとした有料テーマではご利用いただくことができません。そこで、自由な内容のページを追加するための代替案として「Blog App」を利用する方法をご提案いたします。
▼ Blog App
https://apps.thebase.in/detail/43
「Blog App」を利用することでブログ記事として自由な内容を記載したページを作成することが可能です。
具体例として、デモショップではブログ記事として「 お買い物ガイド 」のページを作成しています。
⇒ デモショップ ブログ「 お買い物ガイド 」
(トップページの「バナー」「ピックアップ」「外部リンク」等からその記事ページへリンクさせるイメージとなります。)※「Blog App」をはじめとしたBASE Appsのインストール方法や設定方法についてはBASEへ直接お問い合わせください。
- HTML編集Appsを利用して購入したテーマを改造することはできますか?
可能です。
ご購入いただいたテーマをBASE管理画面の「デザイン」で適用した状態にてHTML編集Appsを利用することで、
Twinkleを元にしたオリジナルのショップデザインを構築していただくことが可能です。
HTML編集Appsの操作方法や改造方法はサポート対象外となりますことについては予めご了承ください。また、BASEに新機能が追加された際などには、新機能に合わせたテーマの無料アップデートをさせていただきますが、
HTML編集Appsを利用している場合には、編集内容を保護する為に自動では更新されません。
その際には手動でアップデート内容を適用していただく必要があります。HTML編集Appsを利用してテーマを改造している場合には、現在選択されているテーマが「カスタムテーマ」となっています。
「Twinkle」テーマを選択していただくことでアップデートが適用された最新の状態のテーマとなりますので、
改めてHTML編集Appsを利用してオリジナルの改造/編集を行ってください。 - テーマのアップデートはありますか?
BASEに新機能が追加された際などには、新機能に合わせたテーマの無料アップデートをさせていただきます。
アップデートが行われた際には、ご購入いただいたテーマも自動的に更新されますので安心してご利用いただけます。
BASEの『HTML編集Apps』でテーマを編集している場合には、編集内容を保護する為に自動アップデートは適用されません。
「カスタムテーマ(HTML編集したテーマ)」から「Twinkle」に変更することで、アップデートされた最新版のテーマが適用されます。
「メインビジュアル」について
- メインビジュアルを全画面にすると画像が見切れてしまいます。
Twinkleのメインビジュアルは、PCではサイドバー以外の画面全体、
スマホではファーストビュー全体を覆う形で、画面サイズに応じて画像が切り抜かれて表示されます。画面サイズはPCやスマホごとに異なり、画像の縦横比率を保ったまま画像全体を全画面に表示することは不可能であるため、画像の上下左右の余った部分(縦横比率を維持した場合に画面サイズからはみ出る部分)が切り抜かれる仕様になっています。
メインビジュアル画像内において、テキスト等の見切れては困る部分は中央寄りに配置してください。メインビジュアルの推奨画像サイズは「 推奨画像サイズ 」をご覧ください。
「Instagram」について
- Instagramを埋め込みたいのですがどうすればいいですか? / 『埋め込みコード』の取得方法を教えてください。
Instagramの埋め込み方法については「 Instagramの埋め込み方法 」をご確認ください。
(外部サービスについてはサポート対象外となっております。個別のお問い合わせに対しての回答は致しかねますことを予めご了承ください。)
「最近チェックした商品」について
- 「最近チェックした商品」に何も表示されません。
「最近チェックした商品」はユーザーごとの商品ページの閲覧履歴となっています。
はじめてショップを訪れた場合や、ひとつも商品を見ていない状態では何も表示されません。
いくつか商品を見た後にはその商品が「最近チェックした商品」に表示されます。
トラブルシューティング
- デザイン画面のプレビューでショップのレイアウトが崩れて見えます。
デザイン画面の右側に表示される「プレビュー」は、左側に設定メニューが表示されているため通常のブラウザ幅よりも狭くなっているため、意図しない改行が入るなど一部のレイアウトが崩れて見える場合があります。
ほとんどの場合、実際のショップのレイアウトは崩れませんのでご安心ください。
レイアウトが崩れて見える場合には、右上の「プレビュー」をクリックした際の大きなプレビューやブラウザで見た実際のショップ画面もご確認ください。 - イメージスライダーやバナー、ピックアップ等の設定を行ってもサイトに表示されません。
イメージスライダーやバナー、ピックアップ等の機能を設定しても表示されない場合は、その項目の表示設定がOFFになっている可能性があります。
ON/OFFの切替ができる項目についてはOFF(グレーの状態)からON(緑の状態)に切り替わっているかご確認ください。 - テキストを入力する際に改行ができません。
テーマ設定のテキストエリアでは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を記述される場合には十分に注意して設定を行ってください。 - デザイン編集画面で設定した内容がショップに反映されません。
1. ご確認いただいている端末のブラウザにキャッシュが残っているために最新の情報が取得できていない可能性があります。
まずは、ブラウザのキャッシュを削除してから再度ショップを確認することをお試しください。2. ブラウザのキャッシュを削除しても設定内容が反映されない場合、
一時的にBASEのデータサーバとの通信が正常に行われていないために、設定内容が保存されていない可能性があります。
(この現象はテーマではなくBASEのシステム側の問題となりますので、利用しているテーマに関わらず起こりうる現象となります。)【 解決方法 】
一旦、設定しようとしている項目を空欄にした状態で「保存」を押して「終了」してBASE管理画面のトップに戻ります。
(設定しようとしている項目を空欄にしても「保存」がクリックできる状態にならない時は、別の項目のON/OFFを切り替えるなどして「保存」ができるようになるかお試しください。)次に、再度BASE管理画面のトップからデザイン編集画面に進んで上記項目が正常に空欄として保存されていることをご確認ください。
その状態で改めてその項目を設定して「保存」→「終了」としていただき、正常にデータが更新されていることをお確かめください。
(通常、設定は複数を同時に行っていただけますが、うまくいかない場合には1項目ずつ「設定」→「保存」→「終了」を繰り返してください。)また、テキストエリア形式の設定項目において正常にデータが保存されない(「保存」が押せない)場合には、
入力する際にコピーペーストするのではなく、空欄の状態から手動でテキストを入力する形で記述することもお試しください。上記の方法でもうまくいかない場合には、BASE側のサーバーに一時的な問題が生じている可能性がありますので、
お手数ですがしばらく時間をおいてから再度お試しください。 - デザイン編集画面で「保存」ボタンが押せません。(設定内容がプレビューに反映されません。)
一時的にBASEのデータサーバとの通信が正常に行われていないために、
設定内容がBASEのシステム側に反映されず「保存」ボタンが押せなくなっている可能性があります。
(この現象はテーマではなくBASEのシステム側の問題となりますので、利用しているテーマに関わらず起こりうる現象となります。)【 解決方法 】
設定しようとしている項目を空欄にした状態(またはON/OFFを切り替えた状態)にして「保存」ができるようになるかお試しください。
それでも「保存」がクリックできる状態にならない時は、別の項目のON/OFFを切り替えるなどして「保存」できる状態になるかご確認ください。「保存」ができる状態になったら一度そのまま「保存」→「終了」していただき、正常にデータが更新されていることをお確かめください。
その後、改めてデザイン画面にて設定を続けてください。
(通常、設定は複数を同時に行っていただけますが、うまくいかない場合には1項目ずつ「設定」→「保存」→「終了」を繰り返してください。)また、テキストエリア形式の設定項目において正常にデータが保存されない(「保存」が押せない)場合には、
入力する際にコピーペーストするのではなく、空欄の状態から手動でテキストを入力する形で記述することもお試しください。上記の方法でもうまくいかない場合には、BASE側のサーバーに一時的な問題が生じている可能性がありますので、
お手数ですがしばらく時間をおいてから再度お試しください。 - テーマが自動的にアップデートされないのですが、どうすればいいですか?
通常、アップデートが行われた際にはご購入いただいたテーマも自動的に更新されますが、
HTML編集Appsを利用している場合には、編集内容を保護する為に自動では更新されません。
その際には手動でアップデート内容を適用していただく必要があります。HTML編集Appsを利用してテーマを改造している場合には、現在選択されているテーマが「カスタムテーマ」となっています。
これはご購入いただいたテーマを元にしたオリジナルの別のテーマとして保存されているためです。
「Twinkle」テーマを選択していただくことでアップデートが適用された最新の状態のテーマとなりますので、
改めてHTML編集Appsを利用してオリジナルの改造/編集を行ってください。
お問い合わせ
【 Twinkle(トゥインクル)】に関するお問い合わせは下記のメールフォームよりお問い合わせください。
テーマの設定に関するお問い合わせの際には、事前に「オンラインマニュアル」や「よくある質問」をご確認ください。
お問い合わせへの対応は通常2営業日以内に行っております。
場合によってはお時間を頂く場合があります事を予めご了承ください。
デザインテーマ一覧
Dolce & Vivaceでは豊富なBASEデザインテーマを取り扱っています。
ショップのイメージに合わせた理想のテーマがきっと見つかります。
有料カスタマイズ
テーマはご購入時の状態でも多彩なカスタマイズ機能を備えていますが、
さらにオリジナルのカスタマイズをご希望の方は「BASEテーマの有料カスタマイズサービス」をご検討ください。
カスタマイズ対応はTwinkleをはじめとした Dolce & Vivace のテーマのみを対象とさせていただいております。
(BASEデザインマーケット内の他社様が販売しているテーマのカスタマイズ依頼はお引き受け致しかねます。)