[←Back]   6. フリーのCGIを改造しよう  [Next→]
   6-1 ページのデザインを変更しよう
「配布されているCGIの改造…」といっても、ほとんどの場合はページのデザインを変更するだけだと思います。
ここでは、「左寄せされているタイトルをセンタリングする」という例でいってみましょう。

この場合、まずCGIプログラムのどの部分がタイトルを表示しているのか探す必要があります。
タイトルの場合には、変数に入れられている場合もあるので注意しましょう。

で、例えば下の部分がタイトルを表示していると分かったとします。
   print "$title";
そうしたら、下のように
   print "<CENTER>$title</CENTER>";
と、CENTERタグで囲んであげるだけでOKです。単純ですね。

ただし、<FONT SIZE="5">のように、「"」を使う場合は注意しましょう
見ての通り、print文は 「"……"で囲まれた部分を表示しろ」 という命令ですから、タグの中で「"」を使うとエラーになってしまいます。
そのため、「"」を使うときには「\"」としましよう。(下の例のようにします)
   print "<CENTER><FONT SIZE=\"5\">$title</FONT></CENTER>";


また、タイトルを表示する部分が次のように書かれている場合もあります
   print <<EOM;
   $title
   EOM
この場合は、print <<EOM; 〜 EOMで挟まれた部分は、全てHTMLに表示されます。さらに、「"」もそのまま使えます
なので、いつも通りにタグを使ってあげましょう。
   print <<EOM;
   <CENTER><FONT SIZE="5">$title</FONT></CENTER>
   EOM


   6-2 「EASY 投票」を改造しよう
ここではEASY CGIで配布している「EASY 投票」を改造します。

投票といえば、普通は「好きな果物は?」と聞かれて「リンゴ」「みかん」…のように1つの項目を答ます。
でも、人によっては「○○の××」という答えが必要になる使い方をする人もいるでしょう。
僕の場合も、「曲名」と「アーティスト名」という2つの項目を入力してもらいたかったので改造しました。
またグラフの横幅が大きく設定されているため、ブラウザの横幅が狭いとデザインが崩れることがよくありました。

…というわけで、改造した箇所は主に次の2つです
   ・「アーティスト名」欄の追加 (下のサンプルを見てください)
   ・グラフの横幅を固定


 ▼改造版のサンプルと、そのファイルはこちらから
サンプル (実際に使用しているので、「test」のような項目は追加しないでください)
CGIファイル (パスワードは、ちゃんと変えてありますよ〜)

●解説

[←Back]   BACK   [Next→]