メールフォームを表示させるプラグインが作れません。

なのじさん。情報提供ありがとうございます！

NINJA TOOLSの設置なのですが、やはりコピペしたあとに、【改行設定】を【変換しない】にチェックを入れても、サイドバーが一番下に来てしまいます。（今までに投稿したブログの一番下の左側です）

それにこれだけですと、メールフォームが最初から表示されている状態なのです。

<a href="mailto:メルアド">表示される文章</a>みたいに、文章をクリックして初めてNINJA TOOLSのメールフォームが出てくるようにしたいのです。
多分、<a href="mailto:メルアド">の部分に、NINJA TOOLSメールフォームの構文を入れればいいのだとは思うのですが……。
うまくいきません。

また『タグを全てコピーし、ソースの＜body＞～＜/body＞の間の表示させたい場所に貼り付けてください。』という説明文があるのですが、この＜ｂｏｄｙ＞は何のことでしょうか？

お手数ですがご指導よろしくお願い致します。

BLUEPIXYさん。返信遅れましてすみませんでした。
風邪で今まで寝込んでおりました。
BLUEPIXYさんもお気をつけて下さい。

BLUEPIXYさんの方法で実際にやってみましたところ、『最初はメールフォームを表示させないで、文章をクリックして初めてメールフォームを登場させる』ことが出来ました！
ありがとうございます♪
しかし、これだけですとメールフォームを表示させるときに投稿したブログの一番下のサイドバーに表示されてしまい、『メールフォームはどこ行った！？』状態です。
メールフォームをただ下に出すのではなく、２枚目のインターネットを立ち上げてそこに出力（意味が正しく伝わればいいのですが）というような方法はありませんでしょうか？
もう少しで理想の形が完成しそうです。
皆様、よろしくお願い致します。

>>#2 ２枚目のページを立ち上げてそこに出力というような方法はありませんでしょうか？
う～ん、通常だとできるんですけど、試してみたところではNINJAのスクリプトからスクリプトを書き出すところで（defer 指定があるために？）待機状態になってしまってうまくいかないようです。
簡単にはメールフォームのページをあらかじめ用意できれば、ただそれをリンクによって別窓で開けばいいだけなんですけど、ライブドアの場合PRO版ではできても無料版だと(HTMLファイルのアップロードができないので)できません。
メール投稿用記事を書いて、それを開くことはできるかもしれませんが、多分それはイメージとは違うでしょう。

サイドバーが落ちる(多分そういうことですよね)件については、サイドバーの幅が狭くてフォーム(の幅)が表示できないのかなとか思いますが、
NINJAの場合、ＣＳＳで色々と指定ができるようなので、落ちないようにできるかもしれません。
あと、記事として未来の日付(例えば２０２０年とか)の記事を作ってそこを連絡版代わりに使ってそこでメールフォームを表示するというのも１つの方法かも知れません。

BLUEPIXYさんへ。
早速の返信ありがとうございます！

NINJAのメールフォームにはそれほど拘っていないので、他に理想の形で設定できるメールフォーム（無料）があればお願いできますでしょうか？

＞簡単にはメールフォームのページをあらかじめ用意できれば、ただそれをリンクによって別窓で開けばいいだけなんですけど
これを見て思いついたのですが、『自己紹介はこちら』という文章をクリックして、あらかじめ用意してある自己紹介用のページに切り替わるということも可能でしょうか？
また、その場合も無料版では不可能でしょうか？

最後に『メール投稿用記事』なのですが、２週間前に始めたばかりでイメージがわきませんが、どのようなものでしょうか？
お手数ですがよろしくお願いします。

BLUEPIXYさんへ。
２回目のコメントにある、
＞サイドバーが落ちる件については、サイドバーの幅が狭くてフォーム(の幅)が表示できないのかなとか思います
まさしくその通りです！
サイドバーの幅が設定できるのならばその方法を教えて頂こうとも思ったのですが、良く考えてみましたところ、バランスが悪くなると思い中止しました。

＞NINJAの場合、CSSで色々と指定ができるようなので
このCSSというのはどの部分でしょうか？

＞未来記事の中にメールフォームを貼り付け
この方法があったことにすら気付きませんでした！
最初のイメージとは違いますが、サイドバーも落ちなくてすみますし、読者の方も使いやすいと思い設置してみました。
素晴らしい方法ありがとうございます！！

一応後学の勉強のため、引き続きサイドバーでのメールフォーム設置の意見をもう少し聞かせて頂きたく思いますので、暫く未解決のままにさせて頂きます。

BLUEPIXYさん。
すみません。
投稿記事の中にメールフォームを設置するという方法ですが、実際に表示して確認してみましたところ（先ほどは『内容を確認する』でチェックしておりました）、記事内に収まっているにもかかわらずサイドバーが落ちておりました。
しかもブログ編集で『内容を確認する』で確認後、『編集画面に戻る』『この内容で投稿する』ボタンがクリックしても処理を受け付けません。
何か特別な構文が必要なのでしょうか？

重ね重ね申し訳ありませんでした。

>>#5 他に理想の形で設定できるメールフォーム（無料）があればお願いできますでしょうか？
私は、メールフォームを設置したことがないので、よく存じません。NINJA についてもそうですが、NINJA TOOLS のユーザではあるので、サンプルページぐらいはみれます。

>>#5 あらかじめ用意してあるページに切り替わるということも可能でしょうか？
既に述べたように、無料版ではライブドアブログに別ページを用意することはできません。他のサイトに紹介ページを用意すればできると思います。

>>#5 メール投稿用記事
既にやられてようですので略

>>#6 このCSSというのはどの部分でしょうか？
CSS(カスケーディング スタイル シート)、スタイルシートのことです。
管理ページのデザインのカスタマイズで設定できます。
NINJA メールフォームの場合設定画面で設定できるようです。

>>#7 記事内に収まっているにもかかわらずサイドバーが落ちておりました。
試しにウチのブログで記事に貼り付けてみましたが、そのためにサイドバーが落ちるということはありませんでした。
プラグインの方は削除されましたか？
状況がよくわかりませんので、よろしければブログアドレスを教えて下さい。

>>#7 内容を確認する～クリックしても処理を受け付けません。何か特別な構文が必要なのでしょうか？
改行を変改しない設定で投稿するぐらいだと思います。
想像ですが、やはりスクリプトを書き出すスクリプトが悪さをしているのではないか？と・、プレビューしないで投稿してみて下さい。

BLUEPIXYさん、本日もご指導ありがとうございます♪
＞他のサイトに紹介ページを用意すればできると思います。
これについてはNINJAのブログを使用してやって見ようと思います。

CSSにつきましては、ちょっとまだ分かりませんので勉強しながら進めてみます。

私のブログを実際に見ていただけるとのこと、
ありがとうございます。
http://blog.livedoor.jp/live1192119229112911/
これが私のアドレスです、よろしくお願い致します。
現在は、トップから２番目の記事（アフィリエイト商材の検証報告）に、『★ザク之助へ密書を出す★』をクリックして頂いてメールフォームを表示するという方法です。メールフォームを表示しますとサイドバーが落ちます。
なお、サイドバーのメールフォームは<a href="mailto:メルアド">表示される文章</a>です。
よろしくお願い致します。

>>#10 メールフォームを表示しますとサイドバーが落ちます。
ブログ拝見させていただきました。
結論から言うと、
.title {
の指定がかぶっているために、メールフォームのタイトル部分にその影響がでています。
padding-right が175px になっていると思いますが、これが長すぎます。
(長いタイトルの時変なところで改行されますし)こうする必要がよくわかりません。
例えば、他の回りと同じ 9pxでよろしいかと思います。
あと、同じく
.title 設定で
color: #ffffff になっているため
メールフォームのタイトルが白地に白字でみえなくなっております。

BLUEPIXYさん。
ありがとうございます。
そして返事遅れましてすみません。
教えて頂いた日から、いろいろと実際に入力して、
現在のフォームに落ち着きました。
ただ、以下のことがどうしても解決できませんでした。お手数ですがお教え願えませんでしょうか？

１）タイトル名と説明文、メールフォームともに中央ぞろいの設定にしたにもかかわらず、タイトルは左詰で、文字に余裕があるはずなのにフォントサイズを１１以上にしたり文字数をこれ以上多くすると勝手に改行されます。
何故かタイトルだけです。（枠線の変更も効きません）

２）タイトルや説明文の背景を変えることは可能でしょうか？
また『正常に送信しました』などの文章の色を指定して変えることは可能でしょうか？

３）送信が終わったあと、自動もしくは手動でメールフォームを閉じるにはどうすればよいのでしょうか？

以上です。よろしくお願い致します。

>>#12
＞１）タイトル…勝手に改行されます。
#11で言っているのと同じ原因です。
ＮＩＮＪＡの方のスタイル指定に

padding:0;

padding:9px 175px 9px 9px;

.result { color:red }

>>#12
＞３）送信が終わったあと、自動もしくは手動でメールフォームを閉じるにはどうすればよいのでしょうか？
回答２の最後の</div>の前に

<button type="button" onclick="document.getElementById('MyMailForm').style.display='none';return false;">メールフォームを閉じる</button>

BLUEPIXYさん。
ありがとうございます！
おかげで手動でメールフォームを閉じるボタンの設置が出来ました。実際にブログを立ち上げて動作を確認しましたので他の方も出来るはずです！

ＮＩＮＪＡの方のスタイル指定に『padding:0;』を設置する方法が分かりませんので、比較的分かりやすいブログのほうでやってみようと思ったのですが、ブログのスタイルシートも良く分かりません（汗）。
これは……『投稿したブログ』の本文とは違う場所で設定するのでしょうか？
設定の場所が良く分かりませんので、もう少し詳細にお教え願えませんでしょうか？
毎日お手数をおかけして申し訳ありませんが、なにとぞよろしくお願い致します。

>>#15 ブログのスタイルシート
カスタマイズ管理からデザインのカスタマイズ
でスタイルシート（ＣＳＳ）が表示されます。
その中に、

.title{
	font-size:14px;
	font-weight:bold;
	color:#FFFFFF;
	padding:9px 175px 9px 9px;
}

BLUEPIXYさん、凄い凄い！
もう少しで出来そうです！
それにしてもこういうところで設定できるんですね（尊敬）！

メールフォーム関係の『必須項目が未記入です』や『送信しました』のみ黒か赤色で表示したいのですが、.result { color:red }の構文はどこに入れればいいのでしょうか？
一応考えて以下のようにしてみたのですが、
上手くいきませんでした。
よろしくお願い致します。

.title{
font-size:14px;
font-weight:bold;
color:#FFFFFF;
padding:9px 175px 9px 9px;
.result { color:red }
}

.title{
font-size:14px;
font-weight:bold;
color:#FFFFFF;
padding:9px 175px 9px 9px;
.result { color:red }
}
でなくて

.title{
　font-size:14px;
　font-weight:bold;
　color:#FFFFFF;
　padding:9px 9px 9px 9px;
}
.result { color:red }

BLUEPIXYさん、ありがとうございます。
昨日これを実行してわざとエラーを出したときは、黒文字だったため違うのかなと諦めておりました。

BLUEPIXYさんの教えてくださったこの方法ですと、
メール送信が終わった後の色は変えられるのですが、
『＊＊が入力されてません』などのエラーの色は変わらないのですが、この色を変えるにはどこに入れればよいでしょうか？

>>#19 エラーの色色を変えるには

.error { color:red }

BLUEPIXYさん。
返事遅れまして大変申し訳ありませんでした！
仕事の都合上、ここ数日ログインできませんでした。（＞＜。）
BLUEPIXYに教わったとおりにやりましたら、
上手くいきました！　理想のとおりとなりました！
本当にありがとうございました。

今度はこれと同じものをサイドバーに設置してみます。サイズの小さいメールフォームを新しく作って設置すれば大丈夫だと思うのです。『メールフォームを閉じる』のボタンも『閉じる』など文字数を減らせば横幅の短いボタンが出来るから大丈夫だと思うのですが、何か問題ありますでしょうか？
明日実際にやってみてからまた詳しく質問させていただきます。そのときはよろしくお願い致します。
最後に返信遅れましたことを再度お詫びさせていただきます。