リンク、セクション、ポップアップへの直接リンク
Last updated
Was this helpful?
Japanese 🇯🇵
Last updated
Was this helpful?
この記事では、クリックアクションを使って、リンク、セクション、Eメールアドレス、電話番号へ誘導する方法を学びます。この要素を使用すると、顧客はページを離れることなく、他のリンクやセクションに素早くアクセスしたり、Eメールを送信したり、電話をかけたりできます。
PageFlyでページを無料でカスタマイズするにはこちら。
クリック可能要素の特定: クリック可能にして特定の動作に誘導したいページ上の要素（ボタン、アイコン、ブロックなど）を特定します。
移動先のURLまたはセクション: 外部リンクのURLを準備するか、スクロールしたいページ内のセクションを特定します。
このビデオチュートリアルでは、クリックアクションの設定についてより視覚的に説明しています。
クリックアクションを適用したい要素を特定します。これらには、ボタン、アイコン、ブロックなどが含まれます。パンくずリストを確認して、正しい要素が選択されていることを確認してください。
各要素には5つのアクションを割り当てることができます。ただし、要素が画像の場合は、追加のアクション「Open lightbox」があります。以下に各アクションタイプの詳細な手順を示します。
1. 別のリンクへ誘導する
ステップ1: 要素を選択した後、Generalタブ > Action > Click Action に移動し、ドロップダウンメニューから「Go to URL」を選択します。
ステップ2: 「Select URL」をクリック > ボックスにURLを貼り付け、必要に応じて「Open in new tab」を有効にします。
または、ストア内のコレクション、商品、ページ、ブログ記事にリンクしたい場合は、ドロップダウンメニューから選択し、リンクしたい特定のものを選択します。
以下の例では、「Link to Products」を選択し、希望の商品を選択し、「Select」をクリックすることで、選択した要素を商品にリンクできます。すると、URLがそれに応じて更新されます。
ステップ3: リンクを適用するために「Select」をヒットします。
2. ポップアップコンテンツを開く
このクリックアクションは、Youtube動画や他のストアコンテンツ（コレクション、商品、ブログ記事など）のポップアップコンテンツウィンドウを開くのに役立ちます。
ステップ1: 要素を選択し、Generalタブ > Action > Click Action に移動し、ドロップダウンメニューから「Open Pop-up」を選択します。
ステップ2: ポップアップの幅と高さをカスタマイズします（任意）。
ステップ3: ドロップダウンメニューでポップアップコンテンツを選択します（Youtube VideoまたはStore Contentなど）。その後、URLを挿入し、それぞれのコンテンツの設定を変更します。
3. ページ内の内部セクションへ誘導する
ステップ1: セクションに名前を付ける
要素をページ内の内部セクションに誘導したい場合、まずセクションに名前を付ける必要があります。
ページエディタ内のすべてのセクションは自動的に「Section」という名前が付けられます。そのため、正しいセクションを選択するには、各セクションの名前を変更して明確に分類することが推奨されます（このビデオを参照）。
セクションの名前は、ATTRIBUTES設定を使用して変更できます。
ステップ2: ページ内の内部セクションへ誘導する
要素を選択し、Generalタブ > Action > Click Action に移動し、ドロップダウンメニューから「Scroll to section」を選択します。
Scroll to section ドロップダウンボックスでセクションを選択します。
このビデオは、要素を既存ページの特定のセクションにリンクする方法をよりよく示しています。
これは、ページ上でのTop Offsetの動作です。
4. Eメールアドレスにリンクする
ステップ1: 要素を選択し、Generalタブ > Action > Click Action に移動し、ドロップダウンメニューから「Send Email」を選択します。その後、「Compose Email」を選択します。
ステップ2: Eメールの詳細（Eメールアドレス、件名、内容を含む）を挿入します。
ステップ3: 変更を適用するために「Done」をクリックします。
5. 電話番号にリンクする
ステップ1: 要素を選択し、Generalタブ > Action > Click Action に移動し、ドロップダウンメニューから「Call Number」を選択します。
ステップ2: ボックスに電話番号を入力します。
6. ライトボックスを開く（画像要素のみ）
特に画像要素用にカスタマイズされた画像クリックアクションには、ライトボックスというもう1つの選択肢があります。このアクションにより、ユーザーは画像をクリックして、元の画像から全サイズの画像ポップアップを見ることができます。
ステップ1: 画像要素を選択し、Generalタブ > Action > Click Action に移動し、「Open lightbox」を選択します。
ステップ2: Save & Publishをクリックします。その後、ライブページで結果を確認します。
サービス業: 顧客とのやり取りを効率化するために、予約スケジュール、問い合わせフォーム、リソースダウンロードへの迅速なアクセスを提供します。
イベントウェブサイト: 出席者が簡単にイベントに登録したり、アジェンダを探索したり、問い合わせのために主催者に連絡したりできるようにします。
PDFファイルのアップロード: ボタンにPDFファイルをアップロードして、顧客がダウンロードできるようにすることができます。詳細はこの記事を参照してください。
クリック可能要素に追加のインタラクティブ機能を追加することは可能ですか？
はい、ホバー効果、アニメーション、ツールチップを組み込むことで、クリック可能要素のインタラクティブ性を向上させ、ユーザーに追加のコンテキストや視覚的な合図を提供できます。
クリック可能要素の外観をカスタマイズできますか？
はい、ボタン、アイコン、ブロックの外観をウェブサイトのデザインに合わせてカスタマイズできます。
(任意) 「Top Offset」を設定します：ブラウザの画面上端と移動先のセクションの間の間隔です。
