ホームページの無料テンプレート素材を配布しています
初心者の方のために専用の作成ソフトもご用意
ホームページビルダーよりも簡単に作れます

ループタグとは


ループタグとは、基本事項のような1回で終わるものではなく、繰り返しが必要なデータを設定するときに必要となるもので、ループデータタグという「型」とループデータという「実体」があります。



ループデータタグというのは編集エリアの左2つのボックスに現れている「Contents」「menu」「BoxB」などのようなタグをいいます。この2つのボックスのうち右側の「Name」「ItemTitle」「ItemBody」などは内部ループタグといい、今挙げた3つの内部ループタグは「Contents」を構成する内部ループタグです。

どういうことかというと「Contents」などのループデータタグはいくつかの内部ループタグをもっていて、それらを合わせて1つのループデータタグを構成しているということです。ですから、他のループデータタグの「menu」というループデータタグにはまた別の内部ループタグが割り当てられているということです。

そして、それらのループデータタグを用途別に集めたものが、編集エリアの一番左のボックスに列挙されているのです。

それらのループデータタグ(例えば「Contents」)の内部ループタグ(例えば「ItemTitle」)に実際に値を設定する役割を持つのがループデータです。

具体的にループデータタグ「Contents」という「型」の内容を「ループタグとは」というループデータに設定したい場合について考えてみます。

まず、ループデータタグの「Contents」を選択します。そして、ループデータ名に「ループタグとは」と入力してループデータ名を追加します。



そして、「Name」「ItemTitle」「ItemBody」などの内部ループタグを選択して、エディタで内容を設定します。その際、指定したタグによっては既に内容が設定されている場合があります。これは、入力作業軽減機能が働いているからです。詳しくは別項にて。

1つの内部ループタグの入力が終わったら確定することを忘れずに。 このボタンです。


入力作業軽減機能


基本事項のところでも説明しましたが、出来るだけ入力作業を軽減したいということで入力作業軽減機能なるものが搭載されています。

ループデータについての入力作業軽減機能は基本事項のそれとはちょっと違います。入力を省略すると、一番上のループデータの値を使うということと、それがなければデフォルト(初期値)を利用するということは基本事項と同じです。

それに加えて、ループデータの入力作業軽減機能にはもうひとつ機能があって、ループデータそのものを追加しなかった場合は、一番上のページのループデータを再利用します。

ですからループデータを追加すると、そのとたんに編集エリアのエディタに一番上のデータが表示されることがあります。これは、現在のループデータの指定した内部ループタグにはデータが設定されていないから、一番上のループデータのデータを再利用しているということなのです。

つまり、あるページでループデータの追加をしなかった場合、一番上のページ(一番最初に追加したページ。あるいは順番を変更して一番上にもってきたページ)のループデータをそのまま利用します。


特殊ループタグ(menu)


ループデータタグには特殊ループタグといって特別な働きをするタグがあります。

「menu」タグです。

「menu」タグは基本的に、各ページ相互にリンクを貼ることを目的としています。ですので、このタグを設定することで、設定してある各ページ相互で行き来することが出来るようになるのです。

これはループデータタグとして利用されメニューリンクを作成する働きをします。menuループデータタグを構成する内部ループタグには、これまた特殊な内部ループタグが用意されています。それがimport内部ループタグです。サブメニューを作成します。

import内部ループタグに設定する値は、ファイル名(データファイル名)あるいはループデータタグ名です。ファイル名(データファイル名)を指定した場合は、指定したデータファイル名のページ名を列挙しリンクを貼ります。その際には、ページ名の追加で追加したページ名がリンクテキスト(リンクの際に使用される文字列)として使用されます。

ファイル名を指定する場合は、現在編集しているデータファイルから見た相対パスでファイルを指定してください。つまり、同じフォルダにあるファイルであれば、ファイル名だけを指定するだけで構いません。

下位のフォルダにあるファイルを指定する場合はフォルダも付加して指定してください。



こう指定すると....例えばこんな感じになります(下図)。この例だと「海苔巻.dat」には、「テンプレーター海苔巻」「アップローダーFFFTP」「アクセスアナライザー」「ロゴ作成ソフトLogo!」というページが存在していることになります。

また、上記画像ではimport内部ループタグに「software\海苔巻.dat」と指定されています。これは、現在編集しているデータファイルが保存されているフォルダの中のsoftwareというフォルダにある「海苔巻.dat」というデータファイルを指定しています。



ループデータタグを指定するとこんな感じです。「Contents」を指定してみました。



import内部ループタグにループデータタグ「Contents」を設定すると、サブメニューにループデータタグ「Contents」のループデータ名を列挙しリンクを貼ります。これはページ内ジャンプですので、<a name="○○"></a>というHTMLタグが必要になるのですが、これはテンプレートに装備されていますのでユーザーとしては考える必要はありません。

つまりはソフト側で全てやってくれるのです。こんな感じです(下図)。これは「基本的な使用方法」というページに、「概要」〜「ブラウザで確認する」というループデータが設定されているという場合です。

また、次項で出てきますが、ループデータ名が「!」(半角)で始まるものは、import内部ループタグでループデータタグを指定したとしても表示されません。つまり、サブメニューには表示されないという事です。意図的にサブメニューには表示したくないループデータ名がある場合は、半角の「!」でループデータ名を始めると希望の動作になります。



つぎに、menuループデータタグの内部ループタグで設定する特殊な値について説明します。menuループデータタグ内のどの内部ループタグでも良いのですが、特定の値を設定することで特殊な文字列に変換する機能を装備しています。

まず、それらの値を挙げてみます。

・link
・linkset
・caption

この3つです。linkはそのページ(リンクメニューを作成しようとしているときのリンク先のページ)のファイル名を取得します。

linksetはlinkのタグ追加版で、<a href="ファイル名">を取得します。

captionはそのページ(リンクメニューを作成しようとしているときのリンク先のページ)のページ名を取得します。

取得したデータは内部ループタグを書き換えるのに使われます。つまり、menuループデータタグの内部ループタグが、今取得したデータに書き換えられてHTMLファイルが作成されるということです。

テンプレートで既に初期値も設定してありますので、実際はここら辺をいじる必要はないかと思われます。いじる必要があるのは、import内部ループタグぐらいだと思います。


特殊ループタグ2


これは、特殊ループタグというよりも、特殊ループタグの値といった方が正しいのですが、実際に使われる内部ループタグはどのようなものでもよくて、そこに設定する値が特殊な働きをするものなのです。これらの値はmenuループデータタグ以外で使用します。

それらは、!import、!name、!namebr、「!(半角)」で始まる文字列の4つです。

!importは現在編集中のループデータ名を取得します。記事のタイトルとループデータ名を連動させたいときなどに使います。ループデータ名を変更すると、書出される内部ループタグの値も連動して変更されます。

!nameは<a name="">というタグを取得します。前項で説明したサイト内ジャンプに使用します。実際のテンプレートではループデータの先頭に挿入されます。

!namebrは!nameと同様ですが、始めにBRタグを挿入して、ジャンプした際に一番上の行を一行空けるようにします。その際に、一番上のループデータに関しては空行はいれません。デザインが壊れるので。その代わりに、別の所に<a name="Top">というタグが指定されているので正常にジャンプの機能は働きます。

「!(半角)」で始まる文字列についてですが、これはページ名のインデックス(沿え字)を取得します。沿え字とは、index3.htmlやindex5.htmlなどの3や5のことをいいます。

ファイル名はページ名の並びでつけられます。そのため、ページの並べ替えを行うと書き込まれるHTMLファイルのファイル名が変わってきてしまいます。ですから始めからファイル名を決め打ちして指定はできずこのタグを利用します。

実際はこの部分も、テンプレートで初期値として設定されている場合が多いのでいじる必要はないかと思います。

これと混同しやすいのが、前項でも説明しました「ループデータ名」が「!」で始まる場合です。

ループデータ名に!をつける場合と内部ループタグの値として!をつける場合の違いです。繰り返しになりますが、もう一度簡単に説明します。


ループデータ名に!をつけると、import内部ループタグで取得されるサブメニューにはそのループデータは入りません。




内部ループタグの値として!で始まる文字列を設定した場合は、指定したページ名が書出されるHTMLファイルの沿え字を取得します。





特殊内部ループタグ


特殊ループタグというものがあると同様に、特殊内部ループタグというものがあります。これはVer.20050610で追加された機能で、HTML編集機能がついたことによって追加された機能です。

内容は「ExcludeLast」と「LastOnly」があります。これらが内部ループタグにある場合、その内部ループタグは特殊な働きをします。

・ExcludeLast

この内部ループタグに設定された値は最後の「ループデータ」表示時には表示されません。「ループデータ」は複数設定できますが、最後の「ループデータ」に限って、この内部ループタグに設定された値は空になります(設定されていないのと同じ効果になります)


・LastOnly

これはExcludeLastとは逆の働きをします。この内部ループタグに設定された値は、最後に表示する「ループデータ」に限って、設定された値が使用されます。それ以外は空になります(設定されていないのと同じ効果になります)

※内部ループタグとループデータの違いにご注意下さい。ループタグは複数のループデータをもち、そのループデータは更に複数の内部ループタグをもちます。内部ループタグはループタグによってその種類(設定項目)が決定されます。



ここで出てくる「ExcludeLast」や「LastOnly」は内部ループタグです。上記説明で「最後のループデータ」というような表現が出てきますが、これはユーザーさんが入力して作成するループデータです。

そして、ループデータは複数作成できますが、複数のループデータを作成した場合は、最後のループデータというものが存在します(もちろん、ループデータが1つの場合はそれが最後のループデータになります)

その場合に、そのループデータに属する内部ループタグが存在するのですが、「ExcludeLast」や「LastOnly」が、その内部ループタグにあたります。

それらの内部ループタグに設定した値は、ループデータをHTMLに書きかえる場合に、今、書き換えるべきループデータが最後のループデータであるかどうかによって、異なった内容に書き換えるという事です。

【使い方例】
ExcludeLastの使い道は仕切線です。テンプレートによってはひとつのボックスにループデータを設定する場合もあろうかと思います(というかあります)。具体的にはネットショップをイメージしていただければご理解頂けると思います。

商品を表示してあるボックスがあると思うのですが、ひとつのボックスに複数の商品が表示されています。そして、それぞれの商品を区切るために仕切線が表示されます。あれをループデータで表現しようとした場合に必要となります。

ループデータには仕切線を含めて設定しておいて、最後のループデータではその仕切線は表示しない。というように使います。最後の仕切線を表示してしまっては、ボックスの周りの線と被ってしまうため、見栄えが悪くなってしまいます。

LastOnlyの使い道は「ぶら下がりリスト」です。こんな感じです。

├リスト1
├リスト2
├リスト3
├リスト4

最後のリスト4についても├が使われていますが、最後の場合は└の方がよいのではないかと思います。こんな感じです。

├リスト1
├リスト2
├リスト3
└リスト4

これを実現するのがLastOnlyです。実際にはLastOnlyとExcludeLastを組み合わせて使います。

ExcludeLastには├を設定して、LastOnlyには└を設定することで可能になります。


メニューリンクタブ


ループデータタグのうちメニューに係るタグ(menu)はメニューリンクを作成するためのものでした。それは、どのページでも同じリンクを作成するので、メニューリンクには現在のページへのリンクも作成されてしまいます。

これは無意味なリンクです。それは、そのリンクをクリックしても表示されるページは変わらないのですから(クリックしてもリンク先のページは現在のページであるということです)。

それを回避するために、書き換えようとしているメニューリンクが自分のページである場合(クリックしても、今書き換えようとしているページに再びジャンプしてしまう場合)に、メニュータグを上書きして別の値に書き換える働きをするのがこの、メニューリンクタブでの設定です。

使うタグは、ループデータタグのmenuの内部ループタグです。ここをリンクしないように書き換えます。

基本的には、<a href="">と</a>の部分を削除するように設定するだけです。しかしそのまま削除してしまったのでは、入力作業軽減機能によってデフォルト(初期値)に設定されてしまうので、半角スペースあるいは改行などで設定してください。


ループデータタグ不使用


編集エリアを良く見ると「ループデータタグ不使用」というチェックボックスがあります。これは、指定したループデータタグを使用しないというものです。何を当たり前なと思われるかもしれませんが、結構使えるものだったりします。



このチェックボックスは各ページ、各ループデータタグごとに設定できます。

テンプレートを作成する場合、色々な可能性を考えて余計なループデータタグを作ってしまったりします。場合によっては「このループデータタグは必要ない」と思う場合が出てくるかもしれません。そんな場合に使用します。

そして、このループデータタグ不使用にはもうひとつ機能があります。それは、menuループデータタグで使用した場合です。

menuループデータタグを設定しているときに、このチェックボックスをチェックすると、現在のページへのリンクが他のページでは表示されなくなります。自ページへのリンクは表示されます(つまりチェックしたページに対するリンクが自ページを除いて貼られなくなるということ)。

分かり難いと思いますので実例を挙げておきます。

例えば、ページがページ1、ページ2、ページ3、ページ4と4ページあったとします。このときに全てのページの「ループデータタグ不使用」チェックボックスのチェックを外すと(これが初期値です)、全てのページでページ1からページ4までのリンクが貼られることになります。

これに対して、全てのページで「ループデータタグ不使用」チェックボックスのチェックをチェックすると、1ページにおいては1ページについてのメニュー、2ページにおいては2ページについてのメニューしか表示されなくなります。3ページ、4ページについても同様です。

さらに、1ページの「ループデータタグ不使用」チェックボックスのチェックをチェックして、他のページの「ループデータタグ不使用」チェックボックスのチェックを外すと、1ページ以外のページのメニューでは1ページへのリンクが表示されなくなります。1ページのメニューは1ページへのメニューは表示されます。

ちょっと変更して、1ページと2ページの「ループデータタグ不使用」チェックボックスのチェックをチェックして、他のページの「ループデータタグ不使用」チェックボックスのチェックを外すと、1ページのメニューでは、2ページへのリンクが表示されなくなって、1ページでは2ページへのリンクが表示されなくなります。他のページでは、1ページと2ページへのリンクが表示されなくなるということになります。


最大表示記事数


あまりにも記事(ループデータ)が多くなると、ページが「いったんもめん」のように細長くなってしまい、あまり格好の良いものではありません。そこで、記事(ループデータ)が一定数に達すると、それ以上は表示しないようにするのがこの「最大表示記事数」機能です。



しかし、ただ単に記事が一定数以上になったらそれ以上表示しないとすると、新しい記事が追加されても、一定数以上であれば新しい記事が表示されないことになってしまいます。

それを防止するために、表示逆順機能と言うものがあるのですが、それは次項にて扱います。

さて設定方法は簡単。設定は、各ページの各ループタグごとに別々に設定できます。つまり、あるページに「日記」「リンク」というループタグを設定しているとします。そのうちの「日記」というループタグだけに最大表示記事数を設定することが出来ます。



上図の枠のように設定したいページ、設定したいループタグを選択します。そして、最大表示記事数の入力欄に表示数の設定をします。0を設定することで無制限になります。


逆順表示モード


前項の「最大記事表示数設定」と合わせて使うのがこの「逆順表示」モードです。



この設定ボタンを押すことで、設定したページの設定したループデータの表示順が新しく追加した順番になります。元に戻す場合は、再度ボタンを押すことで戻ります。

現在逆順表示モードかどうかを確認するには、そのボタンが凹んでいれば逆順表示モードになっています。逆に、そのボタンが通常の状態であれば、逆順表示モードは解除されています。


下書きモード


ページ全体についても下書きモードというものがありますが、ページの中の1つの記事(ループデータ)だけについても下書きモードを用意しました。



これで、まだ書きかけの記事を書き出さないようにすることが出来ます。

下書き設定にするには簡単で、上図の丸で囲んだ所を押せば終了です。下書き設定を解除したい場合は、再度押せば下書き設定を解除できます。

現在下書き設定かどうかを確認するには、そのボタンが凹んでいれば下書き設定になっています。逆に、そのボタンが通常の状態であれば、下書き設定は解除されています。


外部リンク機能


「海苔巻」は特殊ループタグmenuのimport内部ループタグでサブメニューを作成することが出来ますが、これはサイト内でのリンクにとどまっていました。

しかし、これでは物足りないということで「外部リンク機能」を追加しました。設定方法は非常に格好悪いのですが、ループデータを以下の通りに設定します。

#サブメニューに表示される文字列#URLアドレス



つまり、半角#で始め、リンクテキストを指定して、半角#で区切ってURLアドレスを追加します。

このように追加することでサブメニューに外部リンクを追加することが出来ます。

基本的な使用方法

概要
テンプレートを選択する
ページを追加する
ループデータ名を追加する
各種設定をする
必要な画像データを保存する
書込フォルダ名を設定する
実際に書き込む
ブラウザで確認する


画面説明

操作画面(上部左側)
操作画面(上部右側)
設定画面
編集画面


基本事項の設定

テンプレートの基礎的部分
入力作業軽減機能
アクセスアナライザー対応
内部独自タグ
ページコード


ループタグの設定

ループタグとは
入力作業軽減機能
特殊ループタグ(menu)
特殊ループタグ2
特殊内部ループタグ
メニューリンクタブ
ループデータタグ不使用
最大表示記事数
逆順表示モード
下書きモード
外部リンク機能


スタイルシートの設定

サイトの印象を変える要素
スタイルシートの編集


ちょっと応用編

複数のデータファイルを扱う
書込みフォルダの指定
複数ファイルの具体例
ファイル連続書込み


テンプレートを作ろう

テンプレートの骨格
テンプレートとは何か
まずは下準備
実際に書き換える
最後に確認



Googleで検索