ウェブサイト向けアコーディオンパネルウィジェット

ギャラリー、製品ストーリー、機能ツアー、ポートフォリオのハイライトを、展開できるアコーディオンパネルに変えられます。画像や動画メディア、任意のバッジ、タイトル、説明、CTAボタンを追加し、コードなしでインタラクション、トランジション、配置、レスポンシブな表示、スタイリングを制御できます。

アコーディオンスライダーウィジェットの作成方法

Build your panels

パネルを作成

画像をアップロードまたは動画を追加し、各バッジ、タイトル、説明、CTAボタンを個別に切り替えられます。メディアを保持したままパネルの並べ替えや複製も可能です。

Choose interaction and layout

インタラクションとレイアウトを選択

最初に開くパネル、ホバーまたはクリックでの起動、トランジションのプリセット、自動再生のタイミング、向き、テキストの配置、幅、デバイスでの表示を設定できます。

Style and publish

スタイルを設定して公開

プリセットのスタイルまたはカスタムカラーを選び、共通の角丸とフォントを適用し、ブランディングを制御して、公開前にスコープ付きのカスタムCSSを追加できます。

コンパクトでインタラクティブなスペースに、より多くのビジュアルコンテンツを表示

スペースを節約

複数の画像やコンテンツスライダーを、ページを圧迫することなくコンパクトなレイアウトで表示できます。訪問者は一度に1つのスライダーに集中しやすく、紹介したいすべての内容を明確に把握でき、すっきりと整理された閲覧体験が生まれます。

Save Space

コンテンツを強調

個々のスライダーをホバーやクリックで展開することで、注目の画像、製品、サービス、お知らせに注意を引きつけます。インタラクティブなレイアウトが訪問者を自然にコンテンツへと導き、重要な情報を際立たせます。

Highlight Content

カスタマイズが簡単

オーバーレイ、テキスト、バッジ、ボタン、タイポグラフィ、角丸、配置、トランジションの動作をパーソナライズできます。さらに細かく制御したい場合は、スコープ付きのカスタムCSSを使用できます。

Easy to Customize

レスポンシブデザイン

デスクトップの水平アコーディオンは、小さい画面では読みやすい縦積みパネルに変化します。ウィジェットをデスクトップ、モバイル、またはその両方のどこに表示するかを選べます。

Responsive Design

アコーディオンスライダーをWordPressに埋め込む方法

1埋め込みコードを取得

Jotformウェブサイトウィジェットをカスタマイズしたら、「Try it on your website for free」をクリックし、生成された埋め込みコードをコピーします。

2ページエディタを開く

ウィジェットを表示したいWordPressの投稿またはページに移動し、新しいブロックを追加します。

3カスタムHTMLブロックを追加

カスタムHTMLを選択し、Jotformウェブサイトウィジェットの埋め込みコードをHTMLフィールドに貼り付けます。

4更新して表示

更新または公開をクリックし、ページを開いて埋め込まれたウィジェットを確認します。

Jotformウェブサイトウィジェットが選ばれる理由

Jotformのウィジェットは、ウェブサイトをよりインタラクティブにし、コンバージョンを高めます。星評価やお客様の声のスライダーから、社会的証明のポップアップ、メディア埋め込みまで、多彩なツールが利用可能です。フォームやランディングページにウィジェットを追加して、データ収集、証明の表示、リードの獲得を実現しましょう。コーディングは不要です。

コーディングなしでウィジェットを埋め込む

シンプルな埋め込みコードで、Jotformウィジェットをウェブサイトに追加できます。ウィジェットをカスタマイズし、見た目をプレビューして、カスタムHTMLや埋め込みブロックに対応したあらゆるページに貼り付けるだけ。開発者は一切不要です。

よりインタラクティブなページを作成

Jotformウェブサイトウィジェットを使って、リードの獲得、お客様のフィードバックの表示、社会的証明の掲載、メディアの埋め込み、便利なウェブページツールの追加ができます。各ウィジェットは、訪問者がウェブサイトから直接あなたのビジネスとやり取りできるようサポートします。

必要なときにサポートを受けられます

ウィジェットの設定、カスタマイズ、埋め込み、トラブルシューティングでサポートが必要な場合、Jotformのカスタマーサポートチームが24時間365日対応します。必要なときに助けがあると分かっているので、安心して前に進めます。

アコーディオンスライダーウィジェットの活用シーン

訪問者がビジュアルな選択肢を比較したり、複数のハイライトをざっと確認したり、次に見るものを選んだりする必要がある場所ならどこにでもウィジェットを追加できます。

ポートフォリオや事例紹介ページで、複数のプロジェクトをコンパクトなビジュアルエリアにまとめて表示できます。

製品ページやコレクションページで、機能や使用例、バンドル、カテゴリのハイライトを紹介できます。

ホームページのセクションで、ヒーローの代替案やサービス、キャンペーンをインタラクティブなショーケースに変えられます。

旅行・会場・レストランページで、旅行先や客室、メニューのセクション、体験を紹介できます。

代理店・サービスページで、ビジュアルを表示したまま提供できる機能を説明できます。

社内ポータルやナレッジハブで、フルカルーセルを使わずに定期的なビジュアル更新を整理できます。

Jotformフォーム作成ツールで、リードを有料顧客へと変えましょう

Jotformで、エンゲージメントをアクションへと変えましょう。リードの獲得、決済の回収、返信の自動化まで、すべてを一か所で実現する強力なフォームを作成できます。すべての回答はJotform受信トレイに届き、そこからフォローアップしたり、お気に入りのアプリと連携したりできます。

無料で今すぐ始める
Convert leads into customers

よくある質問 (FAQ)

  • アコーディオンスライダーウィジェットとは?

    アコーディオンスライダーウィジェットは、複数のメディアパネルを1つのフレームに表示します。訪問者がパネルを展開すると、画像や動画、テキスト、アクションが表示されます。

  • 画像や動画を使えますか?

  • 訪問者はホバーでパネルを開けますか?

  • アコーディオンを自動再生できますか?

  • 水平または垂直のレイアウトを選べますか?

  • 最初に開くパネルを制御できますか?

  • メディア付きでパネルを複製できますか?

  • コードを書く必要はありますか?