メルマガ登録フォームの行間を狭める ブログ入門講座 中級編

今回は、読者の方よりご質問のあった、「メルマガ登録フォームを記事内にアップすると行間が広すぎて、見栄えが悪いので、行間を狭めるにはどうしたらいいですか?」この方法を解説します。

有名ブログ☆ランキング14位!(^^;)
人気blogランキング現在22位!(^^;)
鬼ブログランキング/起業・独立4位!
(^^)
鬼ブログランキング/ブログカスタマイズ3位!
(^o^)/

ミクシィ経由でメールをくれたのは、マイミクゆーきんちゃん。ブログ:スタイルのない人生なんてクズよ!
の管理人さん。

今はすでに、解決済みです。(^^)

左側の行間がやたら開いている方が、まぐまぐ!の登録フォームのソースをそのまま貼り付けた場合。
右側のすっきりした方は、そのソースをちょこっといじった場合。

メルマガ登録フォーム1 メルマガ登録フォーム2

結論から言えば、まぐまぐ!からの提供ソースの <br> を削除し、改行部分も削除してソースを詰めます。

理由は・・・

先ず第一に、ブログの管理画面からの記事作成時には、デフォルト(初期設定)では、改行がそのまま反映されるようになっています。

実は、ソースの記述も自動改行されてしまうのです。

このために、さらに詳しく設定する投稿フォームの改行設定 というのがあるわけです。

しかし、ここで ○改行しても反映しない を入れてしまうとテキストを入力し、改行ささせるには、<br> タグを改行箇所、全てに入れてやらなければなりません。
これは、文章が長くなるとちょっと大変ですね。

ですので、ソースの方をいじってやります。


下記は僕のまぐまぐ!から提供されているメルマガ登録フォームです。
『ブログ(ウェブログ)入門講座〜今日からブロガー』(ID:0000160275) 読者登録解除フォーム<br>
<font color="#990000" size="-1">
メールアドレスを入力してボタンを押すと登録・解除できます。</font>
<br>
<form action="http://regist.mag2.com/reader/Magrdadd" method="POST">
登録フォーム<br>
<input type="hidden" name="magid" value="0000160275">
<input type="text" name="rdemail" value="">
<input type="hidden" name="reg" value="hakkou">
<input type="submit" value="登録">
</form>
<form action="http://regist.mag2.com/reader/Magrddel" method="POST">
解除フォーム<br>
<input type="hidden" name="magid" value="0000160275">
<input type="text" name="rdemail" value="">
<input type="hidden" name="reg" value="hakkou">
<input type="submit" value="解除">
</form>
<a href="http://www.mag2.com/">
<img src="http://www.mag2.com/images/mglogo22.gif"
alt="まぐまぐ" border="0"></a><br>
<font color="#990000" size="-1">『まぐまぐ!』から発行しています。</font>
よく見るとすでに <br> 改行タグが入っていますね。

これだとブログの記事へ普通にとうこうすると出来あがったソースは、

 『ブログ(ウェブログ)入門講座〜今日からブロガー』(ID:0000160275) 読者登録解除フォーム<br><br>

と2行分が改行されてしまいます。

ですので、まず、まぐまぐ!からのソースの <br> を5ヶ所、すべて削除します。
そして、改行部分も削除して、ソースを詰めます。すると下記のソースのようになります。

メルマガタイトルなどのテキストは、お好きなところで改行してください。
<br>を入れる必要はありません。

登録フォームのテキストとボックスと登録ボタンがくっつかないように、一部、半角スペース(*)を入れてあります。

『ブログ(ウェブログ)入門講座〜今日からブロガー』
(ID:0000160275) 読者登録解除フォーム
<font color="#990000" size="-1">メールアドレスを入力してボタンを押すと登録・解除できます。</font>
<form action="http://regist.mag2.com/reader/Magrdadd" method="POST">登録フォーム*<input type="hidden" name="magid" value="0000160275"><input type="text" name="rdemail" value=""><input type="hidden" name="reg" value="hakkou">*<input type="submit" value="登録"></form><form action="http://regist.mag2.com/reader/Magrddel" method="POST">解除フォーム*<input type="hidden" name="magid" value="0000160275"><input type="text" name="rdemail" value=""><input type="hidden" name="reg" value="hakkou">*<input type="submit" value="解除"></form><a href="http://www.mag2.com/"><img src="http://www.mag2.com/images/mglogo22.gif" alt="まぐまぐ" border="0"></a><font color="#990000" size="-1">
『まぐまぐ!』から発行しています。</font>

そしてこれを記事内に投稿すると(解除フォームははずしてあります。笑)、


『ブログ(ウェブログ)入門講座〜今日からブロガー』
(ID:0000160275) 読者登録フォーム
メールアドレスを入力してボタンを押すと登録できます。
登録フォーム
まぐまぐ
『まぐまぐ!』から発行しています。


是非、ご登録くださいませ♪ (^^)


有名ブログ☆ランキング14位!(^^;)
人気blogランキング現在22位!(^^;)
鬼ブログランキング/起業・独立4位!
(^^)
鬼ブログランキング/ブログカスタマイズ3位!
(^o^)/


サイトマップはコチラ ⇒ ◆コンテンツ一覧◆
 
   
メルマガ登録 ID: 0000160275
ブログ作成入門講座
 
バックナンバー powered by まぐまぐトップページへ
Posted by ブログ作成入門講座 at 14:57│Comments(5)TrackBack(1) | Edit
この記事へのトラックバックURL
http://trackback.blogsys.jp/livedoor/blomal/50100236
この記事へのトラックバック
初めてのトラックバック、できました!
電話はふたつね【スタイルのない人生なんてクズよ!】at 2005年09月21日 05:58
この記事へのコメント
okiさぁーん!

トラックバックしてあるー!と思ってのぞいたら、
ここに私の名前があるからびっくりしました。
ありがとうございました〜☆
し・か・も、メルマガでまでーーーーーーー

もお、びっくりの連続で、二人で大騒ぎです(笑)

これからもお世話になりますので、
よろしくお願いいたします。


…さっそく、トラックバックのやり方がわからず、
これからoKiさんのブログで調べます!!
Posted by ゆーきん at 2005年09月21日 05:14
▼ゆーきんちゃん

いらっしゃいませ♪

> トラックバックしてあるー!と思ってのぞいたら、
> ここに私の名前があるからびっくりしました。
> ありがとうございました〜☆

いえいえ、こちらこそ。質問をしっかりネタに使わせていただきました。(^^)

> …さっそく、トラックバックのやり方がわからず、
> これからoKiさんのブログで調べます!!

うまくいったみたいだね。(^^)
いっぱい記事を書いて、いっぱいトラックバックして、
いっぱいコメントを書くときっといいことがあるよ♪

 oKi
Posted by ブログ(ウェブログ)入門講座〜今日からブロガー at 2005年09月21日 10:13
okiさん

有名ブログは、カテゴリー1位ですよ〜!
Posted by ヤナギ at 2005年09月21日 16:29
okiさん

はじめまして。
櫻木さんのメルマガを見てやってきました。

ブログをレベルアップしていくための情報が満載なのでとても嬉しいです。
サイトマップもありがたいですね。

いろいろ勉強させていただきたいので、よろしくお願いします。
Posted by 幸せ成功力アップEQのブログ・野口 at 2005年09月21日 22:13
▼野口さん

> はじめまして。櫻木さんのメルマガを見てやってきました。

いらっしゃいませ♪ (^^)

> ブログをレベルアップしていくための情報が満載なのでとても嬉しいです。

ありがとうございます。是非、お役立てください。

> サイトマップもありがたいですね。

当ブログ、一番人気です。(笑)

では、今後ともよろしくお願いいたします!

 oKi
Posted by ブログ(ウェブログ)入門講座〜今日からブロガー at 2005年09月22日 07:17
 
 
AX