説明
　
自由レイアウト日記は、テンプレートを編集する事で
あなたの作成したデザインで日記を表示する事が出来ます。

テンプレートを編集するには、日記のタイプを「タイプＡ」に設定し、
「タイプＡデザイン編集」ボタンから編集画面に入室して下さい。

テンプレートの作成には、ある程度のHTMLの知識が必要になります。


テンプレートの作り方
テンプレートは、普通のホームページを作成するときと
ほぼ同じ記述方法で作成する事が出来ます。



まず、普通のホームページを作成する時の様にページの骨組みを作成します。
<html>
<head>
<title>ページタイトル</title>
</head>
<body>
</body>
</html>

そして普通のページと違うところはここからです。
テンプレートには、「日記ログを表示する部分」というものが必要になります。
つまり、日記の記事内容を表示する場所です。
これがデザインのメイン部分になるでしょう。



「日記ログを表示する部分」の作成

まず、テンプレート中に日記のログを表示する部分を指定します。

日記のログは<!--log-->というタグで囲まれた部分に、
日記のタイトルやコメント、画像が挿入されて表示されます。

つまり、投稿されたログが複数になればこの<!--log-->で
囲まれた部分が繰り返して表示されるわけです。
テンプレートサンプル
<html>
<head>
<title></title>
</head>
<body>

<!--log-->
ここに日記ログが表示される
<!--log-->

</body>
</html>

また、<!--log-->内に以下で指定されたキーワードを
指定する事でその場所にキーワードに対応した内容が置き換えて表示されます。

日記ログ表示部分のキーワード
置き換え内容 キーワード
コメント #comment#
題名 #subject#
日付 #date#
アイコン #icon#
添付ファイル #upfile#
自由選択項目 #free#
カテゴリ名 #cate#
　（設定画面の「カテゴリ名表示タグ」欄の設定も適用されます。）
記事背景色 body_color
記事文字色 font_color
返信フォームへ ※ <res_form>〜</res_form>



上のキーワードを埋め込むと例えば、以下のようになります。

テンプレートサンプル１ 日記のログが３件あった場合の表示結果
<html>
<head>
<title></title>
</head>
<body>

<!--log-->
タイトル：#subject# <BR>
日記内容：<BR>
#comment#<BR>
 #date#<BR><BR>
<!--log-->

</body>
</html>
タイトル：今日はいい天気だ！
日記内容：
今日は良い天気だったので、
車で出掛けました。
 2005 / 1/ 7 (Sun)

タイトル：テレビ生活
日記内容：
今日は一日中テレビを見て過ごしました。
 2005 / 1/6 (Sat)

タイトル：やっと
日記内容：
やっと１週間が終わりました。
週末はゆっくり休もうかなぁ？
 2005 / 1/ 5 (Fri)
　


テンプレートサンプル２ ページ表示結果
<html>
<head>
<title></title>
</head>
<body bgcolor="#ffff99">
<CENTER>

<!--log-->
<BR><BR>
<TABLE width="200" border="1" bgcolor="body_color">
<TR>
<TD>#date#</TD>
<TD><font color="font_color">#comment#</font></TD>
</TR>
</TABLE>
<!--log-->

</CENTER>
</body>
</html>

2006 / 12/ 5 (水)
今日の日記です。今日の日記です。今日の日記です。今日の日記です。今日の日記です。


2006 / 12/4 (火)
あかさたなはまやらわあかさたなはまやらわ


2006 / 12/3 (月)
あいうえおかきくけこさしすせそ
たちつてとなにぬねの
はひふへほ

これでログ表示部分の大体の構造は分かって頂けたかと思います。

次は、<!--log-->で囲まれた部分以外に
以下のキーワードを挿入して、
カウンターの表示位置を指定したり
過去の日記ページへのリンクを作成します。


キーワード
置き換え内容 キーワード
日記タイトル #title#
メッセージ #message#
カウンター・アクセスログ取得 #counter#
カレンダー #calendar#
月移動ボタン #monthbutton#
タイトル一覧 #newlist#　（※１）
タイトル一覧（日付あり） #newdatelist#　（※１）
携帯アドレス取得へ <imode_url>〜</imode_url>
RSSファイルへのリンク <rss_url>〜</rss_url>
管理者画面へ <master_form>〜</master_form>
過去の日記へのリンク <next_page>〜</next_page>
新しい日記へのリンク <back_page>〜</back_page>
検索画面へ <search_form>〜</search_form>
月一覧表示部 #monthlist#　（※２）


使用例：
<next_page>過去の日記へ</next_page> / <search_form target="_blank">日記を検索する</search_form>
↓
過去の日記へ / 日記を検索する


※１　記事の先頭位置の指定
通常タイトル一覧から各日付の日記にアクセスした場合は
その記事内の日付の位置が先頭として表示されますが、
記事の最後尾に日付を表示されている場合などは、
#datelink#というキーワードを<!--log-->内に埋め込む事で、
その位置をその日の記事と先頭として認識させる事が出来ます。BR>

※２　月一覧表示の位置指定
カレンダーの月部分をクリックした場合などに表示される
月毎の日記一覧は通常は<!--log-->〜<!--log-->の部分に表示されますが、
#monthlist#というキーワードを埋め込む事で、
その位置に月一覧を表示する事が出来ます。








■　返信フォームへのリンク方法について

　「返信を日記本文と同時に表示」をしないに設定している場合は、
返信フォームへのリンク文字中に返信の件数を表示する事が出来ます。
<res_form>の間に「#count#」というキーワードを埋め込む事で
任意の場所に返信件数を表示させる事が出来ます。
例１ ： →  3件の返信があります。
例２ ： →  | Comments(3) |






■ 感想レスの表示方法

さらに、<!--log-->内に<!--res-->で囲われた部分を作る事で、
その部分に日記への返信書き込みを表示させる事が出来ます。
<html>
<head>
<title></title>
</head>
<body>


<!--log-->

<!--res-->
ここにレス記事が挿入される
<!--res-->

<!--log-->

</body>
</html>




下のように記述すると右のように表示されます。
<!--log-->〜<!--log-->の部分が繰り返され、
さらに、<!--res-->〜<!--res-->の部分も返信記事の数に従って繰り返されます。
テンプレートサンプル１ ページ表示結果
<html>
<head>
<title></title>
</head>
<body bgcolor="#ffff99">
<CENTER>

<!--log-->
<BR><BR>
<TABLE width="400" border="1"><TR><TD>
日記本文です。 <res_form>▽返信</res_form>
</TD></TR></TABLE>

<!--res-->
<TABLE width="300" border="1"><TR><TD>
レス記事です。
</TD></TR></TABLE>
<!--res-->

<!--log-->

</CENTER>
</body>
</html>

日記本文です。　▽返信
レス記事です。


日記本文です。　▽返信
レス記事です。


日記本文です。　▽返信
レス記事です。
レス記事です。
レス記事です。


テンプレートサンプル２ ページ表示結果
<html>
<head>
<title></title>
</head>
<body bgcolor="#ffff99">
<CENTER>

<!--log-->
<TABLE width="400" border="1"><TR><TD>
日記本文です。

<!--res-->
<TABLE width="300" border="1"><TR><TD>
レス記事です。
</TD></TR></TABLE>
<!--res-->

</TD></TR></TABLE>
<BR><BR>
<!--log-->

</CENTER>
</body>
</html>
日記本文です。
レス記事です。


日記本文です。
レス記事です。


日記本文です。
レス記事です。
レス記事です。
レス記事です。
このように、日記本文のテーブルの中に<!--res-->を挿入する事で
レス記事は日記本文のテーブルの中で繰り返されて表示される事になります。

返信部分キーワード
置き換え内容 キーワード
名前 #name#
コメント #comment#
アイコン #icon#
投稿日時 #date#
新着マーク #newmark#


  　


サンプル


以下のソースはタイプＡに初期設定されているサンプルのデザインテンプレートです。




サンプル２
小さいウィンドウで日記を開くには、ホームページ側にjavascriptを使って日記へリンクして頂く必要があります。
詳しい方法についてはこちらのサイトなどをご参照下さい。
TOP