この記事は約 2 分で読めます

エックスサーバーのメールフォームをレスポンシブ対応させる方法

メールフォームのサイズが固定されているとレスポンシブ対応にならないので困る

 

エックスサーバーのメールフォームがレスポンシブ対応にならないと困っている方はいませんか?

 

  • IFRAMEタグで貼り付けたらフォームの端が切れてしまう。
  • スマホ画面だとメールフォームが横スクロールバーになってしまう。

こういうのって困るでしょ。

 

今回は、メールフォームが画面サイズに合わせて伸び縮みさせる方法を教わったのでシェアします。

 

エックスサーバー提供のCGIメールフォームの話なのですが、CSS設定だから他のもいけるかもしれません(未確認ですが)

 

メールフォームがサイズに合わせて伸縮するCSS設定方法を教えてもらった

 

ズバリ、ここの記事よりも詳しく書いてくれているページを紹介します。

もはや最初からこのページを紹介すればよかったかもです。

 

エックスサーバーのメールフォームの設定なら上記ページの方が分かりやすい。ここは短文記事で、まぁいわゆる紹介記事なんですね。

 

2日前からこれを紹介しようしようと思って、ついつい違う記事になってしまいました。

 

そして今回のこの記事が結論となりました。

 

単に記事ネタとして記事数が増えただけのような気もしないではないが・・・

 

過去記事と今回記事、計3記事のまとめ

 

お問い合わせページを作ること自体を記事ネタとして取り上げた結果として3つの記事が出来上がりました。

 

◆1回目の記事

 

◆2回目の記事

 

◆今回のこの記事

 

  • お問い合わせフォームを作ろうとした記事ネタを書く(1回目の記事)
  • Contact Form 7 プラグインを使いたくなかった。(1回目の記事)
  • フォームを貼り付けたけど上手くいかなかった(2回目の記事)
  • フォームを伸縮自在のレスポンシブ対応にするにはどうしたらいい(2回目の記事)
  • ついにお問い合わせフォームが完成したよ報告(今回のこの記事)
  • お問い合わせフォームをレスポンシブ対応に出来た方法をシェア(今回のこの記事)

 

これだけのことを短文記事にして3つの記事が出来上がったというわけです。

 

ブログは100記事が出来てからがスタートという考え方

  • まずはともかく数を書く、
  • 稚拙でも何でもいいから記事を書く、
  • 考えるより前にまず書け
  • 出来た後から考えたり修正・推敲したらいい

 

こんな考えで今やっと6記事目のここまで進んできました。

分かりにくいとか関係ないです。

 

今はまだスタート地点の100記事にも到達していない6記事目なのですよ、だから分かりにくくてもいいんです。

 

この記事マラソンのウォームアップはまだまだ続く。

年内には終わらんと思うけど・・・

 

最後にエックスサーバーのリンクしときますっ!