Widget Area For PC
( Free space )

HTMLテーブル用ショートコード

このショートコードはDigiPressテーマ専用のプラグインとして提供されています。

ヘッダがない場合

1-1番目のセル 1-2番目のセル 1-3番目のセル 1-4番目のセル
2-1番目のセル 2-2番目のセル 2-3番目のセル 2-4番目のセル
3-1番目のセル 3-2番目のセル 3-3番目のセル 3-4番目のセル

このショートコード

[table width="100%" class=""]
[tablerow align="center" width="160px" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor=""]
1-1番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-4番目のセル
[/tablecell]
[/tablerow]
[tablerow align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor="""]
2-1番目のセル
[/tablecell]
[tablecell class="blue icon-crown" bgcolor="#F4FEC9"]
2-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
2-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
2-4番目のセル
[/tablecell]
[/tablerow]
[tablerow align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor=""]
3-1番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-4番目のセル
[/tablecell]
[/tablerow]
[/table]

行ヘッダがある場合

1行目タイトル 1-2番目のセル 1-3番目のセル 1-4番目のセル 1-5番目のセル
2行目タイトル 2-2番目のセル 2-3番目のセル 2-4番目のセル 2-5番目のセル
3行目タイトル 3-2番目のセル 3-3番目のセル 3-4番目のセル 3-5番目のセル

このショートコード

[table width="100%" class=""]
[tablerow title="1行目タイトル" icon="icon-crown" align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor=""]
1-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-4番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-5番目のセル
[/tablecell]
[/tablerow]
[tablerow title="2行目タイトル" icon="icon-warmedal" align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor="""]
2-2番目のセル
[/tablecell]
[tablecell class="blue icon-crown" bgcolor="#F4FEC9"]
2-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
2-4番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
2-5番目のセル
[/tablecell]
[/tablerow]
[tablerow title="3行目タイトル" icon="icon-star" align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor=""]
3-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-4番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-5番目のセル
[/tablecell]
[/tablerow]
[/table]

列ヘッダがある場合

1列目タイトル 2列目タイトル 3列目タイトル 4列目タイトル
1-1番目のセル 1-2番目のセル 1-3番目のセル 1-4番目のセル
2-1番目のセル 2-2番目のセル 2-3番目のセル 2-4番目のセル
3-1番目のセル 3-2番目のセル 3-3番目のセル 3-4番目のセル

このショートコード

[table width="100%" class=""]
[tablehead title="1列目タイトル,2列目タイトル,3列目タイトル,4列目タイトル" icon="icon-safe,,icon-credit,icon-dollar" caption="ここをタップして表示"]
[tablerow align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor=""]
1-1番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-4番目のセル
[/tablecell]
[/tablerow]
[tablerow align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor="""]
2-1番目のセル
[/tablecell]
[tablecell class="blue icon-crown" bgcolor="#F4FEC9"]
2-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
2-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
2-4番目のセル
[/tablecell]
[/tablerow]
[tablerow align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor=""]
3-1番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-4番目のセル
[/tablecell]
[/tablerow]
[/tablehead]
[/table]

行ヘッダ+列ヘッダがある場合

2列目タイトル 3列目タイトル 4列目タイトル 5列目タイトル
1行目タイトル 1-2番目のセル 1-3番目のセル 1-4番目のセル 1-5番目のセル
2行目タイトル 2-2番目のセル 2-3番目のセル 2-4番目のセル 2-5番目のセル
3行目タイトル 3-2番目のセル 3-3番目のセル 3-4番目のセル 3-5番目のセル

このショートコード

[table width="100%" class=""]
[tablehead title=",2列目タイトル,3列目タイトル,4列目タイトル,5列目タイトル" icon=",icon-safe,icon-star,icon-credit,icon-dollar"]
[tablerow title="1行目タイトル" align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor=""]
1-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-4番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
1-5番目のセル
[/tablecell]
[/tablerow]
[tablerow title="2行目タイトル" align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor="""]
2-2番目のセル
[/tablecell]
[tablecell class="blue" bgcolor="#F4FEC9"]
2-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
2-4番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
2-5番目のセル
[/tablecell]
[/tablerow]
[tablerow title="3行目タイトル" align="center" class="" bgcolor=""]
[tablecell align="center" class="" bgcolor=""]
3-2番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-3番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-4番目のセル
[/tablecell]
[tablecell align="center" class="" bgcolor=""]
3-5番目のセル
[/tablecell]
[/tablerow]
[/tablehead]
[/table]

セルにマウスホバー効果を有効にしたテーブル

1列目タイトル 2列目タイトル 3列目タイトル 4列目タイトル
1-1番目のセル 1-2番目のセル 1-3番目のセル 1-4番目のセル
2-1番目のセル 2-2番目のセル 2-3番目のセル 2-4番目のセル
3-1番目のセル 3-2番目のセル 3-3番目のセル 3-4番目のセル

このショートコード

[table width="100%" highlight=true]
[tablehead title="1列目タイトル,2列目タイトル,3列目タイトル,4列目タイトル"]
[tablerow width="160px"]
[tablecell]
1-1番目のセル
[/tablecell]
[tablecell]
1-2番目のセル
[/tablecell]
[tablecell]
1-3番目のセル
[/tablecell]
[tablecell]
1-4番目のセル
[/tablecell]
[/tablerow]
[tablerow]
[tablecell]
2-1番目のセル
[/tablecell]
[tablecell]
2-2番目のセル
[/tablecell]
[tablecell]
2-3番目のセル
[/tablecell]
[tablecell]
2-4番目のセル
[/tablecell]
[/tablerow]
[tablerow]
[tablecell]
3-1番目のセル
[/tablecell]
[tablecell]
3-2番目のセル
[/tablecell]
[tablecell]
3-3番目のセル
[/tablecell]
[tablecell]
3-4番目のセル
[/tablecell]
[/tablerow]
[/tablehead]
[/table]

セルホバー時に任意のフォントカラーと背景カラーを指定したテーブル

1列目タイトル 2列目タイトル 3列目タイトル 4列目タイトル
1-1番目のセル 1-2番目のセル 1-3番目のセル 1-4番目のセル
2-1番目のセル 2-2番目のセル 2-3番目のセル 2-4番目のセル
3-1番目のセル 3-2番目のセル 3-3番目のセル 3-4番目のセル

このショートコード

[table width="100%" highlight=true hoverrowbgcolor="#aae8e9" hoverrowfontcolor="#465f60" hovercellbgcolor="#23b5df" hovercellfontcolor="#fff"]
[tablehead title="1列目タイトル,2列目タイトル,3列目タイトル,4列目タイトル"]
[tablerow align="center" width="160px"]
[tablecell]
1-1番目のセル
[/tablecell]
[tablecell]
1-2番目のセル
[/tablecell]
[tablecell]
1-3番目のセル
[/tablecell]
[tablecell]
1-4番目のセル
[/tablecell]
[/tablerow]
[tablerow]
[tablecell]
2-1番目のセル
[/tablecell]
[tablecell]
2-2番目のセル
[/tablecell]
[tablecell]
2-3番目のセル
[/tablecell]
[tablecell]
2-4番目のセル
[/tablecell]
[/tablerow]
[tablerow]
[tablecell]
3-1番目のセル
[/tablecell]
[tablecell]
3-2番目のセル
[/tablecell]
[tablecell]
3-3番目のセル
[/tablecell]
[tablecell]
3-4番目のセル
[/tablecell]
[/tablerow]
[/tablehead]
[/table]

ソート(並べ替え)機能を有効にしたテーブル

日付 ひらがな アルファベット 金額 割合
2003/7/10 なにぬねの Candy ¥5,429 44%
2000/10/25 かきくけこ Fruit ¥1,980 78%
2014/7/16 やゆよわをん Apple ¥34,869 8%
2014/12/24 はひふへほ Graphic ¥20,082 63%

このショートコード

[table width="100%" sort=true highlight=true]
[tablehead title="日付,ひらがな,アルファベット,金額,割合"]
[tablerow width="160px"]
[tablecell]
2003/7/10
[/tablecell]
[tablecell]
なにぬねの
[/tablecell]
[tablecell]
Candy
[/tablecell]
[tablecell]
¥5,429
[/tablecell]
[tablecell]
44%
[/tablecell]
[/tablerow]
[tablerow]
[tablecell]
2000/10/25
[/tablecell]
[tablecell]
かきくけこ
[/tablecell]
[tablecell]
Fruit
[/tablecell]
[tablecell]
¥1,980
[/tablecell]
[tablecell]
78%
[/tablecell]
[/tablerow]
[tablerow]
[tablecell]
2014/7/16
[/tablecell]
[tablecell]
やゆよわをん
[/tablecell]
[tablecell]
Apple
[/tablecell]
[tablecell]
¥34,869
[/tablecell]
[tablecell]
8%
[/tablecell]
[/tablerow]
[tablerow]
[tablecell]
2014/12/24
[/tablecell]
[tablecell]
はひふへほ
[/tablecell]
[tablecell]
Graphic
[/tablecell]
[tablecell]
¥20,082
[/tablecell]
[tablecell]
63%
[/tablecell]
[/tablerow]
[/tablehead]
[/table]

列幅を指定した例

テーマ カラム数 フッターカラム数 対応アーカイブ形式 パララックス モバイルテーマ AMP pjax
fresco 1〜2 1〜4 6種類
(スタンダード、ポートフォリオx2、混在グリッド、マガジン、シンプル)
Luminous Business Edition 1〜2 1〜4 5種類
(スタンダード、ポートフォリオx3、マガジン)
Luminous 1〜2 1〜3 3種類
(スタンダード、ポートフォリオ、マガジン)
Clarity Business Edition 1〜2 1〜4 5種類
(スタンダード、ブログ、ポートフォリオx2、マガジン)
Clarity 1〜2 1〜3 3種類
(スタンダード、ブログ、マガジン)

このショートコード

[table width="100%" class="ft13px"]
[tablehead
title="テーマ,カラム数,フッターカラム数,対応アーカイブ形式,パララックス,モバイルテーマ,AMP,pjax"
eachwidth="250px,90px,90px,220px,110px,116px,116px,116px"]

[tablerow title="fresco" align="center"]
[tablecell align="center"]
1〜2
[/tablecell]
[tablecell align="center"]
1〜4
[/tablecell]
[tablecell align="center"]
6種類
(スタンダード、ポートフォリオx2、混在グリッド、マガジン、シンプル) [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [/tablerow] [tablerow title="Luminous Business Edition" align="center"] [tablecell align="center"] 1〜2 [/tablecell] [tablecell align="center"] 1〜4 [/tablecell] [tablecell align="center"] 5種類
(スタンダード、ポートフォリオx3、マガジン) [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-cross pink"></i> [/tablecell] [/tablerow] [tablerow title="Luminous" align="center"] [tablecell align="center"] 1〜2 [/tablecell] [tablecell align="center"] 1〜3 [/tablecell] [tablecell align="center"] 3種類
(スタンダード、ポートフォリオ、マガジン) [/tablecell] [tablecell align="center"] <i class="ft16px icon-cross pink"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-cross pink"></i> [/tablecell] [/tablerow] [tablerow title="Clarity Business Edition" align="center"] [tablecell align="center"] 1〜2 [/tablecell] [tablecell align="center"] 1〜4 [/tablecell] [tablecell align="center"] 5種類
(スタンダード、ブログ、ポートフォリオx2、マガジン) [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-cross pink"></i> [/tablecell] [/tablerow] [tablerow title="Clarity" align="center"] [tablecell align="center"] 1〜2 [/tablecell] [tablecell align="center"] 1〜3 [/tablecell] [tablecell align="center"] 3種類
(スタンダード、ブログ、マガジン) [/tablecell] [tablecell align="center"] <i class="ft16px icon-cross pink"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-ok green"></i> [/tablecell] [tablecell align="center"] <i class="ft16px icon-cross pink"></i> [/tablecell] [/tablerow] [/tablehead] [/table]
Widget Area For PC
( Free space )