液体要素について
その 液体 要素を使用すると、 Liquid、HTML、JavaScript、 or CSS セクションをカスタマイズし、GemPages を使用してサードパーティ アプリを統合するためのコード。
ページに要素を追加するには、次の手順に従ってください。
ステップ 1から: GemPagesダッシュボード、編集するテンプレートを開きます。要素を目的の位置にドラッグ アンド ドロップします。

ステップ 2: 要素を右クリックして、 「編集」 コード パネルを開きます。

ステップ 3: 対応するコードパネルにカスタムコードを追加し、 「保存」 終了したら。

ステップ 4: 最後に、ヒット 「公開」 コードのレンダリングを開始します。

設定タブ
設定 タブでは、特定の Liquid 要素に区別するための名前を設定できます。また、左揃え、中央揃え、右揃えの 3 つのオプションから要素の配置方法を選択することもできます。

デザインタブ
要素の外観をスタイル設定するには、「デザイン」タブに移動し、 この記事.
GemPages V6 の「Liquid エラー」のトラブルシューティング
- 無効またはサポートされていない Liquid 構文: コードの一致を再確認してください ShopifyのLiquidドキュメント.
- 変数またはオブジェクトが見つかりません: 呼び出す製品、コレクション、またはセクションが実際に Shopify に存在することを確認します。
- サードパーティのスクリプトとの競合: 競合の原因を特定するために、コードを小さな部分ごとに削除またはテストします。
- Liquid コードの構文を確認して修正します。
- まず基本的なスニペットでテストして、要素が機能することを確認します。
- エラーが解決しない場合は、スニペットを削除して、手順ごとに再度追加してください。
- 問題がアプリの統合に関連している場合は、GemPages サポートにお問い合わせください。
よくある質問
1. Liquid 要素を使用して追加できるコードの種類は何ですか?
あなたが追加することができます 液体, HTML, CSS, JavaScriptを Liquid要素内。これにより、カスタムロジック、スタイル設定、アプリ埋め込み、インタラクティブなスクリプトを単一ページにまとめるのに役立ちます。
2. Liquid 要素を使用してサードパーティのアプリを埋め込むことはできますか?
はい。多くのアプリでは、Liquid要素に直接貼り付けられるHTMLスニペットまたはJavaScript埋め込みコードを提供しています。アプリがテーマレベルのファイルを必要とする場合は、Shopifyテーマも更新する必要があるかもしれません。
3.JSをインポートできますか? theme.liquid GemPages ページに追加しますか?
スクリプトを手動で「インポート」する必要はありません。GemPagesページで、 theme.liquidそこに追加された JavaScript は自動的に読み込まれます。
ヘッダー/フッターのないレイアウトを使用している場合は、Liquid要素内にJSを追加するか、 theme.gem-layout-none.liquid スクリプトが適切に実行されるようにファイルを保存します。
4. JavaScriptを theme.liquid あるいはLiquid要素内ですか?
-
theme.liquid実行されるスクリプトの場合 を ページ - スクリプトが以下の用途を意図している場合は、Liquid要素を使用します。 特定のページGemPages で作成されたランディング ページやファネル ステップなど。
5. 1 ページに複数の Liquid 要素を追加できますか?
はい。Liquid要素は必要な数だけ配置できます。それぞれの要素は独立して扱われ、異なるロジックやスクリプトを保持できます。
6. Liquid 要素によってページの速度が低下する可能性はありますか?
重いJavaScriptやブロックするJavaScriptを追加すると、動作が遅くなる可能性があります。必ずテストを行い、大きなライブラリを読み込んだり、複数のLiquid要素にスクリプトを重複して読み込んだりしないようにしてください。
コメントしてくださってありがとうございます