AmebaOwndにフォームズのメールフォームを設置する(PC)

ここではAmebaOwndにフォームズのメールフォムを設置する方法を見ていきます。なお、メールフォームの設置方法は大きく分けると以下の2パターンありますので分けて説明していきます。


  • ページ内に埋め込む方法
  • フォームにリンクする方法


また、以下の説明では、すでにメールフォームが作成済みであることを前提に手順を説明しています。メールフォームをまだ作成していない場合は、フォームズでメールフォームを作成してから読み進めてください。 


→ フォームズ


ページ内に埋め込む

まず、作成したメールフォームのURLをコピーしておきます。

(メールフォーム作成時に入力したメールアドレス宛にも同じ情報が送られているはずですので、そちらからコピーしてもOKです)

URLをコピーしたら、フォームズのトップページを表示して[設置方法]をクリックします。

設置方法が書かれたページが表示されますので「ページ内に埋め込む方法」の[フォームURL]にコピーしておいたURLを貼り付け[タグ生成]をクリックします。すると[フォーム設置HTMLタグ]の欄にタグと呼ばれるものが表示されますので、これを全てコピーします。

これでメールフォームを設置するための情報が取得できました。あとは、このコピーした情報をAmebaOwndに貼り付けていきます。


では、今回はAmebaOwndのページにメールフォームを設置していきます。


メールフォームを設置したいページを編集状態にして[HTML]を選択します。

続けて、メールフォームを設置したい位置にHTMLブロックを配置します。

すると、下の画像のような画面が表示されますので、先ほどコピーした内容を貼り付けます。

貼り付けたら[OK]をクリックします。

これで、メールフォームを表示するための準備は完了です。ただ、メールフォームを配置するために使用したHTMLブロックはプレビューしなければ表示を確認することができません。なので、右上の[プレビュー]をクリックして表示を確認します。

このようにメールフォームが表示されればOKです!確認できたら、右上の[プレビューを終了]をクリックしてこのページを閉じます。

なお、設置したフォームの一部が隠れてしまった場合は、先ほど貼り付けたタグの一部(高さ)を書き換えると全体が表示されるようになります。「height」の後ろの数値を書き換えて調整します。書き換える時は全角ではなく半角で入力します。

高さを変更したので、メールフォーム横に表示されていたスクロールバーが表示されなくなりました。

フォームにリンクする方法

リンクする場合も手順はほぼ同じです。まず、作成したメールフォームのURLをコピーしておきます。

(メールフォーム作成時に入力したメールアドレス宛にも同じ情報が送られているはずですので、そちらからコピーしてもOKです)

URLをコピーしたら、フォームズのトップページを表示して[設置方法]をクリックします。

設置方法が書かれたページが表示されますので「リンクをクリックして別ウィンドウで開く方法」の[フォームURL]の欄にコピーしておいたURLを貼り付け[タグ生成]をクリックします。すると[フォーム設置HTMLタグ]の欄にタグと呼ばれるものが表示されますので、これを全てコピーします。

これでメールフォームを設置するための情報が取得できました。あとは、このコピーした情報をAmebaOwndに貼り付けていきます。


では、今回はAmebaOwndのページにメールフォームを設置していきます。


メールフォームを設置したいページを編集状態にして[HTML]を選択します。

続けて、メールフォームを設置したい位置にHTMLブロックを配置します。

すると、下の画像のような画面が表示されますので、先ほどコピーした内容を貼り付けます。

貼り付けたら[OK]をクリックします。


これで、メールフォームを表示するための準備は完了です。ただ、メールフォームを配置するために使用したHTMLブロックはプレビューしなければ表示を確認することができません。なので、右上の[プレビュー]をクリックして表示を確認します。

このようにメールフォームのリンクが表示されればOKです!確認できたら、右上の[プレビューを終了]をクリックしてこのページを閉じます。

これでメールフォームの設置は完了です!

0コメント

  • 1000 / 1000