#5 App設定
カテゴリー、メルマガ拡張機能


カテゴリーヘッダーの設定

BASEのカテゴリーAppの仕組みとして、「カテゴリーごとに画像を設定する」という機能は存在していませんが、テーマ独自の方法でカテゴリーヘッダーを実現しています。

カテゴリーAppでは、カテゴリー項目は大カテゴリー、中カテゴリー、小カテゴリーと3階層までいくつでも作成できます。しかし、この機能では「設定できるカテゴリー数は8つまで」としています。

おすすめの使い方として、「大カテゴリーに設定した画像を、中、小カテゴリーも共有する」という方法にすることで、たくさんのカテゴリーが構造化されたショップでも対応ができます。

STEP 1: 「【カテゴリーヘッダー】ON/OF」をONにする

テーマ設定の「【カテゴリーヘッダー】ON/OF」をONにします。これにより、全カテゴリーページにヘッダー画像レイアウトが適用されます。ONにした場合は全てのカテゴリー画像を設定してください。

STEP 2: カテゴリーのIDを調べて入力する

  1. 自分のショップの設定したいカテゴリーページを表示する
  2. ブラウザのアドレスバーにあるURL「ショップドメイン/categories/0000000」をチェック カテゴリーURL確認
  3. 最後の7桁の数字「0000000」を選択し、コピーする カテゴリーID コピー
  4. テーマ設定画面「カテゴリー:ページ番号」欄に、先頭に「cat」をつけた「cat0000000」をペーストする テーマ設定 カテゴリーID入力

STEP 3: 画像をアップロードする

「カテゴリー1:画像」にそのカテゴリーに合わせたい画像をアップロードします。

カテゴリー画像アップロード

STEP 4: 確認する

テーマ設定を保存し、先程のカテゴリーページを確認、ヘッダー画像が表示されていれば完了です。

STEP 5: 中・小カテゴリーの設定方法

中・小カテゴリーにも同じ画像を設定するには、7桁の数字の先頭に「cat」をつけ「,.(コンマピリオド)」で繋げます。

例えば、大カテゴリが0000000、中カテゴリーが1111111、小カテゴリーが2222222だった場合、「cat0000000,.cat1111111,.cat2222222」と入力します。

複数カテゴリー設定例

画像が表示されないときのチェック

・カテゴリーID(7桁の半角数字)が間違っていないか

・「cat」(半角)をつけ忘れていないか

・複数カテゴリーの時は「,.」(コンマ、ピリオド)が正しく入っているか

・複数カテゴリーの時も全てのカテゴリーIDに「cat」がついているか

・前後や途中に見えない文字(スペースなど)が入っていないか

ヘッダー画像なので画像はかなり横長の比率で表示されます。全体が見えないと困るような写真ではなく、雰囲気として部分的に表示されていても問題ないものを選ぶのがポイントです。

注意事項

もし将来的にBASEのカテゴリーAppの機能として正式にカテゴリー画像の機能が追加された場合、この機能の提供を終了します。また、BASEの仕様変更によりカテゴリー画像の設定が不可能になる可能性もあります。


メルマガ登録フォームの設定

サイトアクセスと同時に画面に登録フォームを表示することができます。このメルマガ登録を積極的に促す見せ方は、海外のECショップでも必ずと言っていいほど採用されています。

このテーマでは「メールマガジンApp」を最大限活用するための拡張機能を利用できます。

登録フォームをフッターに表示

上記で設定した内容で、サイトのフッターエリアにも登録フォームを表示させます。

メルマガApp:フッターに表示 ONで表示
⌊ フッター表示の背景 フッターエリアの背景に、ビジュアル画像を利用する、または無地。ビジュアル画像はポップアップ表示項目で設定した画像が使用されます。
⌊ フッター表示の文字色 背景に合わせた文字色

登録フォームをポップアップ表示

◾️メルマガApp:ポップアップ表示 ON/OFF 「【メルマガApp】ポップアップ表示 ON/OFF」を「ON」にし、ショップのトップページにアクセスしてポップアップが表示されることを確認してください。
⌊ タイトル 登録フォームの見出しを入力
⌊ 説明文 登録フォームの説明文を入力
⌊ ビジュアル 登録フォームにビジュアルデザインを加えます。画像の縦横比に指定はありませんが、レイアウト上「縦長〜正方形」に近い表示となるためそのような比率をお勧めします。
⌊ タイトル書体 タイトルの書体を選択
⌊ ポップアップ表示頻度 このポップアップは、トップページにアクセスすると画面を覆うように表示されます。何度も表示されてしまわぬよう、「ポップアップ表示頻度」にて前回のアクセスからどのくらいの時間が経過したら再表示するかを設定します。