ユニバーサルブロックの追加
公開日: 更新日:
複数のページにわたって一貫したレイアウトを作成するのは、各セクションを手動で更新していると難しく、時間もかかります。ClickFunnels では、ユニバーサルブロック 機能でこの問題を解決できます。この機能を使うと、任意のセクション、行、フレックス、要素を保存して、ファネル全体で再利用できます。ブロックへの更新はそのブロックが使用されているすべての場所に適用されるため、一貫性を保ちながら時間を節約できます。この記事では、ユニバーサルブロック機能について説明します。
-
アクティブなClickFunnelsアカウント
-
ワークスペースで作成されたページ
ユニバーサルブロックとは
Section titled “ユニバーサルブロックとは”ユニバーサルブロック は、ClickFunnels の再利用可能な構成要素です。任意のセクション、行、要素をコンテンツやスタイルも含めて保存し、ファネル内のさまざまなページに簡単にインポートできます。レイアウトや要素をユニバーサルブロックにすると、ブロックへの更新が使用されているすべての場所に自動的に同期されるため、一貫性を保ちながら時間を節約できます。
仕組み:
セクション、行、要素をユニバーサルブロックとして保存すると、個人用ライブラリに保存されます。その後、数回クリックするだけで任意のページに追加できます。ユニバーサルブロックに変更を加えると、その変更は使用されているすべての場所で更新されるため、繰り返し使うコンテンツ（バナー、免責事項、オプトインフォームなど）を常に最新の状態に保てます。
例:
たとえば、複数のページに表示したいお客様の声セクションを作成した場合、それをユニバーサルブロックとして保存できます。後でお客様の声を更新する必要が生じても、ブロックを一度更新するだけで、そのお客様の声セクションを使用しているすべてのページに新しいコンテンツが自動的に反映されます。
ユニバーサルブロックを使用する場面:
ヘッダー、フッター、お知らせ、繰り返し使う行動喚起セクションなど、複数のページで再利用したいコンテンツやレイアウトには、ユニバーサルブロックの使用を検討してください。ファネル全体で情報の一貫性を保つ必要がある場合や、実績のあるレイアウトを再利用してページ作成をスピードアップしたい場合に特に便利です。
ステップ 1: コンテナをユニバーサルブロックとして保存する
Section titled “ステップ 1: コンテナをユニバーサルブロックとして保存する”-
エディターでページを開きます。
-
ユニバーサルブロックとして保存するコンテナ（セクション、行、フレックス、要素）を選択します。
-
コンテナにカーソルを合わせ、保存 アイコンをクリックします。
-
コンテナの 名前 を入力します。
-
必要に応じて、保存したコンテナを整理するための フォルダ を選択します。フォルダを選択しない場合は、ルートフォルダに保存されます。
-
「…をユニバーサルにする」オプションを有効にします。
-
必要に応じて、説明（オプション） フィールドにコンテナの説明を入力します。
-
「…を保存」をクリックして、コンテナをユニバーサルブロックとして保存します。
-
コンテナの色が紫色に変わり、ユニバーサルブロックであることが示されます。これにより、他のコンテナと簡単に見分けられます。
ステップ 2: ユニバーサルブロックをインポートする
Section titled “ステップ 2: ユニバーサルブロックをインポートする”-
エディターでページを開きます。
-
セクションを追加、行を追加、または 要素を追加 をクリックして、新しいアイテムを挿入します。
-
左側のメニューから ユニバーサル を選択します。
-
保存済みの ユニバーサルブロック を参照して、以前に保存したユニバーサルブロックを見つけます。
-
ページに挿入するブロックを選択します。
ユニバーサルブロックの設定
Section titled “ユニバーサルブロックの設定”ユニバーサルブロックにカーソルを合わせると、その境界線が紫色で強調表示されます。設定にアクセスするには、歯車 ⚙️ アイコン をクリックするか、ブロックを直接クリックして設定パネルを開きます。
上マージン
上マージン 設定では、現在のコンテナ（セクション、行、フレックス、要素）とそのすぐ上にあるコンテナとの間のスペースを制御できます。前にコンテナがない場合、マージンは親コンテナを基準に適用されます。前にコンテナが追加されていない場合は、本文 が親になります。
デバイスアイコン（🖥️ & 📱）を使用して、デスクトップとモバイルの上マージンの値を個別に設定できます。モバイルの値が指定されていない場合は、デフォルトでデスクトップの設定が引き継がれます。スライダーを使用するか、ピクセル（px）またはパーセンテージ（%）で値を手動で入力して、画面サイズ全体で一貫した間隔を作成します。
ユニバーサルブロックを編集
ユニバーサルブロックを編集 をクリックして、ブロックの内容を変更します。たとえば、以前にセクションをユニバーサルブロックとして保存した場合は、「ユニバーサルブロックを編集」オプションを選択して、そのセクションを再び編集できます。使用可能なエディターの要素を使って、ブロック内のコンテンツを追加または削除できます。必要な変更を加えたら、ユニバーサルブロックを保存 をクリックして変更を適用します。保存すると、ユニバーサルブロックが使用されているすべての場所で内容がすぐに更新されます。変更内容に迷う場合は、変更を破棄 をクリックしてユニバーサルブロックエディターを終了します。
ユニバーサルブロックのリンク解除
ユニバーサルブロックのリンク解除 オプションを使用すると、エディター内でユニバーサルブロックを通常のコンテナに戻すことができます。リンクを解除すると、コンテンツは元のユニバーサルブロックと関連付けられなくなります。つまり、加えた変更はそのインスタンスにのみ適用され、ユニバーサルブロックが使用されている他のページやブロックには影響しません。この機能は、ファネル内の他の場所にある再利用可能なユニバーサルブロックに影響を与えずに、特定のページのコンテンツをカスタマイズしたい場合に便利です。
高度な設定
コンテナ（セクション、行、列、要素）をさらにカスタマイズできるように、ClickFunnels には、スタイル、高度な CSS、アニメーション、レンダリングロジックを制御できる 高度な 設定が用意されています。1 か所に情報が多くなりすぎないよう、またドキュメントを簡潔に保つために、これらの高度な機能はそれぞれ専用の記事で説明しています。詳細については、次のリソースを参照してください。
-
詳細設定 - スタイルのカスタマイズ: コンテンツを動的に入力する方法、コンテナを配置する方法、z-index を適用する方法を説明します。
-
詳細設定 - アニメーションのカスタマイズ: アニメーションを追加する方法、表示・退出時の効果を制御する方法、アニメーションの遅延を調整する方法を説明します。
-
詳細設定 - ロジックのカスタマイズ: 要素に条件付きロジックを適用する方法と、カスタム属性を追加する方法を説明します。
ユニバーサルブロックの管理
Section titled “ユニバーサルブロックの管理”ユニバーサルなセクション、行、要素は、ページエディターから管理できます。必要に応じて、保存したアイテムを整理、名前変更、編集、削除できます。
-
エディターでページを開きます。
-
セクションを追加、行を追加、または 要素を追加 をクリックして、新しいアイテムを挿入します。
-
左側のメニューから ユニバーサル を選択します。
-
管理するブロックを見つけて、サムネイルの横にある 3 つの点 をクリックします。
-
ドロップダウンからオプションを選択します。
-
名前を変更: 名前を編集し、更新 をクリックして変更を保存します。
-
編集: ブロックを開いて変更を加えます。
-
削除: ユニバーサルブロックの一覧からブロックを削除します。確認を求められたら、削除を確定します。
-