戻る





自由レイアウト掲示板は、セキュリティやスパムの問題等により配布を停止致しました。
自由レイアウト掲示板に代わり、フリーデザイン掲示板をリリースしております。
長くお使い頂いた方や、スキンを配布して下さっているサイト様には大変なご迷惑をおかけして申し訳ございません。
自由レイアウト掲示板用にお作り頂いたスキンは、ある程度の修正を加える事で使用する事が可能です。
お手数をおかけする事になりますが、以下を参照の上ご利用下さいますよう宜しくお願い致します。

また、スキン配布サイト様からのデザイン移行についてのご質問はいつでもお受け致しますのでお気軽にご連絡下さい。


自由レイアウト掲示板用デザインファイルからフリーデザイン掲示板用へのデザインファイルへの移行方法

自由レイアウト掲示板では、

  • top.html
  • form.html
  • ptbl.html
  • ctbl.html


  • の4本のファイルをデザイン用に使用していました。
    これらを、フリーデザイン掲示板用の

  • design.html


  • 1本のファイルに作り替えます。
    今回はtop.htmlを修正して行き、最終的にdesign.htmlにリネームする方式でご説明します。

    (1) top.htmlを修正します

    top.htmlの先頭に<html>の記述がない場合は追記します。
    <html> <- 無ければ追記
    <head>
    <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
    <title>自由レイアウト掲示板 サンプル1</title>
    
    〜 省略 〜
    ※記述はあくまでも例です
    top.htmlはメニュー記述があれば、その部分を修正します。
    自由レイアウト掲示板フリーデザイン掲示板
    bbs200.cgi?mode=howto 存在しません。削除します
    bbs200.cgi?mode=find <!--CGI-->?_mode=find&_log=<!--LOG_NUM-->
    bbs200.cgi?mode=past <!--CGI-->?_mode=log
    bbs200.cgi?mode=msg_del <!--CGI-->?_mode=del
    bbs200.cgi?mode=master <!--CGI-->?_mode=master

    (2) form.htmlを結合します

    form.htmlの内容を丸ごと <!-- FORM_START --> と <!-- FORM_END -->で挟んでtop.htmlの末尾に結合します。
    〜 省略 〜
    
    <!-- FORM_START --> <- 追記
    <div align=center>
    <form action="<!--CGI-->" method="post">
    <input type=hidden name="_mode" value="msg">
    <blockquote>
    <table cellpadding=2 cellspacing=0 border=0>
    <tr><td nowrap>なまえ</td><td align=left><input type="text" size=30 name=name></td></tr>
    <tr><td nowrap>メール</td><td align=left><input type="text" name="mail" size=30></td></tr>
    <tr><td nowrap>タイトル</td><td align=left><input type="text" name="sub" size=30></td></tr>
    <tr><td nowrap>URL</td><td align=left><input type="text" name="url" size=30 value="http://"></td></tr>
    <tr><td nowrap>キー</td><td align=left><input type="password" name="pass" size=8 maxlength=8></td></tr>
    <tr><td nowrap>メッセージ</td><td align=left><textarea name="comment" rows=4 cols=30 wrap=soft></textarea></td></tr>
    <tr><td colspan=2 align=center><input type="submit" value=" 投稿 " class="button">
    <input type="reset" value=" 消す " class="button"></td></tr>
    </table>
    </blockquote>
    </form>
    </div>
    <div align=right><hr width=98% size=1 noshade></div>
    <!-- FORM_END --> <- 追記
    
    ※記述はあくまでも例です
    その後、以下の項目を修正します。
    自由レイアウト掲示板フリーデザイン掲示板
    bbs200.cgi <!--CGI-->
    name="mode" name="_mode"

    (3) ptbl.htmlを結合します

    ptbl.htmlの内容を丸ごと <!-- DATA_START --> と <!-- DATA_END -->で挟んでtop.htmlの末尾( form.htmlの内容を連結した後ろ )に結合します。
    〜 省略 〜
    
    <!-- DATA_START --> <- 追記
    <div align=center>
    
    <form action="<!--CGI-->" method=post>
    <input type=hidden name="_mode" value="msg">
    ↑上の一行は、レス投稿欄が記事毎に存在する場合のみ必要です。それ以外は削除
    
    <table width=80% cellpadding=0 cellspacing=0 border=1><tr><td>
    <table width=100% cellpadding=2 cellspacing=0 border=0><tr>
    <td>■<font face=verdana>[No.<!--NUM-->]</font> <B><!--sub--></B> <font face=verdana>From:</font><B>
    <a href="mailto:<!--mail-->"><!--name--></a></B><a href="<!--url-->" target='_top'><font face=verdana>(HOME)</font></a>
    <small><font face=verdana><!--DATE--></font></small></td>
    <td align=right><input type=submit value="res" class="button"></td>
    </tr></table>
    
    <table cellpadding=10 cellspacing=0 border=0><tr>
    <td><!--comment--></td>
    </tr></table>
    
    <!--RES-START-->
    <!--RES-->
    <!--RES-END-->
    
    </td></tr></table>
    
    </form>
    </div>
    <p>
    <!-- DATA_END --> <- 追記
    
    ※記述はあくまでも例です
    その後、以下の項目を修正します。
    自由レイアウト掲示板フリーデザイン掲示板
    bbs200.cgi <!--CGI-->
    name="mode" name="_mode"
    value="res_msg" value="msg"
    <!--no--> <!--NUM-->
    <!--date--> <!--DATE-->

    (4) ctbl.htmlを埋め込みます

    ctbl.htmlの内容を既にptbl.htmlまで結合したtop.htmlの中に埋め込みます。
    埋め込み場所は以下の部分になります。元のptbl.html内の記述です

  • <!--RES-START-->
  • <!--RES-->
  • <!--RES-END-->


  • <!-- RES --> 部分に<!-- LOOP_START --> と <!-- LOOP_END -->で挟んだctbl.htmlの内容を置きます
    〜 省略 〜
    
    <table cellpadding=10 cellspacing=0 border=0><tr>
    <td><!--comment--></td>
    </tr></table>
    
    <!-- RES_START --> <- 変更
    <!--LOOP_START--> <- 追記
    <div align=center>
    <hr width=100% size=1 noshade>
    <table width=95% cellpadding=0 cellspacing=0 border=0><tr><td>
    ▼<B><!--sub--></B><font face=verdana>From:</font><B><a href="mailto:<!--mail-->"><!--name--></a></B> 
    <a href="<!--url-->" target='_top'>(HOME)</a><font face=verdana>....<small><!--DATE--></font></small>
    </td></tr></table>
    <table width=80% cellpadding=5 cellspacing=0 border=0><tr><td>
    <!--comment-->
    </td></tr></table>
    </div>
    <!-- LOOP_END --> <- 追記
    <!-- RES_END --> <- 変更
    
    ※記述はあくまでも例です
    その後、以下の項目を修正します。
    デザインによっては別途必要な場合があります。
    自由レイアウト掲示板フリーデザイン掲示板
    <!--RES-START--> <!--RES_START-->
    <!--RES-END--> <!--RES_END-->
    <!--RES--> 必要ありません。削除します
    <!--date--> <!--DATE-->

    (5) 足りない記述を追加します

    最後に、自由レイアウト掲示板ではデザイン記述の指定がなかったページリンク、終了部分の記述を追加します。
    〜 省略 〜
    
    <!-- DATA_END -->
    
    <a href="<!--BACK_LINK-->">前ページ</a> <- 追記
    <a href="<!--NEXT_LINK-->">次ページ</a> <- 追記
    
    <hr width=98% size=1 noshade>
    </div>
    
    </body> <- 追記
    </html> <- 追記
    
    ※記述はあくまでも例です

    (6) ファイルをリネームします

    修正して来た top.html を フリーデザイン掲示板用の design.html へリネームをして完成です。
    ただし、デザインによってはこれら以外にも多少修正が必要であったり、隙間等のサイズが異なったりする可能性がありますので、 微調整を行って下さい。