ブロックの概要

概要 すべてのプラン 11 分で読めます

ブロックとは、メガメニューまたはタブの中にあるコンテンツの1つの単位です。ブロックは1行に横並びで配置され、各ブロックの 幅 によって、その行のどのくらいを占めるかが決まります。

リンクとボタン

リンクリスト見出しとリンクの列。アイコン、画像、バッジを任意で追加できます。 Hover image links（ホバー画像リンク）大きな画像の横にリンクを配置し、ホバーで画像が切り替わります。 Feature list（特徴リスト）送料無料などのセールスポイントを、アイコン付きで表示します。 Button（ボタン）「すべて見る」などのコールトゥアクションボタンを1つ設置します。

画像とバナー

画像タイトルとリンク付きのバナーまたはプロモーション画像を1つ表示します。 画像スライダー複数の画像をカルーセルで表示します。Growth · Pro Promo banner（プロモバナー）見出し、テキスト、ボタン付きの画像。 Brand logos（ブランドロゴ）ブランドロゴのグリッド。それぞれに個別のリンクを設定できます。

商品とコレクション

商品リスト商品カード1つ、またはグリッド、リスト、カルーセルで表示する商品。 Lookbook hotspots（ルックブックホットスポット）写真に写っている商品の上にクリックできるドットを配置します。 コレクションリスト画像付きのコレクション。Growth · Pro Collection spotlight（コレクションスポットライト）コレクション名と、その商品のグリッドを並べて表示します。Growth · Pro

コンテンツとプロモーション

ブログ記事最新または選んだブログ記事。Growth · Pro お問い合わせフォームお客様がメッセージを送信するためのフォーム。 Newsletter（ニュースレター）メールの登録フォーム。 カウントダウン指定した日時までをカウントダウンするタイマー。Growth · Pro Coupon code（クーポンコード）買い物客がワンクリックでコピーできる割引コード。Growth · Pro カスタムHTML地図、動画、埋め込みなど、任意のHTML。Pro

どれを使えばよいですか？

ブロック	最適な用途	ブロックを選択 のタブ	プラン
リンクリスト	カテゴリー、ブランド、サイズ	リンクリスト	すべてのプラン。バッジ には Pro Navigation が必要
Hover image links	画像でカテゴリーをプレビュー	リンクリスト	すべてのプラン
Feature list	送料無料、返品、安全な支払い	リンクリスト	すべてのプラン
Button	「すべて見る」のコールトゥアクション	リンクリスト	すべてのプラン
画像	季節のバナーやプロモーション	カスタム画像を追加	すべてのプラン
画像スライダー	1つのブロックで複数のキャンペーン	カスタム画像を追加	Growth Navigation、Pro Navigation
Promo banner	ボタン付きのセールや新コレクション	カスタム画像を追加	すべてのプラン
Brand logos	「ブランドから探す」	カスタム画像を追加	すべてのプラン
商品リスト	売れ筋、新着、コレクション	商品を追加	単一商品：すべてのプラン。グリッド、リスト、カルーセル：Growth Navigation、Pro Navigation
Lookbook hotspots	「コーディネートで探す」	商品を追加	すべてのプラン
コレクションリスト	「カテゴリーから探す」タイル	コレクション	Growth Navigation、Pro Navigation
Collection spotlight	複数のコレクションの商品	コレクション	Growth Navigation、Pro Navigation
ブログ記事	ガイド、ルックブック、ニュース	ブログ	Growth Navigation、Pro Navigation
お問い合わせフォーム	ページを離れずに質問	お問い合わせフォーム	すべてのプラン
Newsletter	メールリストの拡大	お問い合わせフォーム	すべてのプラン
カウントダウン	フラッシュセールや締め切り	カウントダウン	Growth Navigation、Pro Navigation
Coupon code	コピーできる割引コード	Coupon code	Growth Navigation、Pro Navigation
カスタムHTML	地図、動画、埋め込み	メニューにHTMLを追加	Pro Navigation

単一のブロックではなく、構造を加えるタブがさらに2つあります。

• マルチブロック は、リンクリスト3 + 画像1 や 地図 + 連絡先 + 住所 などのあらかじめ用意された組み合わせを、ワンクリックで追加します。必要なプランは、含まれるブロックによって異なります。項目グループ（Masonryレイアウト） は、複数のブロックを1列に積み重ねます。Masonryレイアウト（Pro Navigation）をご覧ください。
• タブ は、タイトルを左、上、右に配置した、シンプルまたは入れ子のタブを追加します。タブメニュー（Pro Navigation）をご覧ください。

ブロックを追加する

1. パネルを開く

   メニューエディターで、メガメニューのある項目をクリックしてパネルを開きます。ブロックを追加 をクリックします。

   

   開いたメガメニューパネルで「ブロックを追加」をクリックします。

2. タブとレイアウトを選ぶ

   ブロックを選択 で、マルチブロック、リンクリスト、Coupon code などのタブをクリックします。レイアウトにカーソルを合わせて 選択 をクリックします。

   

   (1) タブを選ぶ、(2) レイアウトにカーソルを合わせて「選択」をクリックする。

3. ブロックを設定する

   設定は 項目を編集 に表示されます。内容を入力し、幅 を選びます。後で編集するには、プレビューでブロックをクリックします。

   

   (1) プレビューでカウントダウンをクリック、(2) 幅を設定する。

4. 保存して公開する

   保存 をクリックし、公開 をクリックします。

ノート

Growth Navigation または Pro Navigation のバッジが付いたレイアウトは、現在のプランに含まれていません。ボタンには 使用するにはアップグレードしてください と表示され、価格 に移動します。

すべてのブロック共通の設定

幅デフォルト: レイアウトによって異なる

ブロックが行のどのくらいを占めるか。自動、または 8.33% から 100%。幅の合計が100%を超えるブロックは、次の行に折り返されます。同じ幅の列にするには、4 × 25%、3 × 33.33%、2 × 50% を使います。

デスクトップで非表示 / モバイルで非表示デフォルト: オフ

表示設定 の下にあります。一方のデバイスの種類でブロックを非表示にします。

ログイン時は非表示 / ログイン時のみ表示デフォルト: オフ

表示設定 の下にあります。ブロックをゲストにのみ、またはログイン中のお客様にのみ表示します。

公開を予約デフォルト: オフ

表示設定 の下にあります。開始日 / 開始時刻 から 終了日 / 終了時刻 の間だけブロックを表示します。メニューのスケジュール設定をご覧ください。

追加のクラス名デフォルト: 空

詳細設定 の下にあります。独自のCSSクラスを追加して、カスタムCSSでブロックのスタイルを設定できます。

Shopify のデータは自動で更新されます

商品、コレクション、ブログのブロックは、タイトル、価格、画像、在庫、新しい投稿をストアからリアルタイムで読み込みます。ブロックが記憶しているのは、選んだ項目が どれか だけです。項目を削除したりハンドル（URL）を変更したりした場合は、もう一度選んでください。Shopify 管理画面での変更がメニューに反映されないをご覧ください。

関連ページ

• メガメニューリンクリスト、画像、商品、お問い合わせフォームなどのブロックから、幅の広いサブメニューパネルを作成します。
• タブメニュー1つのサブメニュー内で、メンズ、レディース、キッズなどのコンテンツのグループを買い物客が切り替えられるようにします。
• Masonryレイアウトと特別メニュー高さの異なるブロックを列にきれいに積み重ねたり、カテゴリーの一覧とカテゴリーごとのパネルを表示したりします。
• プランと請求Globo Mega Menu のプランを比較し、無料トライアルを開始して、プランのアップグレード、ダウングレード、解約を行います。

このページは役に立ちましたか？

問題を報告