ヘッダー
店舗のすべてのページの一番上に表示されるヘッダーです。ロゴ、メニュー、検索、アカウント、カートの標準機能に加えて、Hellostore 独自の画像付きメニュー(リンク先のコレクション画像が自動で並ぶメガメニュー)を組み合わせられます。
分類: Shopify 標準セクション(Hellostore 拡張を含む)
ヘッダーは最初からすべてのページに置かれています。テーマエディタ(管理画面の「オンラインストア → テーマ → カスタマイズ」)でどのページを開いても、上部の**「ヘッダー」**を選ぶと設定できます。
- ロゴの位置: ロゴを左・中央・中央上のどこに置くかです
- メニュー: ヘッダーに表示するナビゲーションメニューです。メニューの中身は管理画面の「コンテンツ → メニュー」で編集します
- メニュータイプ: パソコン画面でのメニューの開き方です。「ドロップダウン」は項目の下に小さく開きます。「メガメニュー」は横に大きく開き、画像付きメニューを使うときはこちらを選びます。「ドロワー」はパソコンでもハンバーガーボタンの開閉にします
- メニューの配色: メニューを開いたときのパネルの配色です
- 常時表示のヘッダー: スクロールしてもヘッダーを画面上部に残すかどうかです
- 区切り線: ヘッダーの下に線を引くかどうかです
- 言語セレクター / 国・地域セレクター: 多言語・多通貨の切り替えボタンを表示します(表示にはストア側の言語・市場設定が必要です)
- 余白(上・下・下マージン): ヘッダーまわりの広さです
- 文字の大きさを整える: ヘッダー内の文字の大きさと字間を整えます。初期状態ではオフです。
- アイコンの動き: 「なし」と「控えめ」から選びます。「控えめ」にすると、ヘッダーのアイコンにマウスを乗せたときに少し動きます。テーマ設定の「アイコンの種類」が「線のアイコン」のときだけ効きます。
画像付きメニュー
Section titled “画像付きメニュー”リンク先のコレクションや商品の画像が自動で並ぶメニューです。「Shop by silhouette」「商品カテゴリから探す」のような、見て選べる案内に使います。画像のアップロードは不要で、リンク先の画像をそのまま表示します。
ヘッダーの「ブロックを追加」から**「画像付きメニュー」**を選んで追加します。
- メニュー項目の位置: 画像付きにするヘッダー最上位項目の位置を、1から数えて指定します。対象の項目には子リンクが必要です
- 画像リンクメニュー: カードとして並べるリンクの元になるメニューを選びます。コレクションまたは商品のリンクを4〜6件含むメニューを選んでください
- 子リンクを画像カードにする: 画像リンクメニューが空のとき、この項目の子リンクを画像カードで並べます(既定: オフ)
- 画像比: カードの画像の縦横比です。標準 / 画像に合わせる / 縦長(4:5) / 正方形から選びます(既定: 標準)
- 画像の収め方: 画像を枠に収める方法です。全体を表示 / 枠いっぱいに表示から選びます(既定: 全体を表示)
- 見出し: パネルに表示する見出しです
- モバイルドロワーにリンクを直接表示: スマートフォンのメニューで、親メニューを開く操作を省き、この枝を最初の画面に表示します
- 案内リンクのラベル: パネルの下部に表示する補助リンクの文言です(例: 迷ったら診断へ誘導するリンク)
- 案内のリンク先: 案内リンクの移動先です