WordPress無料テーマCocoonのタイムラインサンプル

タイムライン

タイムライン

タイムラインのサンプル１

タイムラインのtitle

タイムラインアイテムのlabel
タイムラインアイテムのtitle

タイムライン１行目
タイムラインアイテムのlabel
タイムラインアイテムのtitle

タイムライン２行目

「タイムラインのtitle」は太字かつ中央揃えで表示されます。
「タイムラインアイテムのlabel」は右寄せで表示されます。
「タイムラインアイテムのtitle」は太字で表示されます。

「タイムラインのサンプル１」のショートコード記載例

[timeline title="タイムラインのtitle"]
[ti label="タイムラインアイテムのlabel" title="タイムラインアイテムのtitle"]
タイムライン１行目
[/ti]
[ti label="タイムラインアイテムのlabel" title="タイムラインアイテムのtitle"]
タイムライン２行目
[/ti]
[/timeline]

タイムラインのサンプル２

Python入門

STEP1
Python入門　STEP1
STEP1の内容
STEP2
Python入門　STEP2
STEP2の内容
STEP3
Python入門　STEP3
STEP3の内容
STEP4
Python入門　STEP4
STEP4の内容
STEP5
Python入門　STEP5
STEP5の内容
STEP6
Python入門　STEP6
STEP6の内容
STEP7
Python入門　STEP7
STEP7の内容
STEP8
Python入門　STEP8
STEP8の内容
STEP9
Python入門　STEP9
STEP9の内容
STEP10
Python入門　STEP10
STEP10の内容
STEP11
Python入門　STEP11
STEP11の内容
STEP12
Python入門　STEP12
STEP12の内容

「タイムラインのサンプル２」のショートコード記載例

[timeline title="Python入門"]
[ti label="STEP1" title="Python入門　STEP1"]STEP1の内容[/ti]
[ti label="STEP2" title="Python入門　STEP2"]STEP2の内容[/ti]
[ti label="STEP3" title="Python入門　STEP3"]STEP3の内容[/ti]
[ti label="STEP4" title="Python入門　STEP4"]STEP4の内容[/ti]
[ti label="STEP5" title="Python入門　STEP5"]STEP5の内容[/ti]
[ti label="STEP6" title="Python入門　STEP6"]STEP6の内容[/ti]
[ti label="STEP7" title="Python入門　STEP7"]STEP7の内容[/ti]
[ti label="STEP8" title="Python入門　STEP8"]STEP8の内容[/ti]
[ti label="STEP9" title="Python入門　STEP9"]STEP9の内容[/ti]
[ti label="STEP10" title="Python入門　STEP10"]STEP10の内容[/ti]
[ti label="STEP11" title="Python入門　STEP11"]STEP11の内容[/ti]
[ti label="STEP12" title="Python入門　STEP12"]STEP12の内容[/ti]
[/timeline]

「STEP1の内容」部分を改行しない場合はタイトルと内容の間が狭くなります。