Tableマニュアル

記事の中に挿入できる、最大6列(行数は制限なし)の、比較的シンプルな形式の表を作成できます。これまでのCardChatモデルをミックスしたような、新しいデータモデルです。Tableモデルの装備で、表作成のためだけに別のWebエディタなどを併用する必要は、ほとんどなくなりました。

縦集計機能つきのテーブル1

DreamweaverなどこれまでのWebエディタは、素晴らしい表作成機能を備えているのですが、それはデザイン的な自由度の高さのことで、入力されている数値を自動的に計算してくれるわけではありません。そのため誤ったデータをWebに掲載してしまうおそれがありました。ek-MyWEBではCMSならではのデータベース(プログラム)機能を活かして、計算機能を加えることにしました。次にWebではよく見受けられる「予算書」や「決算書」に必要な、ごく簡単な縦集計の例を示します。

借方・貸方・残高計算機能つきのテーブル2

現金出納帳形式も可能です。もちろん「残高」項目は自動計算となります。現金出納帳のほか、入出庫台帳など経理帳簿の基本である「借方・貸方・残高」形式に適応しています。

単価・数量・金額計算機能つきのテーブル3

バージョン2.0からは、さらに商品の一覧表や棚卸表に適した、「単価x数量=金額」という計算ができるテーブル形式も用意されています。

table-entry.jpg
入力フォーム
 

入力フォームへは「編集者専用」メニューからアクセスできます。

*Tableモデルのデータは、カテゴリー「0」番の隠しページに納められます。

1行が1件の記事

テーブル作成プログラムを起動すると、最初は入力フォームだけで、既に存在するテープルは何も表示されません。Tableモデルでは仕上がりイメージの1行を、1件の記事として入力します。入力項目は6カラム分ありますが、カラムの書式を考慮して、不要な項目を空白にすることで、最小2カラムから最大6カラムまでの表を作成できます。

テーブル番号

デフォルトは「0」番となっています。テーブルが既に複数存在するときは、一番大きな値のテーブル番号の次(プラス1)となります。

表示順位

デフォルトは「0」番で、テーブルのカラム名を入力します。新しい記事には自動的に通し番号が与えられるので、意図的に表示順位を変えるには、この項目の番号を書き換えます。

第1カラム

最初の項目は、文字の配置が「中央」に固定されているので、番号や日付に適しています。データベース内部では「中見出し」相当で検索対象に含まれますが、特に必要なければ空白にできます。

第2カラム

文字の配置を「左揃え」「中央」「右揃え」のいずれかに設定できます。カラム名は「中央・太字」ですが、次の行から始まるデータの配置をここで決めておくことができます。第2カラムは「小見出し」相当で検索対象に含まれます。

第3カラム

他のデータモデルでは「本文」に相当し、インラインタグやek-MyWEBの独自タグが有効なので、書き方の自由度が高く、詳細な説明に適しています。記述方法を工夫すれば画像の挿入も可能です。なお文字の配置は「左揃え」固定で、検索対象に含まれます。

第4カラム、第5カラム

いずれも文字の配置は「左揃え」固定で検索対象からは外れるので、補助的な説明に適しています。必要なければ空白として、テーブルから除外できます。

第6カラム

文字の配置を「左揃え」「中央」「右揃え」のいずれかに設定できます。例えばカラム名を「金額」などとして「右揃え」とすれば、その後のデータは数値として扱われ、集計の対象となります。

table-entry1.jpg
帳票形式の入力フォーム
 

入力項目名がカラム名となる

テーブルの最初の入力項目でカラム名を入力しておくと、次に表示されるデータ入力のためのフォームでは、入力項目名が「第1カラム」~から、そのテーブル固有のカラム名に変わり、伝票のように入力しやすくなります。

集計を行うテーブルの例

ここでは1個のテーブルを作成するために、最初のカラム名を含めて4件の記事を入力していますが、第5カラムは不要なので空白としています。左端の数字は「表示順位」を示し、クリックすると記事を個別に編集できます。未公開記事(データ)には*マークがつきます。第1カラムを「小計」または全角スペースを挟んだ「小 計」とすると、その行は小計行とされます。さらに「合計」または全角スペースを挟んだ「合 計」とすると、その行は合計行とされます。この表示形式はデータの確認のためのもので、集計結果を確認するには「プレビュー」をクリックします。すると別のウインドウに集計形式で表示されます。

数値のカンマ区切り表示

入力データにカンマが1個でも含まれていれば、小計・合計の数値もカンマつきで表示されます。集計は現バージョンでは整数のみとなっています。これは「予算書」や「決算書」を想定した仕様です。

2列にまたがるカラム名

データの2列分を1個のカラム名でまとめることができます。例えば「>摘要」のようにカラム名の前に半角の「>」記号をつけると、2列にまたがるカラム名として扱われます。ただし次のカラム名は空白とはせずに、「-」記号を入力しておきます。結果は「プレビュー」で確認できます。

既存のテーブルを編集する

新しいテーブルでなく、既存のテーブルを選択して編集作業を行うには、画面終端にある「全てのテーブルを表示する」をクリックします。するとこれまでに作成されているテーブルが表示されます。テーブルの左上にあるテーブル番号に貼られているリンクをクリックすると、そのテーブルだけが表示され、個別データの修正のほか、データの追加登録が可能となります。

またテーブル番号がわかっているときは、次のようにコマンドラインにテーブル番号をつけて、そのテーブルだけを表示させることができます。

(例)/ek-Table1.php?tbl=3 (3番テーブルの場合)

新規のテーブル作成にもどる

テーブル作成メニューか、画面終端にある「新しいテーブルを作成する」をクリックすれば、最初の新しいテーブル作成画面にもどることができます。

Page、Memoモデルとの連携

作成したテーブルは、PageおよびMemoモデルの記事の中に、容易に貼り付けることができます。貼り付けるには「URL」の項目に、次のように記述します。

ek-TableInc1.php?tbl=0

ek-TableInc1.phpはインクルード(貼り付け)用のプログラム名ですが、「?tbl=0」という書き方はテーブル番号「0」を意味します。ページを表示すると、テーブル編集のときの「プレビュー」と同じ形式で表示されます。「印刷用表示」でも同様に表示されます。

*Table2用のek-TableInc2.php、Table3用のek-TableInc3.phpも同様に使えます。

未公開テーブル記事の公開

Tableの1行単位の記事を未公開のままにしておくと、PageやMemoに貼り付けても正しく表示されません。そのため、表の編集でプレビューを確認できたら、表に属する全ての記事を「公開する」として保存してください。

Cardモデルとの連携

Cardモデルには「URL」項目はない(カードコントロールに使われている)ので、Cardモデルのカードに貼り付けるには、少々厳しいやり方ですが、テーブル編集のときの「プレビュー」画面のHTMLソースを取得して、そのtableタグの箇所を、記事の中に「HTMLあり」として流し込んでください。

背景色と枠線のスタイルを設定するには

デフォルトのスタイルシートでは、table要素内部の通常セルには「bg_f8」が、見出しセルには「cel_h」クラスが割り当てられており、2段階の薄いグレーが背景色となっています。このクラスのプロパティを変更すれば、カラーバリエーションに適した背景色を設定できます。

また枠線を表示したい場合は、次のようにborderプロパティを設定します。Pageモデルのカテゴリーを印刷するときにだけ枠線を表示するには、「印刷用表示」に適用される「ek-PrintPage.css」に書き加えます。実例はこのページの「印刷用表示」をお試しください。同じようにCardモデルにおいても、「プレゼン用表示」「レジュメ用表示」のスタイルを設定できます。

td.bg_f8,td.cel_h { border: 1px silver solid }