前提条件
Wix では「HTML 埋め込み」要素を使って外部スクリプトを貼り付けます。この機能は無料プランでも利用できますが、内部的には iframe で描画されるため、フォームの高さに合わせて要素のサイズを調整する必要があります。Wix エディタは PC・タブレット・モバイルでそれぞれ別の設定が可能なので、デバイスごとに確認することをおすすめします。
- Wix アカウントとサイト（無料プランでも可）
- ミツモリンクでフォームを 1 個以上作成済み
- Wix エディタの編集権限
設置手順
- 01
ミツモリンクでフォーム ID を確認する
ミツモリンクのダッシュボードで対象のフォームを開き、「埋め込みコード」タブに表示される 1 行の script タグをコピーします。
- 02
Wix エディタでページを開く
Wix ダッシュボードサイトを編集設置したいページをエディタで開きます。
- 03
HTML 埋め込み要素を追加する
追加パネル（+）埋め込みHTML コードエディタ左側のパネルから「追加」→「埋め込み」→「HTML コード」を選択し、キャンバスにドラッグして配置します。
- 04
埋め込みコードを貼り付ける
配置した HTML 要素をクリックし、表示される「コードを入力」ボタンから設定パネルを開きます。「コード」タブ（iframe モードではなく）を選択し、ミツモリンクでコピーした script タグをペーストして「更新」を押します。
- 05
要素のサイズを調整する
HTML 埋め込み要素は iframe のため、フォームが縦に伸びても要素自体は自動拡張しません。フォームの全項目を想定した高さに手動で広げてください。幅もレイアウトに合わせて調整します。
- 06
モバイル表示を確認する
Wix エディタ上部の「モバイル」切り替えボタンをクリックし、スマホ表示でも要素サイズが適切か確認します。必要に応じてモバイル専用の高さを設定してください。
- 07
公開する
右上の「公開」ボタンで変更を反映します。
<script src="https://mitsumolink.com/widget/widget.global.js" data-widget-id="YOUR_WIDGET_ID"></script>YOUR_WIDGET_ID の部分を、ミツモリンクでコピーしたコードの data-widget-id の値に置き換えてください。
動作確認
公開後、以下を確認してください。
- 公開 URL でページを開くとフォームが表示される
- PC 表示・モバイル表示のどちらでも下部が切れていない
- 項目を選択すると合計金額がリアルタイムで更新される
- 「見積もりを送信する」ボタンから実際に送信できる
- Pro プランをご利用中の場合、事業者用メール通知が届く
よくあるトラブル
次のステップ
別の CMS にも設置したい方は、他のガイドをご覧ください。まだフォームを作っていない方は、無料で最初のフォームを数分で作成できます。
Wix 公式の参考リンク
他の CMS ガイド