簡単にお問い合わせフォームを設置する

Public Form とは、eurie Desk への問い合わせ窓口となる お問い合わせフォーム をあなたの Webサイトやアプリケーションに簡単に設置できる機能です。現在ベータ版として提供しています。

動作例

Public Form を設置すると、以下のようなお問い合わせフォームが利用できます。

Public Form を有効にする

Public Form を有効にするには、System 設定から Public Form に関する設定を行う必要があります。

  1. Public From を有効にする
  2. お問い合わせフォームを設置する Webサイトの Origin を Allowed Origins に設定する
  3. Web サイトにタグを埋め込む

System 設定の設定方法に関する詳細は、System 設定 を参照ください。

タグの埋め込み

Webサイトを構成する HTML の任意の箇所に、以下を例とするタグを埋め込みます。

<script src="https://cdn.eurie.io/libs/webcomponentsjs/0.7.22/webcomponents-lite.min.js" /></script>
<link rel="import" href="https://cdn.eurie.io/components/eurie-public-form/0.2.0/eurie-modal-form.html" />

<eurie-modal-form
    account-name="demo1"
    api-key="xxxxxxxxxx"
    team-id="yyyyyyyyyyy">お問い合わせ</eurie-modal-form>

上記のコードについて解説します。

  1. JavaScript webcomponents-lite.min.js を最初に読み込みます。これは webcomponents/webcomponentsjs で配布されている JavaScript と同じものです。
  2. eurie-modal-form.html を読み込みます。
  3. eurie-moda-form タグを記述します。いくつかのオプションを指定する必要があります。

オプション設定

local_offer account-name (必須)
eurie Desk のアカウント名を記載してください。
local_offer api-key (必須)
System 設定画面から取得できる API Key を記載してください。
local_offer team-id
eurie Desk に 複数 Team を作成している場合、id を指定することでメッセージ投稿先 Team を指定できます。省略すると Primary Team (アカウント作成時に作成されたTeam) になります。
local_offer default-subject
お問い合わせフォームの Subject の初期値を指定できます。指定しない場合は空欄が初期値になります。

また、開始タグ <eurie-modal-form> と終了タグ </eurie-modal-form> の間に任意のテキストを記述できます。空欄にはできません。テキストだけでなく、HTMLタグも埋め込めます。

account-nameapi-key が省略されたり、正しくない値を入力すると、お問い合わせ送信時にエラーが発生します。設置後は必ず動作確認を行ってください。

タグの埋め込み例

  • 件名の初期値を「サービスに関するお問い合わせ」とする例
<eurie-modal-form
    account-name="demo1"
    api-key="xxxxxxxxxx"
    default-subject="サービスに関するお問い合わせ">
お問い合わせ
</eurie-modal-form>
  • リストの一部としてお問い合わせフォームを設置する例
<ul>
    <li>User Terms</li>
    <li>FAQ</li>
    <li>
        <eurie-modal-form account-name="demo1" api-key="xxxxxxxxxx">
        Contact Us!
        </eurie-modal-form>
    </li>
</ul>

フォームのデザインやレイアウトについて

Public Form の デザインやレイアウトは外部から CSS で変更可能です。これはあなたが Public Form のデザインをカスタマイズできる余地があることを示していますが、同時に、意図しないレイアウトの乱れを生じさせる可能性があることも意味しています。Public Form は、あなたの記述した Style や、CSS Framework の影響を受けるかも知れません。この課題については継続的に取り組んでいますが、Style の干渉を完全には防げないことをご理解ください。

エラー

フォームの送信時に発生するエラーについて解説します。

local_offer The Origin of the request is not allowed.
許可されていない Origin からの送信です。System 設定で Allowed Origins の設定が適切に行われていない可能性があります。

お問い合わせを受け付けたあとは

Public Form でお問い合わせを受け付けたあとは、標準のメールアドレスで問い合わせを受け付ける と同じ手順でカスタマーサポートを行ってください。