SELECTTYPEの予約システムで作成する予約フォームは、ブログやホームページに簡単に埋め込むことが出来ます。
wordpressなど外部のシステムで作成されたテーマをご利用のページに予約フォームを埋め込む場合、
テーマの設定によって意図した表示にならない場合もございます。
このブログエントリーでは、wordpressへ予約フォームの埋め込み方法と一緒にうまく表示されない場合の設定例もご紹介します。
まずはSELECTTYPEにログインして予約フォームを埋め込むためのコード情報を入手します。
SELECTTYPEにログインしたらヘッダーメニュー「予約フォーム」→「共有情報（公開URL）の目的のフォームタイトル」をクリックします。
予約フォーム共有情報画面が表示されました。
予約フォーム自体を埋め込みたい場合には、「WEBページに貼り付ける」の「コード」情報を使用します。
ここで入手した情報はのちほどwordpressの設定画面に貼り付けて保存します。
wordpressにログインしたら「固定ページ」⇒「新規追加」をクリックします。
新しく予約フォームを設置するページを作成します。
タイトルにページのタイトルを記入したら、「＋ボタン」（ブロックの追加）をクリックします。
「フォーマット」のなかの「カスタムHTML」をクリックします。
「HTML」の入力欄に先ほど入手した設置用コードを貼り付けます。
幅サイズはサイトに合わせて、数値を変更することで調整が可能です。
幅サイズを「100%」と指定すると設置した箇所の親要素の幅に合わせて予約フォームが表示されるようになります。
設置する側のページがレスポンシブ対応されている場合には埋め込みコードの幅も100%に設定してみましょう。
※幅や高さの調整してもうまく表示されない場合、
ご利用のテーマによってはiframeの幅や高さに指定がされていて指定が上書きされているケースもございます。
その場合には以下のような記載に変更をお試し下さい。
「height:●●px;」のxxx部分を「style=”height:●●px;”」に変更
問題なければそのまま「公開」ボタンをクリックします。
これであなたのホームページにSELECTTYPEの予約フォームが埋め込まれました。
予約フォームを埋め込んだ様子です。
このようにSELECTTYPEの予約システムで作る予約フォームでは、wordpressなどの外部サービスでも簡単に予約フォームを設置できます。
wordpressを使用してサイトの運営をされている方は、埋め込みコードをぜひご活用ください。
SELECTTYPE: 無料でWEBサイト/予約フォーム付き予約システム/イベント管理・セミナー管理システム/メールフォーム付きサポートシステム/各種フォーム作成(アンケート,診断テスト)
SELECTTYPEは予約システム/イベント管理システム付ホームページ作成サービスです。
