ウェブサイト向けコードスニペットウィジェット
訪問者が読んでコピーできる、洗練された埋め込み可能なブロックでコード例を表示できます。スニペットを追加し、言語を選び、タブ付きと積み重ねのレイアウトを切り替え、コードウィンドウのスタイルを整えて、コーディング不要でJotformのコードスニペットウィジェットをあらゆるウェブサイトに公開できます。
Code Snippetsウィジェットの作り方
コード例を追加
インストールコマンド、APIリクエスト、レスポンスサンプル、CSSヘルパー、チュートリアルコードなど、実際のドキュメントのニーズに合わせてスニペットを作成しましょう。各例にタイトルを付け、言語を選び、コード本文を貼り付けます。
スニペットの表示方法を選択
関連する例を切り替えて見せたいときはタブを、ステップバイステップのチュートリアルにはリストレイアウトを使用します。コードテーマ、ウィンドウスタイル、行番号、コピーラベル、幅、余白、角丸を選択できます。
サイトに埋め込む
ウィジェットをプレビューし、埋め込みコードをコピーして、ドキュメント、ヘルプセンター、APIページ、製品チュートリアル、セットアップガイドなど、訪問者が実装の詳細を必要とする場所にコード例を配置しましょう。
見やすくコピーしやすいコード例を共有
複数のスニペットを追加
インストールコマンド、APIリクエスト、JSONレスポンス、CSSヘルパー、チュートリアルコードなど、関連する例を1つのウィジェットにまとめられます。ファイル形式のタイトル、言語ラベル、編集可能なコードブロックを追加すれば、読者は各スニペットの用途をひと目で把握できます。
馴染みのあるコードテーマを選択
ドキュメント、ヘルプセンター、製品ページに技術例を自然になじませましょう。Midnight Glass、Nord、VS 2015、Zenburn、Railscast、Solarized Light、Tomorrowといった組み込みテーマから始めて、主要な色をサイトに合わせて調整できます。
訪問者がすばやくコードをコピーできるように
訪問者が必要なスニペットを手動でテキスト選択することなく、そのままコピーできるようにします。コピー用ボタン、コピー完了状態のラベル、行番号、ウィンドウ枠を追加すれば、セットアップコマンドやコードサンプルがより分かりやすく、再利用しやすくなります。
レイアウトと埋め込み動作をコントロール
コンパクトなドキュメントにはタブ、ステップバイステップのチュートリアルにはリストモードを使用します。自動または任意の幅、余白、影、ブランド表示の有無、デスクトップ／モバイル表示、スコープ付きCSSを設定して、ウィジェットをページのレイアウトにぴったり合わせられます。
Jotformウェブサイトウィジェットが選ばれる理由
Jotformのウィジェットは、ウェブサイトをよりインタラクティブにし、コンバージョンを高めます。星評価やお客様の声のスライダーから、社会的証明のポップアップ、メディア埋め込みまで、多彩なツールが利用可能です。フォームやランディングページにウィジェットを追加して、データ収集、証明の表示、リードの獲得を実現しましょう。コーディングは不要です。
シンプルな埋め込みコードで、Jotformウィジェットをウェブサイトに追加できます。ウィジェットをカスタマイズし、見た目をプレビューして、カスタムHTMLや埋め込みブロックに対応したあらゆるページに貼り付けるだけ。開発者は一切不要です。
Jotformウェブサイトウィジェットを使って、リードの獲得、お客様のフィードバックの表示、社会的証明の掲載、メディアの埋め込み、便利なウェブページツールの追加ができます。各ウィジェットは、訪問者がウェブサイトから直接あなたのビジネスとやり取りできるようサポートします。
ウィジェットの設定、カスタマイズ、埋め込み、トラブルシューティングでサポートが必要な場合、Jotformのカスタマーサポートチームが24時間365日対応します。必要なときに助けがあると分かっているので、安心して前に進めます。
コードスニペットウィジェットの活用シーン
訪問者がページを離れずに実装例を確認できるよう、ウィジェットを好きな場所に追加しましょう。
インストールコマンド、APIリクエスト、レスポンス例、設定用スニペットを必要とする開発者向けドキュメント。
HTML、CSS、JavaScript、SQL、シェル、JSONの例を用いてセットアップ手順を説明する製品チュートリアル。
埋め込み手順、Webhookペイロード、テンプレートスニペット、トラブルシューティング用コマンドなどを表示するヘルプセンター。
機能説明や連携の詳細のそばにコンパクトな技術例を必要とするSaaSのランディングページ。
レッスン用コード、スターターファイル、ビフォーアフターの例を公開する教育系サイト。
プロジェクトの事例と並べて実装サンプルを紹介したい代理店やポートフォリオページ。
Jotformフォーム作成ツールで、リードを有料顧客へと変えましょう
Jotformで、エンゲージメントをアクションへと変えましょう。リードの獲得、決済の回収、返信の自動化まで、すべてを一か所で実現する強力なフォームを作成できます。すべての回答はJotform受信トレイに届き、そこからフォローアップしたり、お気に入りのアプリと連携したりできます。
無料で今すぐ始める
よくある質問 (FAQ)
コードスニペットウィジェットとは？
コードスニペットウィジェットは、タイトル付きで構文スタイルの整った例をウェブサイトに表示できる、埋め込み可能なコード表示ブロックです。
訪問者はウィジェットからコードをコピーできますか？
Which layouts are available?
行番号を表示できますか？
コードテーマをカスタマイズできますか？
どの言語を選べますか？
モバイルでも使えますか？
利用するのにコーディングは必要ですか？