「Concept」サポート

カラー見本を有効にするたびに、コンセプトテーマでは、カラー見本を表示するための 2 つのオプション (カスタム イメージとバリアント イメージ)を提供します。この記事をより簡単に理解するために、以下の表を確認してください。色見本表示色見本を無効にするカスタムイメージバリエーション画像このページではこの機能はどこにありますか?どのように機能するのでしょうか? 2.1 色見本2.2 バリアント画像スウォッチ ファイルに名前を付けるShopify 管理画面の「ファイル」オプションはどこにありますか? 1. この機能はどこにありますか?ページの[配色]オプションを調整するには、次のように設定します。テーマ エディターを介して製品ページで、製品情報セクションの下にあるバリアント ピッカーブロックを選択します。 [カラー見本] > [見本タイプ]には、 [バリアント イメージ]と[カスタム イメージ] の2 つのオプションがあります。 2. 仕組みは?まず、色見本の設定を有効にし、表示する色見本またはバリアント イメージを選択します。 2.1 色見本[構成] ボックスを設定して、色見本を構成します。この機能がどのように機能するかについては、次のルールを参照してください。この機能を有効にすると、 Concept は、製品のカラー バリエーションの名前と一致する色の値をテーマ設定>カラー見本>構成ボックスで検索します。 色の値が見つかった場合は、その値を使用して色見本が表示されます。例 1 - HEX コードの使用: [設定] ボックスには次の値が含まれています: Black:#3a3a3a次に、黒の色見本は、デフォルトの黒色...

このテーマにはメガ メニューのサポートが付属しており、この手順ではメニューのセットアップ方法を示します。 💡注:この記事では、テーマの最初のリリース以来の機能である簡素化されたメガ メニューについて説明します。 Concept v4.0.0から、タブ付きメガ メニューと呼ばれる新しいスタイルを導入しました。タブ付きメガ メニューの設定に関するガイダンスについては、この記事を参照してください。このページではメガメニューの外観メガメニューの設定メガメニューブロック設定メガメニューの外観Conceptでは、次のようにコンテンツが列に配置されたメガ メニューを作成できます。 メガ メニューは、メニュー項目とプロモーションの2 つの部分の組み合わせです。 メガメニューの設定まず、ネイティブの Shopify ナビゲーションを使用して、メニューを複数のレベルで設定する必要があります。複数のレベル (ドロップダウン) でメニューを作成する方法については、 Shopify の公式ドキュメントをご覧ください。以下は、最初のスクリーンショットのメガ メニューに対応するメニュー構造の例です。 テーマ設定で、セクションリストのヘッダーをクリックし、メニュー設定に移動して、上で作成したメニューを選択します。 メガ メニューの設定を続けるには、 [メガ メニューの追加]をクリックしてメガ メニュー ブロックを追加します。 [メガ メニュー]設定では、メガ メニューを含むメニュー項目の名前を入力するだけです。 「メニュー項目」に入力した名前は、メニュー項目の名前と一致する必要があることに注意してください。以下は、ショップアイテム内にメガメニューが含まれている例です。 でメニュー項目の設定では、オプションでさまざまなプロモーション用に最大 5 つの画像をアップロードできます。これらの画像はメガメニューのバナーに表示されます。 以下は、5 つのプロモーションを含むコレクション メニューの例です。 詳細については、メガメニューのブロック設定を確認してください。メガメニューブロック設定セクション設定設定説明メガメニューメニュー項目メガ メニューに含めるメニュー項目の名前を入力します。 「メニュー項目」に入力した名前は、第...

Conceptでは、カスタム Javascript イベント リスナーとトリガーを使用できます。テーマをカスタマイズするとき、カスタム スクリプトを実行したり、サードパーティ アプリと統合したりした後に、いくつかのイベントに接続することが必要になる場合があります。サポートされているイベントの JavaScript パターンを提供します。トリガーページがロードされましたトリガーカードを引いて更新する製品が Ajax カートに追加されました商品をカートに追加できませんでしたクイックビューモーダルが開きますクイックビューモーダルがロードされましたバリエーションの選択が変更されましたコレクションページが再レンダリングされますトリガーページがロードされましたHTML ドキュメントとすべての遅延スクリプトは完全に解析されました。 document.addEventListener('page:loaded', function() { // Page has loaded and theme assets are ready });カードを引いて更新をトリガーする数量の変更後にカート オブジェクトを更新するには、次の JavaScript パターンを使用します。 document.addEventListener('cart:updated', function(evt) { console.log(evt.detail.cart); });製品が Ajax カートに追加されましたdocument.addEventListener('ajaxProduct:added', function(evt) { console.log(evt.detail.product); });商品をカートに追加できませんでしたdocument.addEventListener('ajaxProduct:error', function(evt) {...

Concept を使用すると、セクションや関連ブロックを任意のページに追加できます。 Concept では、セクションは通常、 Header 、 Overlay 、 Template 、およびFooterの 4 つの主要なグループに分類されます。それぞれのセクションには複数のセクションが含まれています。ブロックを使用してセクションを追加できます。この記事では、すべてのセクションとブロックの概要を説明します。このページではWeb ページのセクション グループは、特定の目的のためにグループ化されたセクションのコレクションです。通常、メイン セクション グループは 4 つあります:ヘッダー グループ、オーバーレイ グループ、テンプレート グループ、およびフッター グループ。注記セクションには次の 2 種類があります。静的セクション:ユーザーの入力や操作に基づいて変更されない Web サイトのセクション。動的セクション:ユーザー入力または対話に基づいて変化する Web サイトのセクション。 A. ヘッダーグループアナウンスバー（静的セクション）ヘッダー(静的セクション)利用可能なセクション（動的セクション） B. オーバーレイグループカート引き出し（静的セクション）検索ドロワー(静的セクション)クッキーバンヌ（静的セクション）ニュースレターポップアップ(静的セクション) C.テンプレートグループこのグループを使用すると、より柔軟に動的セクションを作成できます。ブログ投稿コラージュブログ投稿のコラージュコレクションリストお問い合わせフォーム地図でのお問い合わせカウントダウンタイマーカスタムリキッドメール登録空きスペースよくある質問注目のコレクション注目の製品画像比較テキスト付きの画像テキスト付きの画像テキストオーバーレイを含む画像テキストオーバーレイを含む画像ロゴ一覧ルックブック地図複数列アイコン付きの複数列複数の注目コレクションポートフォリオ最近見たリッチテキストスクロールテキスト外観を購入するスライドショーお客様の声お客様の声のバナータイムラインビデオビデオヒーローテキストオーバーレイを含むビデオD. フッターグループフッターフッターの著作権利用可能なセクションA.セクショングループ「セクション グループを使用すると、テーマ開発者はテーマ レイアウト内にセクションの動的な集合体を作成できます。言い換えれば、セクション グループを使用すると、テーマ内で特定のセクションをグループ化できます。これにより、販売者はテーマ内でセクションを直接追加、削除、並べ替えることができます」エディタ。" 続きを読む1. ヘッダーグループページの上部にあるセクション。通常、Web サイトのロゴ、ナビゲーション...