「a-Column」汎用操作マニュアル

（えでぃっとはうす、2004.2.5作成、2004.5.5更新）
2004.5.5追記分、2004.3.16追記分、2004.3.5追記分、2004.2.28追記分1、同2

　「a-Column」は、ジャンル分けできるコラム作成用のCGIスクリプト（注1）で、テキストの書き込みや更新、写真の配置などが簡単にできます。そして、すべてのページをHTML（注2）ファイルに書き出すのが特徴です。
　よく掲示板などで利用されているCGIの場合、閲覧者はCGIスクリプトに直接アクセスし、スクリプトはその時にデータを読み込んで、その場限りのいわば一時ファイルをHTML形式で表示します。
　このCGIスクリプトは、登録した記事をHTMLファイルとして保存します。閲覧者はそのHTMLファイルにアクセスしますので、注意深くなければ、一般にはCGIスクリプトの存在は見えません。
　ただ、「いつHTMLファイルとして書き出すのか」を知っておかないと、「訂正したはずなのに直ってない」とか「いつの間にか変わってる」ということになりかねません。この点に留意しながら扱ってください。
　なお、サンプルはMacintosh環境のものです。OSやブラウザが違うとボタンの形状なども変わりますが、扱いは基本的に同じです。


ログインとログアウト
記事の書き込み
記事(写真)の追加
記事の訂正・更新
記事の削除
HTMLファイルの書き出し・その他注意点


【ログインとログアウト】
  1. 編集作業はすべてCGIスクリプトにアクセスして行います。まず、パスワード入力エリアにパスワードを入力し「admin」をクリックします。パスワード入力エリアは、コラムのタイトル一覧表示部分の近くにあります（別の管理ページに設置しているケースもあります。04/2/28追記）。
サンプル
  1. 認証されると、編集作業画面にログインします。「コラム新規追加」「index.htmlの生成」というボタンが目立ちますので（表示される位置はページデザインによって異なります）、これが編集画面の最初と記憶しておいてください。
サンプル
  1. ページ下方の「admin」ボタンがあったところに、ログオフボタンが表示されています。ログオフするには、この「LOGOFF」ボタンを押します（設定によってはこのボタンが表示されていないケースもあります。04/2/28追記）。
サンプル
  1. このように「ログイン」は編集作業ページにアクセスすること、「ログオフ」はそこから出ることです。しかし「ログオフ」状態でもアドレス欄には「a-column.cgi」と表示され、CGIスクリプトが作動していることを示しています。つまりこのスクリプトは、CGIにアクセスして閲覧することも可能なのです。HTMLファイルに書き出すのは、サーバの負担を軽くするためです。
    後述するように、編集作業の最後に「index.htmlの生成」でタイトル一覧を含むページをHTMLファイルに書き出しますが、これをせずに「ログオフ」だけすると、タイトル一覧ページは更新されません。「index.htmlの生成」は同時にログオフもしますので、編集作業の最後は「index.htmlの生成」で締めくくる、というワームフローにしておくのがよいでしょう。
サンプル
  1. バージョン2.3xから改ページ機能が追加され、タイトル一覧ページで、ジャンルごとに改ページすることが可能になりました。
    この際、「index.htmlの生成」を行ったあとで改ページを確かめようと「次へ」をクリックすると、編集画面に戻ってしまうことがあります。改ページ機能はCGIで行われているので、「次へ」をクリックするとCGIによるページ表示となるのですが、この時編集モードからログオフしていないと編集画面になってしまうわけです。どうやら「index.htmlの生成」だけではきちんとログオフしないようです。
    なので、改めて「LOGOFF」ボタンでログオフをすれば問題ありません。「LOGOFF」ボタンが表示されない設定の場合は、一度ブラウザを終了して再起動すればOKです。
    なお、これは管理者だけの問題で、一般にアクセスする人には関係ありません。（04/5/5追記）
サンプル

▲TOP

【記事の新規書き込み】

　このCGIの記事エリアは、画像とテキストをワンブロックにして、積み木を重ねていくようにブロックを追加し、あたかも一つの記事にたくさんの写真が配置されているかのように見せる仕組みになっています。
　そのため、とりあえずテキストを流してあとから写真を追加するという発想では、うまく作業できませんからご注意ください。
　なにはともあれ、まず新規に記事を書き込みましょう。

  1. 「コラム新規追加」をクリックします。
    表示された新規登録画面でまず、書き込むジャンルを選択します。HTMLファイルは、ここで選んだジャンルのフォルダに保存されます。ただしジャンル分けしていない場合、この項目は表示されません。
サンプル
  1. 「タイトル」欄にタイトルを、「内容」欄に本文を書き込みます。他のテキストエディタからコピー＆ペーストするのが楽でしょう。
    写真を掲載したい時は、あらかじめ写真データを用意しておき、ここで「参照」をクリックしてパソコン内の写真データを指定します。
    写真の配置は「参照」の横のプルダウンメニューから選びます。左寄せ、右寄せしてテキスト回り込み、あるいはテキストの上側または下側に配置できます。
サンプル
「参照」をクリックすると下のような画面が現れて（パソコン・OSによって画面は違います）、パソコン内のデータを選べるようになります。ファイルを選んで「開く」をクリックすると、写真エリアに該当ファイル名が入ります。
写真は、あらかじめ画像編集ソフトで補正、リサイズして（可能なら解像度も72dpiに）、JPG形式で保存しておきます。インターネットで扱うので、ファイル名には英数字を使用します。
貼り込まれる画像の最大サイズは、左右配置で幅300ピクセル、センター配置なら幅500ピクセルが初期値です。
画像サイズを変更しなくてもスクリプトによって、大きなサイズの画像は上記サイズに自動調整されて表示されます。しかし表示サイズを変更するだけですので、無駄に重いデータをもっていることになります。また、大きすぎると送信できないこともあります。ファイルサイズとしても、おおむね50KB程度を目安として、小さくするのがベターです。
サンプル
「簡易タグエディタ」の「URL挿入」（注3）をクリックすると、サンプルのようなタグが文末に挿入され、リンクボタンが簡単に作れるようになります。
「URL」という部分をリンク先URLに、「Link」という部分をリンクボタンにしたいテキストに書き換えます。
ブラウザの別ウインドウにリンク先ページを開いておき、そのアドレス欄からURLをコピーして「URL」部分に貼り付ければ、タイプミスを防げます。
サンプル
なおこれは、リンクボタンをクリックすると新しいウインドウが開き、そこに表示される設定です。
新規ではなく同じウインドウに表示したい時は「target="_blank"」を削除します。
「簡易タグエディタ」の「Bold挿入」をクリックするとサンプルのようなタグが文末に挿入されますので、「太字」という部分を太くしたいテキストに書き換えます。
サイトによっては「センタリング」「右寄せ」なども追加している場合があります。同様にタグに囲まれた部分のテキストを書き換えます。ただし「センタリング」「右寄せ」の場合は、その行または段落だけで1ブロックとなるようにしてください。（04/3/16追記）
サンプル
  1. テキストと写真が入ったら「登録」ボタンを押します。この時に、この記事のHTMLファイルが生成されます。
    正常に書き出せると、次のようなボタンをもつ画面になります。
サンプル
  1. 追加する記事がない場合、チェックして問題がなければこれで新規の記事登録は終了です。「一覧」をクリックし、他に作業がなければHTMLファイルの書き出しをして、完了です。
    なおこの画面は、編集作業時に一覧ページでタイトルをクリックして表示される画面と同じで、ある記事に対して処理を選択するメニュー画面となります。

▲TOP

【記事(写真)の追加】

　記事の追加は、ようするに写真の追加です。テキストの追加だけなら「更新」でも可能です。ただし、写真だけ追加することはできません。必ずテキストとセットで登録します。
　記事に複数の写真がある時は、テキストを写真の枚数と同じ数に分割し、一つずつ追加しながら掲載していくことになります。
　まず1枚目は新規書き込みとまったく同じです。登録したら、画面は上記のメニュー画面になっています。ここから追加します。

  1. 「追加」をクリックします。下方に元の記事、上に新規登録時と同じ入力欄が表示されます。
  2. 記事の入力の要領は、新規作成とまったく同じです。最後に「上追加」または「下追加」をクリックします。
サンプル
  1. すると、選んだ側に記事が追加されます。その対象は既存記事の全体です。正常に追加されると、メニュー画面に戻ります。この時、HTMLファイルは上書き保存されます。
  2. さらに追加をする時は、同様の作業を繰り返します。最後に一覧ページに戻り、HTMLファイルの書き出しをして、完了です。
  3. 記事を追加する場合、一つひとつのブロック間には1行程度のアキができます。通常の記事の中でも段落区切りに1行アキを設けるなどしていると、このアキはそう目立ちません。むしろうまく活用されるとよいかと思います。

▲TOP

【記事の訂正・更新】

　登録年の変更、タイトルの変更、年月日の変更、記事本文の変更・削除、写真の配置変更・削除ができます。年月日の変更はここでしかできませんので、過去の記事を掲載する時は、一度通常通り掲載した上で、この「更新」で日付を変更するとよいでしょう。

  1. メニュー画面で「更新」をクリックします。
  2. 入力等の要領は新規作成と同じで、操作可能な部分はすべて変更可能です。ただし、簡易タグエディタはありません。
    また、写真を削除しても記事は残りますが、記事を削除すると写真も削除されますので注意してください。
    さらに、一度に複数の画像を操作しようとするとエラーになることがあります。たとえば、テキストだけしかないエリアには画像を追加配置することができますが、その場合も1枚ずつ（1か所ずつ）送信するようにします。
    バージョン2.20以降では、「日付更新」にチェックを入れておくと、作業した日付に自動更新されます（04/3/5追記）。
サンプル
  1. 訂正が終わったら、下方にある「更新」ボタンをクリックします。記事が訂正され、メニュー画面に戻ります。この時、HTMLファイルは上書き保存されます。
サンプル
  1. 一覧ページに戻り、HTMLファイルの書き出しをして、完了です。

▲TOP

【記事の削除】
  1. 記事を削除する時はまず、一覧画面で削除したい記事をクリックします。
  2. タイトル下の右端の削除ボタンをクリックします。
  3. 記事が削除されて、一覧画面に戻ります。
サンプル

▲TOP

【HTMLファイルの書き出し・その他注意点】

　個別の記事の編集作業が完了したら、一覧ページに戻ります。ここで最後に、タイトル一覧を含むページ（「index.html」など）をHTMLファイルに書き出します。
「index.htmlの生成」をクリックすると、この時表示されている一覧と同じものがHTMLファイルとして生成され、従前の「index.html」ファイルに上書き保存されます。
　この作業をせずに「LOGOFF」すると、一覧ページは更新されずに従前のままとなりますので要注意。最後は「index.htmlの生成」で締めくくるようにしてください。

サンプル

　その他、次のような点にも注意してください。

  • 表示日付……日付は、新規登録時に自動登録されます。「追加」をする際に「日時　更新する」のチェックボックスにチェックを入れていると、追加した日時に更新されます。「更新」時に「日時」欄で任意の年月日に変更可能ですが、その後に「追加」して更新チェックがあると、また更新されます。
    いずれにせよ、記事ページの「Update」欄、および一覧の各記事タイトル末尾に表示される日付は、この日付です。
    トップページの「Last Update」欄に表示される日付は、最新の記事が実際に書き込まれた日です。
  • 表示件数……トップページに表示されるタイトルの件数は初期値5件です（実際の設定はサイトによって異なります）。それを超えると最下段に「more ...」と表示され、それをクリックするとそれぞれのジャンルの一覧ページにジャンプします。一覧ページは、それぞれすべてのタイトルを表示します。
  • CGIとHTMLファイル……CGIが書き出すHTMLファイルにはページの要素をすべて含んでいますが、いったんHTMLファイルに書き出されると、更新等をしない限りCGIからは独立したものとなります。
    そのため、たとえばページデザインを変更すると、CGIの設定を変更するだけでは既存ページには影響が及びません。合わせるためには、全ページを再度書き出すなどの作業が必要になってきますので、あらかじめご承知おきください。

▲TOP

（注1）CGIスクリプト
CGI（Common Gateway Interface）はWebページ上で簡単なプログラムを動かすための仕組みです。「スクリプト」と呼ばれる簡易なプログラムをサーバ上に置いておき、ホームページ上などから命令を送って動かします。インターネットでは、カウンターや掲示板、チャット、メールフォーム、日記など、さまざまなものに利用されています。
（注2）HTML
HTML（HyperText Markup Language）は、テキストなどをホームページ閲覧用ブラウザに表示するためのマークアップ言語です。テキストを書いただけではブラウザに表示することはできませんが、これに「タグ」と呼ばれるマークをつけることで、ブラウザでの表示が可能になります。
マークといってもタグもテキストで書きますから、Webページ（HTMLファイル）は特別なソフトがなくてもテキストエディタで作れます。同様に、CGIスクリプトの設定で許可がされていれば、ホームページ上から書き込むこともできます。掲示板などでは、いたずら防止のためほとんどがタグ不許可です。
（注3）URL
URL（Uniform Resource Location）は、ホームページのアドレスのことです。
リンク先をURLで指定するのは「絶対指定」と呼ばれ、リンク元とリンク先のページの位置関係に関わりなく、キチンとリンクがつながります。外部リンクはすべてこの方法です。
一方、ディレクトリ名やファイル名で指定するのは「相対指定」と呼ばれ、リンク元から見たリンク先のページの相対的な位置関係で指定します。内部リンクはこちらが一般的ですが、サイト構成が複雑だったりブラウザから書き込むような場合は、絶対指定の方が無難です。