HTML/Liquid

HTML/Liquid要素について

概要: HTML Liquid要素を使用すると、PageFlyエディターにHTMLコードを追加できます。HTMLコードは、外部から取得した、またはご自身で記述したコードを使用して、ライブページにカスタムコンテンツを表示するのに役立ちます。

詳細については、こちらのビデオチュートリアルをご覧ください。

HTML/Liquid要素にアクセスする方法

• ステップ1: 左側のツールバーの上から2番目にある「要素」アイコンをクリックします。次に、「PageFly」タブでHTML/Liquid要素を選択します。

• ステップ2: 要素をページエディターにドラッグアンドドロップしてから、使い始めます。

HTML/Liquid要素を設定する方法

一般設定

ステップ1: HTML Liquid要素をレイアウトにドラッグし、選択してパラメーターを表示します。

ステップ2: 「Open code editor」をクリックして、HTMLコードを追加できるコードエディターを開きます。

「Open code editor」ボタンをクリックすると、コードエディターモデルが開きます。

• カスタムコードを使用しない場合は、「Cancel」ボタンをクリックします。この操作を行うと、追加したカスタムコードは保存されません。

• 入力したカスタムコードを保存するには、「Done」ボタンをクリックすると、ページエディターに適用されます。

スタイリング設定

スタイリングタブを使用して、必要なスタイリングオプションを調整できます。スタイリングタブに関する詳細はこちらをご覧ください。

ユースケース

• 3rdパーティアプリ: PageFlyと連携していない3rdパーティアプリからの埋め込みコードを追加するために、この要素を使用できます。

• 動的なチェックアウトボタンを追加: この要素を使用してページに「Buy Now」ボタンを追加できます。詳細についてはこちらをご覧ください。

ヒントとベストプラクティス

特定の要件に必要なカスタムコードのみを含めるようにしてください。不要なコードや外部ライブラリを含めると、ウェブサイトのパフォーマンスが低下する可能性があるため、避けてください。

よくある質問

1. ショップにHTMLコードを使用する必要があるのはなぜですか？

HTMLコードは、外部から取得した、またはご自身で記述したコードを使用して、ライブページにカスタムコンテンツを表示するのに役立ちます。

2. HTML編集をはるかに簡単にするために知っておくべき最も人気のあるHTMLタグは何ですか？

見出し:

段落:

DivおよびSpan:

テーブル:

• 項目1.

• 項目2.