編集

連絡フォームガジェットを設置する方法

アイキャッチ


(^^/ハローコンカイハ、今回は、今回は定番中の定番?の連絡フォームガジェットを個別ページに設置する方法を説明していきます。

なぜいまさら解説するのか?

ある他所のブログで仕様が変わったらしく今まで公開されてたものは全部使えなくなってしまったからです。
まだ知名度が高くなさそうなので先にカスタマイズ方法を教えます。

カスタマイズ開始!

1. 連絡フォームガジェットを適当なところに設置します。
2. アドレスの前に「view-source:」を入れてソース画面を開きCtrl+Fを押し、検索で「連絡」と探します。

面倒くさいときは?

ここにコードを置いておきますのでコピペしてお使いください。(たぶん共通だったような?)

<form name="contact-form">
<p></p>
Name
<br />
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
<p></p>
Mail
<span style="font-weight: bolder;">*</span>
<br />
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
<p></p>
Message
<span style="font-weight: bolder;">*</span>
<br />
<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<p></p>
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="送信" />
<p></p>
<div style="max-width: 222px; text-align: center; width: 100%;">
<p class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></p>
<p class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></p>
</div>
</form>
3. ページを作成し、パーマリンクを固定してからHTMLモードで貼り付け、公開すればおk
デモ


最後に

最新版(2023年版)の仕様変更に対応した方法でカスタマイズ記事を書きました。
参考になったら「いいね!」をワンプッシュしてやお←岐阜弁