BASE管理画面→デザイン編集→画面左側「ショップロゴ」からサイトのロゴを設定できます。

ロゴ画像を使用する

ONにすると「ロゴ画像アップロード」が表示され、任意の画像をアップロードして使用できるようになります。
OFFの場合は、「ロゴタイトル」に任意の文字を入力し、「カラー」から文字色を調整することができます。
※ このテーマはロゴに画像を使うことを強く推奨します。テキストをロゴとして使う場合は、10文字程度の短い文言にしてください。11文字以上の場合は省略表示される場合があります。

オリジナルロゴを作成

「ショップロゴ作成App」をインストールしている場合は「オリジナルロゴを作成」と表示され、自分でロゴ画像を簡単に作ることができます。

※「ショップロゴ作成App」の詳細についてはBASE Appsのページからお調べください。

BASE管理画面→デザイン編集→画面左側「背景」からサイトの背景を設定できます。

カラーから選ぶ

好きな色を選んで指定することで背景色が変更されます。

パターンから選ぶ

BASEが用意しているパターン画像から好きなものを選択することでパターン画像が背景に設定されます。
「+」ボタンから任意の背景画像をアップロードして設定することも可能です。
「背景画像を繰り返す」をONにすると画像を繰り返し表示します。
OFFにすると画像を画面固定表示します。

【全体】テキストカラー

全体の文字色を一括で設定できます。
具体的には「背景設定」で設定した背景色の上に載る文字の色。

【全体】キーカラー

背景色以外の背景が設定できる箇所の色や、ボタンの色を一括で設定できます。
具体的には、下記の箇所。
・TOPページ メインビジュアル ボタン背景色
・TOPページ BlogAppsの記事固定表示
・TOPページ ABOUTエリア 画像の背景装飾
・各種ボタンのホバー時の色
・下層ページ上部、タイトル部分の背景色
・カテゴリーページ 子カテゴリ一覧ボタンの背景色
・商品ページ 購入ボタン（※別項目で個別設定可能）

個別に変更できる箇所もありますので、細かく変更したい場合は項目ごとに変更できるか確認をお願いします。

【全体】キーカラー上の文字

上記キーカラーで背景色を変えた箇所の上に載る文字の色

【全体】フォント（日本語）

全体の日本語フォントを下記の中から設定できます。
・デフォルト明朝体
・デフォルトゴシック体
・Noto Sans JP（角ゴシック体）
・Noto Serif JP（明朝体）
・M PLUS Rounded 1c（丸ゴシック体）
・Zen Old Mincho（明朝体）
・BIZ UDPMincho（明朝体）
・BIZ UDPGothic（角ゴシック体）

【全体】フォント（英語）

全体の英語フォントを下記の中から設定できます。
・日本語と同じ ・Jost
・Montserrat
・Lato
・Roboto Condensed
・Oswald
・Merriweather
・Playfair Display

【見出し】フォント（日本語／英語）

TOPページメインビジュアルのタイトル、下層ページのページタイトル、各エリアの見出しのフォントを変更できます。
変更できるフォントの種類は全体のフォントと同じです。

【見出し】文字の太さ

見出しの文字の太さを5段階で調整できます。
・極細
・極
・普通
・太
・極太
※すべての種類のフォントで極細〜極太まで使えるわけではありませんので、フォントによっては普通と太しか反映されない、といった場合があります。
※メインビジュアルのタイトルは「【メインビジュアル】タイトル：文字の太さ」が優先されます。

【見出し】文字スタイル

斜体を選ぶと文字スタイルを斜体に変更できます。
※メインビジュアルのタイトルは「【メインビジュアル】タイトル：文字スタイル」が優先されます。

PC・スマホそれぞれでヘッダー周りの配色などの設定ができます。

【ヘッダー】画面上部に固定する

ONにするとヘッダーを画面上部に固定して追従させます。

【ヘッダー】文字色（スマホ）

スマホ表示時のヘッダーエリアの文字色を変更できます。

【ヘッダー】背景色（スマホ）

スマホ表示時のヘッダーエリアの背景色を変更できます。
空欄にすると透明になります。

【ヘッダー】文字色（PC）

PC表示時のヘッダーエリアの文字色を変更できます。

【ヘッダー】背景色（PC）

PC表示時のヘッダーエリアの背景色を変更できます。
※スマホと違って空欄にしても透明にできません。ご注意ください。

【スマホメニュー】文字色

スマホ表示時にヘッダー右上の三本線のメニューボタンを押すと表示されるメニューの文字色を設定できます。

【スマホメニュー】背景色

スマホメニューの背景色色を設定できます。

【スマホメニュー】バナー

スマホメニュー下部にバナーを設置できます。
推奨サイズ：横750px以上

【スマホメニュー】バナーURL

バナーにリンク先を設定できます。

【PCドロップダウンメニュー】文字色

PC表示時に、カテゴリ管理App・メンバーシップAppをご利用の場合に、メニューにそれぞれ「CATEGORY」「MEMBERSHIP」と表示され、マウスオーバーするとその詳細リンクが表示されるドロップダウンメニューが表示されます。その文字色を設定できます。
※大カテゴリ（白枠の箇所）の色は変更できません。

【PCドロップダウンメニュー】背景色

PCドロップダウンメニューの背景色を設定できます。
※大カテゴリ（白枠の箇所）の色は変更できません。

フッター周りの配色やコンテンツの設定ができます。

【フッター上】画像

フッターの上のGoogleマップ埋め込みエリアのすぐ上に画像を設置できます。
デモショップでは大きめのロゴを設置していますが、ロゴ以外の画像も置けます。

【フッター上】GoogleMap埋め込みコード

フッターすぐ上にGoogleMapを埋め込むことができます。
GoogleMapで発行される埋め込みコードを入力します。
Googleマップ→共有→地図を埋め込むで表示されるHTMLコードをコピーして貼り付けます。

GoogleMapをモノクロにする

ONにすると、埋め込んだマップにフィルターをかけてモノクロ表示にします。

【フッター】文字色

フッターの文字色を設定できます。

【フッター】背景色

フッターの背景色を設定できます。

【フッター】店舗情報を表示

フッターに簡易な店舗情報を表示できます。
ONにすると表示、OFFにすると非表示になります。

【フッター】店舗情報：画像

店舗情報の先頭に表示する画像を設定できます。

【フッター】店舗情報：タイトル

店舗名などを記載できます。

【フッター】店舗情報：内容

営業時間や電話番号、住所、定休日など簡易な情報を記載できます。
簡潔にまとまった情報を載せるのにおすすめです。

【フッター】送料についてを表示

送料についての情報を表示できます。
ONにすると表示、OFFにすると非表示になります。

【フッター】送料について：サブタイトル

送料表示エリアのタイトルすぐ上に小さい文字でサブタイトルを付けることができます。

【フッター】送料について：タイトル

「全国送料無料」「全国一律800円」などの送料についてのコピーを掲載できます。
※文字色・背景色は変更できません。

【フッター】送料について：補足

送料について、補足説明があればこちらに記載できます。

【フッター】お支払い方法についてを表示

お支払い方法についてエリアを表示できます。
ONにすると表示、OFFにすると非表示になります。

【お支払い方法】各種

BASE対応の決済方法各種を表示できます。
それぞれONにすると表示、OFFにすると非表示になります。

【フッター】バナー

フッター下部にバナー画像を設置できます。

【フッター】バナーURL

フッター下部のバナーにリンク先を設定できます。

【商品・ブログ一覧】サムネイルの横縦比に合わせて画像をトリミングする

ONにすると商品一覧・ブログ一覧のサムネイル画像の比率を統一して並べることができます。

【商品・ブログ一覧】サムネイルの横縦比

サムネイル画像の比率を設定できます。
・1:1
・3:2
・4:3
・2:3
・3:4
※元の画像の比率と合わないものは設定した比率にトリミングされるので、画像の端が途切れて表示される場合があります。

TOPページの最上部メイン画像を設置できるエリアの各種設定です。

【TOPページ】メインビジュアルを表示

TOPページのメインビジュアルの表示／非表示を切り替えます。

【メインビジュアル】スマホ表示時にヘッダーと重ねる

ONにするとスマホ表示時にヘッダーと重なるように表示します。
OFFにするとヘッダーと重ならないので画像がすべて表示されます。
デモショップはヘッダーを透明にして重ねています。

【メインビジュアル】PC画像（推奨サイズ：横2880×縦1620px）

TOPページのPC表示時のメイン画像を設定できます。
画像の推奨サイズ：横2880×縦1620（px）

【メインビジュアル】スマホ画像（推奨サイズ：横750×縦900px）

TOPページのスマホ表示時のメイン画像を設定できます。
画像の推奨サイズ：横750×縦900（px）
※スマホ用の画像を設定する場合は必ずPC用の画像を合わせて設定してください。スマホ用だけ設定しても反映されません。

【メインビジュアル】文字色

メインビジュアル上に見出しの文字色を変更できます。

【メインビジュアル】背景色

メインビジュアルエリアの背景色を設定できます。
画像が設置されていない場合や、透過画像の場合に使えます。

【メインビジュアル】タイトル

メインビジュアル上に見出しを設定できます。

【メインビジュアル】タイトル：文字サイズ

見出しの文字サイズを3段階で変更できます。

【メインビジュアル】タイトル：文字スタイル

見出しの文字スタイルを斜体に変更できます。
※全体設定の「【見出し】文字スタイル」よりもこちらの設定が優先されます。

【メインビジュアル】タイトル：文字の太さ

見出しの文字の太さを5段階で調整できます。
・極細
・極
・普通
・太
・極太
※すべての種類のフォントで極細〜極太まで使えるわけではありませんので、フォントによっては普通と太しか反映されない、といった場合があります。
※全体設定の「【見出し】文字の太さ」よりもこちらの設定が優先されます。

【メインビジュアル】ボタンを表示

メインビジュアル上にボタンを2つ表示できます。
ONにすると表示、OFFにすると非表示になります。

【メインビジュアル】ボタン1〜2：リンク先URL

ボタンのリンク先URLを設定できます。

【メインビジュアル】ボタン1〜2：テキスト

ボタンのテキストを設定できます。

【メインビジュアル】ボタン1〜2：文字色

ボタンの文字色を設定できます。

【メインビジュアル】ボタン1〜2：背景色

ボタンの背景色を設定できます。

Blog Appを使用して記事を投稿する際、「この記事を固定にする」にチェックを入れると各記事リストの先頭に固定記事が表示され、TOPページのメイン画像下にテキストリンクで記事が固定表示されます。
メイン画像がない場合は最上部になります。

【TOPページ】ブログ固定記事：文字色

ブログ固定記事の文字色を設定できます。
デフォルトはキーカラー上の文字と同じになっています。

【TOPページ】ブログ固定記事：背景色

ブログ固定記事の背景色を設定できます。
デフォルトはキーカラーと同じになっています。

TOPページ メイン画像の下にバナーを3枚まで設置できます。

【TOPページ】バナーエリアを表示

ONにすると表示、OFFにすると非表示になります。

【TOPページ】バナーエリア背景色

バナーエリアの背景色を変更できます。

【バナー1〜2】画像

画像の推奨サイズ：横450px以上
デモショップは横450×縦169（px）

【バナー1〜2】リンク先URL

バナーにリンク先を設定できます。

TOPページ ピックアップエリアとして、画像とテキストのリンクを5つまで設置できます。

【TOPページ】ピックアップエリアを表示

ONにすると表示、OFFにすると非表示になります。

【ピックアップ】見出し

ピックアップエリアの見出しを設定できます。

【ピックアップ】背景色

ピックアップの背景色を設定できます。
※1つずつ個別ではなく、一括で設定されます。

【ピックアップ1〜5】リンク先URL

リンク先URLを設定できます。

【ピックアップ1〜5】タイトル

リンクのタイトルを設定できます。

【ピックアップ1〜5】画像

背景画像を設定できます。
推奨サイズ：横600×縦800（px）
比率が3/4の画像がピッタリはまります。

TOPページ ABOUTページの導線エリアを設置できます。

【TOPページ】ABOUTエリアを表示

ONにすると表示、OFFにすると非表示になります。

【ABOUTエリア】タイトル

ABOUTエリアの見出しを設定できます。

【ABOUTエリア】説明

ABOUTエリアの説明を設定できます。

【ABOUTエリア】画像

ABOUTエリアの画像を設定できます。
推奨サイズ：横900px以上
デモサイトでは横900px縦450pxです。

【ABOUTエリア】ボタンを表示

ONにするとABOUTページへのリンクボタンを表示します。

TOPページにカテゴリ商品一覧を表示できます。
表示は横スクロール形式になります。
最大3カテゴリまで表示でき、商品の表示件数は1カテゴリーにつき最大24件、並び順は新着順になります。

【TOPページ】カテゴリ商品一覧エリアを表示

ONにすると表示、OFFにすると非表示になります。

【カテゴリ1〜3】カテゴリ名

表示するカテゴリ一覧の上に見出しを付けられます。
空欄にすると非表示になります。

【カテゴリ1〜3】カテゴリID

表示したいカテゴリのIDを入力します。

【カテゴリIDの確認方法】

１、BASE管理画面の「Apps」から「カテゴリ管理」へ進みます。
２、左側メニューの「一括カテゴリ登録」へ進みます。
３、「カテゴリID確認表」の「カテゴリID」から確認することができます。

【カテゴリ1〜3】MOREボタンを表示（カテゴリ一覧ページへのリンク）

一覧の下にカテゴリページへリンクを表示します。

TOPページにセールAppでセール価格を設定している商品の一覧を表示できます。
表示は横スクロール形式になります。
表示件数は最大6件、並び順は新着順になります。

【TOPページ】セール商品一覧エリアを表示

ONにすると表示、OFFにすると非表示になります。

TOPページにBlog Appで投稿した記事の一覧を表示できます。
表示件数は最大10件、並び順は新着順になります。
配色は変更できません。

【TOPページ】ブログ一覧エリアを表示

ONにすると表示、OFFにすると非表示になります。

【ブログ一覧】見出し

見出しを変更できます。
デフォルトはBLOGとなっています。

【ブログ一覧】最大記事数

表示するブログ記事の上限を3~10件で設定できます。

TOPページにSauce by SNPTを使ってInstagramのフィードを埋め込み表示できます。

【TOPページ】Instagram埋め込みエリアを表示（Sauce by SNPT）

ONにすると表示、OFFにすると非表示になります。

【Instagram】Sauce by SNPTのコード

Sauce by SNPTで取得した埋め込みコードを入力します。

Sauce by SNPTの埋め込みコード取得方法

事前準備

Sauce by SNPTを使うと、Instagramアカウントと連携してフィードを埋め込むことが可能になります。
使い始めるためには、アカウント登録の操作以外でお持ちのInstagramやFacebookアカウントでいくつか設定が必要になります。

• Facebookページ（Instagramと連携するためのページ）
• Instagramのプロアカウント切り替え（ビジネス or クリエイター）
• FacebookページとInstagramのプロアカウントの連携

少し前は個人のInstagramのアカウントだけ持っていればそれだけで連携可能でしたが、現在はFacebookページと連携しているプロアカウントでないと使えなくなっている様です。そのため先にこちらの手順をすませておくとスムーズです。

【Instagramのプロアカウント切り替え方法】

下記はInstagramアプリからの設定方法です。

1. Instagramのプロフィール画面 → 「プロフィールを編集」
2. 「プロアカウントに切り替える」に進む
3. 「次へ」からカテゴリを選択 → 「完了」
4. クリエイターかビジネスを選択して「次へ」
5. 画面に従って進むと完了

FacebookページとInstagramのプロアカウントの連携

下記はInstagramアプリからの設定方法です。

1. Instagramのプロフィール画面 → 「プロフィールを編集」
2. プロフィール情報の「ページ」に進む
3. 「Facebookページをリンクまたは作成」画面が出るので「次へ」
4. Facebookにログインし、連携したいページを選択して完了

ここまでで事前準備は完了です。
ここで紹介するのは連携方法だけですので、FacebookやInstagramに関するその他の設定についてはお調べください。

STEP 1 - 公式サイト

Sauce by SNPTの公式サイトにアクセスし、右上「Start free trial」からアカウント作成画面に進みます。

STEP 2 - アカウント作成

必要情報を入力します。

Instagram Username → Instagramのユーザーネーム
Email → このアカウントで使用するメールアドレス
Choose a Password → このアカウントで使用するパスワード
「Want to be 〜?」のチェックボタンは無視してOKです。
reCAPTCHAのチェックを入れて「Create your account」からアカウントを作成します。

STEP 3 - Insatagram連携

「Connect Instagram」からInsatagramと連携します。
※事前準備のFacebookページとInstagramのプロアカウントの連携ができていない場合は連携が失敗し、この後の画面に進めません。

Instagram連携する際に、Facebookからのログイン認証を求められますので、この時にInstagramと連携したFacebookアカウントでログインしてください。

ログインするFacebookアカウントで、複数のFacebookページとInstagramアカウントを管理している場合は、ログインボタンの上の「アクセスを許可」から今回フィードとして使用したいFacebookページとInstagramアカウントだけアクセスを許可してください。

ログインが完了すると、SauceのTOP画面になります。

STEP 4 - 埋め込みコードの取得

SauceのTOP画面でナビゲーションの「Visual Shopping」から「Live Feed Galleries」に進みます。

すると左側に「Live Instagram feed」」というタイトルが表示されたページになるので、その下にある「Copy embed code」というところをクリックすると埋め込みコードがコピーされます。このコードをBASEテーマ編集の「【Instagram】Sauce by SNPTのコード」に貼り付けるとInstagram埋め込み表示が完了です。

なお、「Live Instagram feed」」ページの左側に「Gallery style」という埋め込み表示のカスタマイズ機能がありますので、レイアウトを変えたい場合はそこを変更してから「Copy embed code」でコードを取得するとカスタマイズしたレイアウトを反映できます。

TOPページにYouTube動画を埋め込み表示できます。

【TOPページ】YouTube動画埋め込みコード

YouTube動画ページ→「共有」→「埋め込み」で表示されるコードを貼り付けます。
空欄の場合は非表示になります。

TOPページにCTAエリアを設置できます。

【TOPページ】CTAエリアを表示

ONにすると表示、OFFにすると非表示になります。

【CTAエリア】文字色

文字の色を設定できます。

【CTAエリア】背景色

画像を設定しない場合に表示される背景の色を設定できます。

【CTAエリア】画像

背景画像を設定できます。
画像の推奨サイズ：横1440×縦600px 以上
空欄の場合は表示されません。

【CTAエリア】タイトル

タイトルを設定できます。

【CTAエリア】説明

メッセージやリンク先の簡単な説明、キャッチコピーなど、テキストを設定できます。

【CTAエリア】リンク先URL

ボタンのリンク先URLを設定できます。
空欄の場合はボタンが表示されません。

【CTAエリア】ボタンテキスト

ボタンのテキストを設定できます。

TOPページのコンテンツの順番を変更できます。
並び替えられるコンテンツの一覧は下記です。
・ピックアップエリア
・ABOUTエリア
・カテゴリ商品一覧エリア
・セール商品一覧エリア
・ブログ一覧エリア
・Instagram埋め込みエリア
・YouTube動画
・CTAエリア
・新着商品一覧エリア

それぞれ0~9の数字を設定することができます。
0が最も上、9が最も下になります。
同じ数字にした場合は、同じ数字の中でデフォルトの順番が適用されます。
番号が重ならないように設定していただければ簡単に任意の順に変更できます。

【ABOUTページ】ショップの説明を表示

BASE管理画面・右上→「ショップ設定」→「ショップの説明」に記載した情報が表示されるエリアです。
テーマ編集からではなく、BASEのショップ設定から入力したものが反映される場所になりますのでご注意ください。

【ABOUTページ】ショップの説明：背景色

背景色を変更できます。

ABOUTページに、画像とテキストを1ブロックとしたコンテンツを、最大3ブロック設置できます。

【ABOUTページ】コンテンツエリアを表示

ONにすると表示、OFFにすると非表示になります。

【ABOUTページ】コンテンツエリア1〜3を表示

ブロックごとに個別に表示・非表示を切り替えられます。

【ABOUTページ】コンテンツエリア1〜3：画像

画像を設定できます。
推奨サイズ：横1440px縦1200px

【ABOUTページ】コンテンツエリア1〜3：見出し

テキストの見出しを設定できます。

【ABOUTページ】コンテンツエリア1〜3：説明

説明テキストを設定できます。
改行はそのまま反映されます。

文中にURLがある場合は、リンクに自動変換します。
※URLに日本語がある場合は後ろに続く単語もリンクになってしまう場合がありますので、URLの前後に改行かスペースを入れて切り分けるととうまく変換されます。

ABOUTページにYouTube動画を埋め込み表示できます。

【TOPページ】YouTube動画埋め込みコード

YouTube動画ページ→「共有」→「埋め込み」で表示されるコードを貼り付けます。
空欄の場合は非表示になります。

ABOUTページにFAQ（よくある質問）を最大10個まで掲載できます。
配色は変更できません。

【ABOUTページ】FAQを表示

ONにすると表示、OFFにすると非表示になります。

【FAQ】質問1〜10

質問の内容を設定します。

【FAQ】答え1〜10

質問の答えを設定します。
文中にURLがある場合は、リンクに自動変換します。
※URLに日本語がある場合は後ろに続く単語もリンクになってしまう場合がありますので、URLの前後に改行かスペースを入れて切り分けるととうまく変換されます。

※質問と答えの両方セットで入力がないと表示されません。片方だけ入力がある場合は非表示になります。

商品の購入ページです。
全商品ページに共通表示できるフリーテキストや、関連商品の表示／非表示を設定できます。

>>> 商品詳細のデモページ

【商品ページ】フリーテキスト（全商品ページの商品説明の上に表示）

商品情報説明の上にフリースペースを設けています。
自由にテキストを追加できます。
送料や注意事項、いま使えるクーポンコードなど一括ですべての商品ページに掲載しておきたい情報などがあればお使いください。

【商品ページ】カートに入れるボタン：文字色

ボタンの文字色を設定できます。

【商品ページ】カートに入れるボタン：背景色

ボタンの背景色を設定できます。

【商品ページ】関連商品を表示

ONにすると表示、
OFFにすると非表示にします。
最大3件表示されます。

※あくまでも表示・非表示のみです。商品の表示条件・アルゴリズムについては弊社では調整できません。関連商品はテーマ独自の機能ではなくBASEの機能ですのでご質問等はBASEにお願いいたします。

【商品ページ】セール商品一覧を表示

セールAppでセール価格になっている商品を新着順に最大6件表示します。
ONにすると表示、
OFFにすると非表示にします。

【商品ページ】最近見た商品一覧を表示

最近閲覧した商品を最大6件表示します。
ONにすると表示、
OFFにすると非表示にします。

お問い合わせフォームのページになります。

>>> CONTACTのデモページ

ショップを開設すると自動的に生成されます。
内容の編集はできません。

>>> プライバシーポリシーのデモページ

ショップを開設すると登録した内容によって自動的に生成されます。
内容に関しては、BASE管理画面「ショップ設定」→「運営に関する情報の設定」から設定ができます。

>>> 特定商取引法に基づく表記のデモページ

カテゴリ管理App利用時に、商品管理画面で商品にカテゴリーを付けられるようになります。
その際、「カテゴリーページ」として各カテゴリーごとの商品一覧をまとめて閲覧できるページが生成されます。

>>> CATEGORYのデモページ

カテゴリ管理Appの影響箇所について

カテゴリ管理Appをインストールした際にテーマに変化がある箇所がいくつかあります。

メニュー（スマホ／PC）

メニュー内に「CATEGORY」ボタンが追加されます。
スマホの場合はタップすると一覧が展開されます。
PCの場合はマウスオーバーすると一覧が展開されます。

商品検索App利用時に、検索結果として表示されるページです。
基本的にはカテゴリーページ（カテゴリ管理App）と同じデザインで、商品一覧が表示されます。

>>> 商品検索結果のデモページ

商品検索Appの影響箇所について

商品検索Appをインストールした際にテーマに変化がある箇所がいくつかあります。

ヘッダー

画面右上、カートアイコンの並びの左側に検索アイコンを配置します。クリックすると検索用モーダルをポップアップ表示します。
※ポップアップ表示の配色は変更できません。

Blog App利用時に、記事一覧ページと、記事詳細ページが生成されます。

ブログ記事一覧ページ

投稿記事が1ページに15件まで表示されます。
16件以上になると一覧の下にページ送りが表示され一覧が分割されます。

>>> ブログ記事一覧のデモページ

ブログ記事詳細ページ

Blog Appから投稿したブログ記事の詳細ページです。

>>> ブログ記事詳細のデモページ

Blog Appの影響箇所について

Blog Appをインストールした際にテーマに変化がある箇所がいくつかあります。

メニュー

メニュー内に「BLOG」リンクが追加されます。

TOPページのブログ一覧エリアの設定

テーマ設定にあるTOPページにブログ一覧を表示する機能は、Blog Appをインストールしている場合のみ表示されます。Appの利用がない場合は設定を変更しても何も表示されません。

「この記事を固定する」機能対応

Blog Appを使用して記事を投稿する際、「この記事を固定にする」にチェックを入れると各記事リストの先頭に固定記事が表示され、TOPページのメイン画像下にテキストリンクで記事が固定表示されます。
メイン画像がない場合は最上部になります。

コミュニティApp利用時に、コミュニティ会員限定の商品を販売したり、お届けしたいページのURLを公開できるようになります。その専用ページが自動的に生成されます。

※コミュニティページのコンテンツ表示エリアは、配色を変更できません。

>>> コミュニティのデモページ

コミュニティAppの影響箇所について

コミュニティAppをインストールした際にテーマに変化がある箇所がいくつかあります。

メニュー

メニュー内に「COMMUNITY」リンクが追加されます。

メンバーシップApp利用時に、メンバーシップ会員専用のページ（メンバーシップのガイドページ／マイページ／ログインページ）が自動的に生成されます。

※メンバーシップページのコンテンツ表示エリアは、配色を変更できません。

>>> メンバーシップページのデモページ

メンバーシップAppの影響箇所について

メンバーシップAppをインストールした際にテーマに変化がある箇所がいくつかあります。

メニュー

メニュー内に「MEMBERSHIP」が追加され、メンバーシップ各ページへのリンクが追加されます。

下記ページのタイトルの背景にメイン画像を設定できます。
・ABOUTページ
・BLOGページ（一覧／詳細共通）
・CONTACTページ
・カテゴリ・検索結果ページ
・メンバーシップページ（ガイド／マイページ／ログイン共通）
・コミュニティページ

メイン画像

推奨サイズ：横1920px縦697px

ページ読み込み時とスクロール連動のアニメーションの有無を設定できます。

【アニメーション】ページ読み込み時メイン画像の演出

ONにすると、ページ読み込み時にふわっと表示するアニメーションを有効にします。
OFFにすると無効になります。
※アニメーションがない場合にフォント設定をデフォルト以外に設定している場合は、フォントの読み込みに時間がかかるので多少文字の表示にチラつきが発生する場合があります。デフォルト以外のフォントを使う場合はONをおすすめします。

【アニメーション】スクロール演出

ONにするとスクロール時に特定の要素が画面内に入るとアニメーション表示させる演出を有効にします。
OFFにすると無効になります。

OGP画像

SNSでシェアするときに表示されるOGP画像を変更できます。
※商品ページ以外で適用されます。

独自CSSを追加する【上級者向け】

こちらにCSSを貼り付けるとstyleタグが追加され、CSSを上書きできます。独自拡張になりますので上級者向けです。意味がわかる方のみご使用ください。

こちらで用意しているCSSファイルの詳細についての質問には、お問い合わせいただいても細かくお答えできかねます。上書きする場合は確かな知識をお持ちの方が自己責任でお願いいたします。