[目次へ戻る]

すぐ使えるCGI 添付ファイル付 ウェブページ更新ツール(日本語 Shift_JIS 版) 説明書

デザイン変更チュートリアル

基本的な動作を確認したら、テンプレートを編集してデザイン変更を行ってみましょう。
設置がまだ済んでいない場合は「ステップ by ステップガイド」から初めて下さい。


  1. 一覧ページのデザイン変更

    まずは一覧ページのデザイン変更を行ってみます。

    1. テキストエディタでファイルを開く

      最初に解凍したファイルのうち、 templates/article/article_list.html をテキストエディタで開いて下さい。

      「テキストエディタ」が無い場合は、下記のオンラインツールを使用して下さい。
      http://sugutsukaeru.jp/cgi/j/36/

    2. ファイルの修正

      title および h1 タグ内に「記事一覧」と書いてある部分があるので、これを試しに変更してみます。「○○株式会社 決算公告」等、お好きなように変更して下さい。

      変更前 (templates/article/article_list.html)
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      <html lang="ja">
      <head>
      <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
      <title>記事一覧</title>
      <link rel="alternate" type="application/rss+xml" title="記事一覧" href="new.xml">
      </head>
      <body bgcolor="#ffffff">

      <h1>記事一覧</h1>

      <ul>
      <!-- article list : generate from article_list.txt -->
      %_article_list_%

      </ul>

      </body>
      </html>
      変更後 (templates/article/article_list.html)
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      <html lang="ja">
      <head>
      <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
      <title>○○株式会社 決算公告</title>
      <link rel="alternate" type="application/rss+xml" title="記事一覧" href="new.xml">
      </head>
      <body bgcolor="#ffffff">

      <h1>○○株式会社 決算公告</h1>

      <ul>
      <!-- article list : generate from article_list.txt -->
      %_article_list_%

      </ul>

      </body>
      </html>
    3. 上書き保存

      変更が終わったらファイルを保存して下さい。
      保存の際の文字コードは Shift_JIS(または CP932 など) にして下さい。

    4. アップロード

      保存したファイルを、サーバにもう一度アップロードします。
      FTPソフトでサーバの templates/article/ ディレクトリに移動して、 編集後の article_list.html をアップロードして下さい。

    5. テンプレート修正後のテスト

      article_list.html をアップロードしたら、管理画面から更にもう1件データを登録してみて下さい。

      登録が終わったら、もう一度「編集結果をチェック: [一覧]」のリンクからページを表示して下さい。
      表示内容が変わらないようであればページの再読み込みをして下さい。

      今度はタイトルが、「○○株式会社 決算公告」と表示されますか?
      このように、デザインはHTML形式で自由に変更する事ができます。

  2. 一覧ページのリスト部分の変更

    先ほどの変更では、一覧ページの全体のデザインが変更されました。
    今度は、記事の内容が表示される部分を変更してみます。

    1. テキストエディタでファイルを開く

      今度は最初に解凍したファイルのうち、 templates/article/article_list.txt をテキストエディタで開いて下さい。

      「テキストエディタ」が無い場合は、下記のオンラインツールを使用して下さい。
      http://sugutsukaeru.jp/cgi/j/36/

    2. ファイルの修正

      日付を表示する部分で「%_yyyy_%-%_mm_%-%_dd_%」と記載されている部分がありますので、これに色を付けてみることにします。
      <font> タグなどのコードを足してみて下さい。

      変更前 (templates/article/article_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      <li>
      %_yyyy_%-%_mm_%-%_dd_%
      <a href="%_d_%.html">%_subject_%</a>
      </li>
      変更後 (templates/article/article_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      <li>
      <font color="#00cc00">%_yyyy_%-%_mm_%-%_dd_%</font>
      <a href="%_d_%.html">%_subject_%</a>
      </li>
    3. 上書き保存

      変更が終わったらファイルを保存して下さい。
      保存の際の文字コードは Shift_JIS(または CP932 など) にして下さい。

    4. アップロード

      保存したファイルを、サーバにもう一度アップロードします。
      FTPソフトでサーバの templates/article/ ディレクトリに移動して、 編集後の article_list.txt をアップロードして下さい。

    5. テンプレート修正後のテスト

      もう一度管理画面を開き、一覧の下にある「再構築(テンプレート変更反映)」ボタンを押して下さい。

      再構築が終わったら、もう一度「編集結果をチェック: [一覧]」のリンクからページを表示して下さい。
      表示内容が変わらないようであればページの再読み込みをして下さい。

      今度は日付に色が付きましたか?

  3. 短い一覧ページのデザイン変更

    短い一覧も同様にデザイン変更ができます。
    以下のようにデザイン変更を試して下さい。

    1. テキストエディタでファイルを開く

      短い一覧用のファイルは、 templates/article/short_list.html です。最初に解凍したファイルから、short_list.html をテキストエディタで開いて下さい。

      「テキストエディタ」が無い場合は、下記のオンラインツールを使用して下さい。
      http://sugutsukaeru.jp/cgi/j/36/

    2. ファイルの修正

      今度は背景色を変更して見ましょう。
      「<body bgcolor="#ffffff">」を変更して「<body bgcolor="#ccccff">」にしてみます。

      変更前 (templates/article/short_list.html)
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      <html lang="ja">
      <head>
      <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
      <title>記事一覧</title>
      </head>
      <body bgcolor="#ffffff">

      <!-- article list : generate from short_list.txt -->
      %_article_list_%

      </body>
      </html>
      変更後 (templates/article/short_list.html)
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      <html lang="ja">
      <head>
      <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
      <title>記事一覧</title>
      </head>
      <body bgcolor="#ccccff">

      <!-- article list : generate from short_list.txt -->
      %_article_list_%

      </body>
      </html>
    3. 上書き保存

      変更が終わったらファイルを保存して下さい。
      保存の際の文字コードは Shift_JIS(または CP932 など) にして下さい。

    4. アップロード

      保存したファイルを、サーバにもう一度アップロードします。
      FTPソフトでサーバの templates/article/ ディレクトリに移動して、 編集後の short_list.html をアップロードして下さい。

    5. テンプレート修正後のテスト

      short_list.html をアップロードしたら、管理画面の一覧の下にある「再構築(テンプレート変更反映)」ボタンを押して下さい。

      再構築が終わったら、「編集結果をチェック: [短い一覧]」のリンクからページを表示して下さい。
      表示内容が変わらないようであればページの再読み込みをして下さい。

      背景色が変更されます。

  4. 短い一覧ページのリスト部分の変更

    短い一覧の記事部分の変更も可能です。
    以下の手順で変更を試してみます。

    1. テキストエディタでファイルを開く

      解凍したファイルの templates/article/short_list.txt をテキストエディタで開いて下さい。

      「テキストエディタ」が無い場合は、下記のオンラインツールを使用して下さい。
      http://sugutsukaeru.jp/cgi/j/36/

    2. ファイルの修正

      タイトルの表示位置に「%_subject_%」と記載されている部分があります。タイトルが目立つように、ボールド表記にしてみます。
      <b> タグを足して下さい。

      変更前 (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_% <a href="%_d_%.html">%_subject_%</a><br>
      変更後 (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_% <a href="%_d_%.html"><b>%_subject_%</b></a><br>
    3. 上書き保存

      変更が終わったらファイルを保存して下さい。
      保存の際の文字コードは Shift_JIS(または CP932 など) にして下さい。

    4. アップロード

      保存したファイルを、サーバにもう一度アップロードします。
      FTPソフトでサーバの templates/article/ ディレクトリに移動して、 編集後の short_list.txt をアップロードして下さい。

    5. テンプレート修正後のテスト

      管理画面を開き、一覧の下にある「再構築(テンプレート変更反映)」ボタンを押して下さい。

      再構築が終わったら、「編集結果をチェック: [短い一覧]」のリンクからページを表示して下さい。
      表示内容が変わらないようであればページの再読み込みをして下さい。

      表示内容が変更されます。

  5. 記事ページのデザイン変更

    記事ページのデザイン変更を試してみましょう。
    一覧ページと同じように自由にデザインを変更できますが、ここではページ間リンクの変更をしてみます。

    1. テキストエディタでファイルを開く

      解凍したファイルの templates/article/article.html をテキストエディタで開いて下さい。

      「テキストエディタ」が無い場合は、下記のオンラインツールを使用して下さい。
      http://sugutsukaeru.jp/cgi/j/36/

    2. ファイルの修正

      ページ間リンク、および一覧へのリンクがありますので、リンクの文字列を変更してみます。

      変更前 (templates/article/article.html)
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      <HTML lang="ja">
      <head>
      <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
      <title>%_subject_% (%_yyyy_%-%_mm_%-%_dd_%)</title>
      <link rel="alternate" type="application/rss+xml" title="記事一覧" href="new.xml">
      </head>

      <body bgcolor="#ffffff">

      <div align="center">

      <table border="0" width="90%">
      <tr>
      <td width="20%"><a href="%_to_prev_%">←前へ</a></td>
      <td align="center"><a href="index.html">↑一覧へ</a></td>
      <td width="20%" align="right"><a href="%_to_next_%">次へ→</a></td>
      </tr>
      </table>

      </div>

      <h1>%_subject_%</h1>
      <div align="right">
      <p>%_yyyy_%/%_mm_%/%_dd_%</p>
      </div>

      %_body_%


      <br>
      <!-- ファイルの表示 -->
      <table cellpadding="2" cellspacing="0" border="0">
      <!-- attached files : generate from article_file.txt -->
      %_file_list_%
      </table>

      <div align="center">

      <table border="0" width="90%">
      <tr>
      <td width="20%"><a href="%_to_prev_%">←前へ</a></td>
      <td align="center"><a href="index.html">↑一覧へ</a></td>
      <td width="20%" align="right"><a href="%_to_next_%">次へ→</a></td>
      </tr>
      </table>

      </div>

      </body>
      </html>
      変更後 (templates/article/article.html)
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      <HTML lang="ja">
      <head>
      <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
      <title>%_subject_% (%_yyyy_%-%_mm_%-%_dd_%)</title>
      <link rel="alternate" type="application/rss+xml" title="記事一覧" href="new.xml">
      </head>

      <body bgcolor="#ffffff">

      <div align="center">

      <table border="0" width="90%">
      <tr>
      <td width="20%"><a href="%_to_prev_%">[previous]</a></td>
      <td align="center"><a href="index.html">↑一覧へ</a></td>
      <td width="20%" align="right"><a href="%_to_next_%">[next]</a></td>
      </tr>
      </table>

      </div>

      <h1>%_subject_%</h1>
      <div align="right">
      <p>%_yyyy_%/%_mm_%/%_dd_%</p>
      </div>

      %_body_%


      <br>
      <!-- ファイルの表示 -->
      <table cellpadding="2" cellspacing="0" border="0">
      <!-- attached files : generate from article_file.txt -->
      %_file_list_%
      </table>

      <div align="center">

      <table border="0" width="90%">
      <tr>
      <td width="20%"><a href="%_to_prev_%">[previous]</a></td>
      <td align="center"><a href="index.html">↑一覧へ</a></td>
      <td width="20%" align="right"><a href="%_to_next_%">[next]</a></td>
      </tr>
      </table>

      </div>

      </body>
      </html>
    3. 上書き保存

      変更が終わったらファイルを保存して下さい。
      保存の際の文字コードは Shift_JIS(または CP932 など) にして下さい。

    4. アップロード

      保存したファイルを、サーバにもう一度アップロードします。
      FTPソフトでサーバの templates/article/ ディレクトリに移動して、 編集後の article.html をアップロードして下さい。

    5. テンプレート修正後のテスト

      article.html をアップロードしたら、管理画面から登録されている記事を編集して下さい。

      編集が終わったら、編集した記事の「チェック」のリンクからページを表示して下さい。
      表示内容が変わらないようであればページの再読み込みをして下さい。

      リンクの表示が変更されます。

      他のページにも変更を反映するには、管理画面一覧の下にある「再構築(テンプレート変更反映)」ボタンを押して下さい。

  6. 添付ファイル部分の表示変更

    記事ページの添付ファイル部分の表示の変更は、2つのファイルの組み合わせで行います。

    記事ファイル用テンプレート templates/article/article.html の %_file_list_% と記載のある部分に templates/article/article_file.txt で指定する添付ファイル表示用のHTMLコードが挿入されます。

    templates/article/article_file.txt で指定するコードは、添付したファイルの数に応じて繰り返されて挿入されます。

    添付ファイル表示用の HTMLコードが挿入される部分(青字) (templates/article/article.html)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <HTML lang="ja">
    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
    <title>%_subject_% (%_yyyy_%-%_mm_%-%_dd_%)</title>
    <link rel="alternate" type="application/rss+xml" title="記事一覧" href="new.xml">
    </head>

    <body bgcolor="#ffffff">

    <div align="center">

    <table border="0" width="90%">
    <tr>
    <td width="20%"><a href="%_to_prev_%">←前へ</a></td>
    <td align="center"><a href="index.html">↑一覧へ</a></td>
    <td width="20%" align="right"><a href="%_to_next_%">次へ→</a></td>
    </tr>
    </table>

    </div>

    <h1>%_subject_%</h1>
    <div align="right">
    <p>%_yyyy_%/%_mm_%/%_dd_%</p>
    </div>

    %_body_%


    <br>
    <!-- ファイルの表示 -->
    <table cellpadding="2" cellspacing="0" border="0">
    <!-- attached files : generate from article_file.txt -->
    %_file_list_%
    </table>

    <div align="center">

    <table border="0" width="90%">
    <tr>
    <td width="20%"><a href="%_to_prev_%">←前へ</a></td>
    <td align="center"><a href="index.html">↑一覧へ</a></td>
    <td width="20%" align="right"><a href="%_to_next_%">次へ→</a></td>
    </tr>
    </table>

    </div>

    </body>
    </html>

    挿入される添付ファイル表示用 HTMLコード(1ファイル分) (templates/article/article_file.txt)

    <!-- Shift_JIS(または CP932 など) で保存して下さい -->
    <tr>
    <td>
    <img src="./icons/%_icon_map_%" width="16" height="16" alt="">
    <a href="%_d_%/%_filename_escaped_%" target="_blank">%_filetext_%</a>
    (%_filename_%)<br>
    </td>
    </tr>

    両方のファイルを変更することにより、表示位置やデザインの変更などが行えますが、ここでは、 templates/article/article_file.txt のみを変更する例を取り上げます。

    1. テキストエディタでファイルを開く

      今度は最初に解凍したファイルのうち、 templates/article/article_file.txt をテキストエディタで開いて下さい。

      「テキストエディタ」が無い場合は、下記のオンラインツールを使用して下さい。
      http://sugutsukaeru.jp/cgi/j/36/

    2. ファイルの修正

      もとのファイルには、リンクテキストに加えてファイル名がカッコ内に表示されています。
      この表示はやめて、ファイル名は title 属性として含めることにします。

      変更前 (templates/article/article_file.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      <tr>
      <td>
      <img src="./icons/%_icon_map_%" width="16" height="16" alt="">
      <a href="%_d_%/%_filename_escaped_%" target="_blank">%_filetext_%</a>
      (%_filename_%)<br>
      </td>
      </tr>
      変更後 (templates/article/article_file.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      <tr>
      <td>
      <img src="./icons/%_icon_map_%" width="16" height="16" alt="">
      <a href="%_d_%/%_filename_escaped_%" target="_blank"
      title="%_filename_%" >%_filetext_%</a>
      </td>
      </tr>
    3. 上書き保存

      変更が終わったらファイルを保存して下さい。
      保存の際の文字コードは Shift_JIS(または CP932 など) にして下さい。

    4. アップロード

      保存したファイルを、サーバにもう一度アップロードします。
      FTPソフトでサーバの templates/article/ ディレクトリに移動して、 編集後の article_file.txt をアップロードして下さい。

    5. テンプレート修正後のテスト

      もう一度管理画面を開き、添付ファイルが登録してあるデータを編集してみて下さい。

      登録が終わったら、編集した記事の「チェック」のリンクからページを表示して下さい。
      表示内容が変わらないようであればページの再読み込みをして下さい。

      先ほどまで表示されていたファイル名の画面上の表示はなくなります。

  7. アイコンファイルの入れ替え

    webdir/icons/ 配下にあるアイコン画像ファイルも、サイトのデザインに合せて変更して下さい。(そのままのご利用も可能です。)

    ファイル名は変更しないで下さい。

    画像のピクセルサイズを変更した場合は、テンプレート内のアイコン用 <img> タグのサイズ設定も変更して下さい。

    記事ページのアイコンサイズの設定 (templates/article/article_file.txt)

    <!-- Shift_JIS(または CP932 など) で保存して下さい -->
    <tr>
    <td>
    <img src="./icons/%_icon_map_%" width="16" height="16" alt="">
    <a href="%_d_%/%_filename_escaped_%" target="_blank">%_filetext_%</a>
    (%_filename_%)<br>
    </td>
    </tr>

    管理画面のアイコンサイズの設定 (templates/admin/3_new_file_list.txt)

    <!-- Shift_JIS(または CP932 など) で保存して下さい -->
    <img src="%_relative_web_dir_%icons/%_icon_map_%" width="16" height="16" alt="">
    <A HREF="%_relative_filedir_%/%_filename_escaped_%" TARGET="_blank">%_filetext_%</A>
    (%_filename_%)
    <BR>
  8. 短い一覧へのサマリー表示

    一覧と短い一覧には、記事内容の一部をサマリーとして表示する事が可能です。
    ここでは、短い一覧にサマリーを表示させてみます。

    1. テキストエディタでファイルを開く

      templates/article/short_list.txt をテキストエディタで開いて下さい。

      「テキストエディタ」が無い場合は、下記のオンラインツールを使用して下さい。
      http://sugutsukaeru.jp/cgi/j/36/

    2. ファイルの修正

      サマリーを表示するテンプレート変数は %_summary_% です。タイトルの下の部分にこれを追加します。

      変更前(デフォルト) (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_% <a href="%_d_%.html">%_subject_%</a><br>
      変更後 (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_% <a href="%_d_%.html">%_subject_%</a><br>
      <blockquote>%_summary_%</blockquote>
    3. 上書き保存

      変更が終わったらファイルを保存して下さい。
      保存の際の文字コードは Shift_JIS(または CP932 など) にして下さい。

    4. アップロード

      保存したファイルを、サーバにもう一度アップロードします。
      FTPソフトでサーバの templates/article/ ディレクトリに移動して、 編集後の short_list.txt をアップロードして下さい。

    5. テンプレート修正後のテスト

      管理画面を開き、一覧の下にある「再構築(テンプレート変更反映)」ボタンを押して下さい。

      処理完了のメッセージが表示されたら「編集結果をチェック: [短い一覧]」のリンクからページを表示して下さい。
      表示内容が変わらないようであればページの再読み込みをして下さい。

      サマリーが表示されるようになります。

      なお、同じ方法で全一覧にもサマリーの表示が可能です。

    6. 文字数の変更

      サマリーとして表示する文字数は変更できます。
      設定方法は「変更できる環境変数」を参照して下さい。

  9. 短い一覧の利用方法

    「短い一覧」( webdir/index_short.html )は新着情報としてトップページなどに組み込んで使用する想定になっています。
    新着情報として組み込む場合の方法は後述しています。

    その他、最新1件分の内容をトップページに表示したり、記事ページの中に新着一覧として組み込むといった使い方もできます。
    「短い一覧」の使い方について詳しくは、「すぐ使えるCGI」ウェブサイトの「テンプレート解説 No. 3 『短い一覧』の利用方法」を参照して下さい。

    1. 短い一覧が不要な場合

      不要であれば短い一覧の書き出しを抑えることもできます。
      設定方法は「変更できる環境変数」を参照して下さい。

    2. 表示件数の設定

      短い一覧の書き出し件数は変更可能です。(デフォルトでは最新3件を表示。)
      設定方法は「変更できる環境変数」を参照して下さい。

  10. 短い一覧を新着情報として利用する

    短い一覧を「新着情報」としてトップページなどに組み込んで利用する場合は、 <IFRAME> タグまたは SSI(Server Side Include)、PHPページであれば readfile 関数などの方法が使えます。以下で3種類の方法を説明します。

    1. <IFRAME> で新着情報を組み込む

      短い一覧を「新着情報」としてトップページなどに組み込んで利用する場合、<IFRAME> であればどのようなサーバ環境でも対応可能です。
      組み込み先のトップページなどに以下のコードを挿入して下さい。

      組み込みコード例(<IFRAME>の場合)
      <iframe
          frameborder="0"
          allowtransparency="true"
          height="300"
          width="270"
          marginheight="0"
          marginwidth="0"
          scrolling="no"
          src="webdir/index_short.html"
      ></iframe>

      これでページ内に新着情報(短い一覧)が表示されます。

      配布のテンプレートのままだと組み込まれた短い一覧から内容ページへのリンクが <IFRAME> 内に表示されてしまいますので、 templates/article/short_list.txt を編集して target 属性を追加して下さい。

      変更前 (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_% <a href="%_d_%.html">%_subject_%</a><br>
      変更後(同じウィンドウに開く場合) (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_%
      <a href="%_d_%.html" target="_parent" >%_subject_%</a><br>
      変更後(新しいウィンドウに開く場合) (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_%
      <a href="%_d_%.html" target="_blank" >%_subject_%</a><br>

      テンプレートを編集したらサーバに上書きアップロードして下さい。
      管理画面一覧の「再構築(テンプレート変更反映)」ボタンを押して変更を反映後、ブラウザの表示を再読み込みして確認して下さい。

      表示の設定
      スクロールバーの調整

      登録した内容が長い場合も <IFRAME> のスクロールバーを出さないようにする方法は下記ページをご参照下さい。
      http://sugutsukaeru.jp/cgi/j/44/

      <IFRAME> ページへの直接アクセスを回避する

      検索エンジンなどから <IFRAME> 内のページに直接アクセスされてしまった場合にメインのページにジャンプする方法は下記ページをご参照下さい。
      http://sugutsukaeru.jp/cgi/j/45/

    2. SSI(Server Side Include)で新着情報を組み込む

      短い一覧を「新着情報」としてトップページなどに組み込んで利用する場合、SSI で組み込む場合はまず webdir/index_short.html が部分HTML になるようにテンプレート templates/article/short_list.html を編集しておきます。

      変更前 (templates/article/short_list.html)
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      <html lang="ja">
      <head>
      <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
      <title>記事一覧</title>
      </head>
      <body bgcolor="#ffffff">

      <!-- article list : generate from short_list.txt -->
      %_article_list_%

      </body>
      </html>
      変更後(templates/article/short_list.html、ファイル全体)
      <!-- article list : generate from short_list.txt -->
      %_article_list_%

      短い一覧から内容ページへのリンクは、組み込み先のページから webdir/1.html、webdir/2.html ... へのリンクとなりますので templates/article/short_list.txt を編集して href 属性を変更します。

      変更前 (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_% <a href="%_d_%.html">%_subject_%</a><br>
      変更後 (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_% <a href="webdir/%_d_%.html" >%_subject_%</a><br>

      テンプレートを編集したらサーバに上書きアップロードの上、管理画面一覧の「再構築(テンプレート変更反映)」ボタンを押して変更を反映して下さい。

      あとは、組み込み先に SSIコマンドを指定します。
      (SSI を有効にするための設定は、お使いのサーバのマニュアル等を参照して下さい。)

      組み込みコード例(SSIの場合)
      <!--#include virtual="webdir/index_short.html" -->
      SSI 設定時に拡張子を変更しない方法

      SSI を使用する場合、通常は拡張子を .html から .shtml などに変更する必要がありますが、サーバによってはこの制限を解除する事ができます。
      設定方法は下記ページをご参照下さい。
      http://sugutsukaeru.jp/cgi/j/46/

    3. PHP で新着情報を組み込む

      トップページなどが既にPHPで構築されている場合は、新着情報(短い一覧)の組み込みはPHPの関数で行えます。
      まず webdir/index_short.html が部分HTML になるようにテンプレート templates/article/short_list.html を編集しておきます。

      変更前 (templates/article/short_list.html)
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      <html lang="ja">
      <head>
      <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
      <title>記事一覧</title>
      </head>
      <body bgcolor="#ffffff">

      <!-- article list : generate from short_list.txt -->
      %_article_list_%

      </body>
      </html>
      変更後 (templates/article/short_list.html、ファイル全体)
      <!-- article list : generate from short_list.txt -->
      %_article_list_%

      短い一覧から内容ページへのリンクは、組み込み先のページから webdir/1.html、webdir/2.html ... へのリンクとなりますので templates/article/short_list.txt を編集して href 属性を変更します。

      変更前 (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_% <a href="%_d_%.html">%_subject_%</a><br>
      変更後 (templates/article/short_list.txt)
      <!-- Shift_JIS(または CP932 など) で保存して下さい -->
      %_yyyy_%-%_mm_%-%_dd_% <a href="webdir/%_d_%.html" >%_subject_%</a><br>

      テンプレートを編集したらサーバに上書きアップロードの上、管理画面一覧の「再構築(テンプレート変更反映)」ボタンを押して変更を反映して下さい。

      あとは、組み込み先に PHPのコードを指定します。

      組み込みコード例(PHPの場合)
      <?php
      readfile("webdir/index_short.html");
      ?>
    4. 表示件数の設定

      短い一覧の書き出し件数は変更可能です。(デフォルトでは最新3件を表示。)
      設定方法は「変更できる環境変数」を参照して下さい。

  11. RSSファイルの設定

    1. RSSとは?

      RSSは、サイト閲覧者が効率的にサイトの更新情報をチェックできる仕組みです。
      RSSファイルをウェブサイトに公開することにより、メールなどを送信しなくてもサイト閲覧者の方に効率よく情報配信できます。

      「すぐ使えるCGI」から登録した情報は自動的にRSSファイル( webdir/new.xml )に書き出されます。
      不要であればRSSファイルの書き出しを抑えることもできます。
      設定方法は「変更できる環境変数」を参照して下さい。

    2. サイトの情報を設定

      RSSファイル用のデフォルトのテンプレートには、ダミーのサイト情報が記載されています。
      設置するサイトの情報に書き換えて下さい。
      必要があれば <pubDate> タグ内末尾のタイムゾーンも変更して下さい。
      なお、「すぐ使えるCGI」では更新時刻の記録ができないので、RSS 内の時刻は 0時0分の固定表示になります。

      RSSファイル用テンプレートファイルは templates/article/rss_list.htmltemplates/article/rss_list.txt です。

      サイト情報の更新箇所(青字) (templates/article/rss_list.html)
      <?xml version="1.0" encoding="Shift_JIS"?>
      <rss version="2.0">

      <channel>
      <title>ここにサイト名やコーナーの名前を入力</title>
      <!-- link タグの中身はサイトのURLに変更して下さい -->
      <link>http://input.your.domain.name/</link>
      <description>ここにサイト名やコーナーの説明を入力</description>
      <language>ja</language>

      <!-- image タグ(以下10行)は任意要素です。不要なら削除して下さい。 -->
      <image>
      <title>ここにサイト名やコーナーの名前を入力</title>
      <!-- url タグの中身はサイトのロゴのURLに変更して下さい -->
      <url>http://input.your.domain.name/your_site_logo.gif</url>
      <!-- link タグの中身はサイトのURLに変更して下さい -->
      <link>http://input.your.domain.name/</link>
      <width>88</width>
      <height>31</height>
      <description>ここにサイト名やコーナーの説明を入力</description>
      </image>

      %_article_list_%

      </channel>
      </rss>
      サイト情報の更新箇所(青字) (templates/article/rss_list.txt)
      <item>
      <title>%_subject_%</title>
      <!-- link タグおよび guid タグ内の http〜webdir/ は、
           書き出しディレクトリまでのURLに変更して下さい。 -->
      <link>http://input.your.domain.name/webdir/%_d_%.html</link>
      <guid isPermaLink="true">http://input.your.domain.name/webdir/%_d_%.html</guid>
      <pubDate>%_dd_% %_mon_% %_yyyy_% 00:00:00 +0900</pubDate>
      <description>%_summary_%</description>
      </item>

      <!-- と --> で挟まれているコメントは設置用の説明ですので、編集が終わったら削除して構いません。

    3. 表示件数の設定

      RSSファイルへの書き出し件数は変更可能です。(デフォルトでは最新10件を表示。)
      設定方法は「変更できる環境変数」を参照して下さい。

    4. RSSファイルの公開(告知)

      RSSファイル(RSSフィード)で効率よく情報を配信するには、閲覧者の方に「購読」して頂く必要があります。
      「購読」とは、URLをブックマークするのと同様の作業です。

      閲覧者の方にRSSファイルがある事が分かるように、サイト内の他のページからRSSファイル( webdir/new.xml )にリンクして下さい。
      オレンジ色または青色の地に白抜きの文字で「RSS」と表示した小さいアイコンでリンクするのが一般的です。

    5. AutoDiscovery の設定(Webサイトのトップページ)

      Webサイトのトップページの <head> タグ内に以下のコードを記載すると、対応しているブラウザでのRSS購読が簡単になります。

      Webサイトのトップページの <head> タグ内に記載(青字はサイトに合わせて変更)
      <link rel="alternate" type="application/rss+xml"
          title="○○株式会社 決算公告 更新情報" href="/webdir/new.xml">

      同じサイトに複数の製品を設置してRSSファイルが複数ある場合、この <link> タグも複数記載できます。

    6. AutoDiscovery の設定(記事ページ)

      記事ページのテンプレートには予め <head> タグ内に AutoDiscovery 用の <link> タグが設定してあります。
      不要であれば テンプレートからタグを削除して下さい。
      使用する場合は title 属性の内容をサイトに合わせて変更して下さい。

      自動更新される記事ページとテンプレートファイルの対応についてはウェブサイト上の「テンプレート対応図」を参照して下さい。
      http://sugutsukaeru.jp/cgi/j/111/

      テンプレートに指定のある AutoDiscovery タグ(青字はサイトに合わせて変更)
      <link rel="alternate" type="application/rss+xml"
          title="○○株式会社 決算公告 更新情報" href="new.xml">
[目次ページへ戻る] [このページのトップへ戻る]