最小限のパラメータのみで表示した例(3パネル)

Code

[spanel
 row1colnum='3'
 row2colnum='0']
[spanelitem
 title='メインタイトル1'
 caption='これはキャプション'
 hovertitle='ホバータイトル'
 hovercaption='マウスオーバー時のキャプション'
 bgimg='https://drive.google.com/uc?export=view&id=12pe8WYPvyvHbUoET1QheRqWgYCmoC_sB'
 url='#遷移先のURL']
[spanelitem
 title='メインタイトル2'
 caption='これはキャプション'
 hovertitle='ホバータイトル'
 hovercaption='マウスオーバー時のキャプション'
 bgimg='https://drive.google.com/uc?export=view&id=1vN2qQQ1pdqQyDN58wlNnEYmFUj0yP0Li'
 url='#遷移先のURL']
[spanelitem
 title='メインタイトル3'
 caption='これはキャプション'
 hovertitle='ホバータイトル'
 hovercaption='マウスオーバー時のキャプション'
 bgimg='https://drive.google.com/uc?export=view&id=1b4szhNJNJMzMwK5ZwkeWasQn1M2HOksf'
 url='#遷移先のURL']
[/spanel]

1行目2カラム + 2行目3カラムで様々なオプション付きで表示した例

Code

[spanel
row1colnum='2'
row2colnum='3'
hoverfx='4'
overlayopacity='2'
hoveroverlayopacity='5'
txtshadow='0']
[spanelitem
title='AMP対応'
titlesize='30px'
titlebold=''
titleitalic='1'
caption='デザインと機能を損なわないAMP'
captionsize='13px'
txtcolor='#fff'
overlaycolor='#337fea'
hovertitle='高度で柔軟なAMPモード'
hovercaption='詳細はこちら'
hovertxtcolor='#fff'
hoveroverlaycolor='#154d91'
bgimg='https://drive.google.com/uc?export=view&id=12pe8WYPvyvHbUoET1QheRqWgYCmoC_sB'
url='https://digipress.digi-state.com/about-amp-function/'
newwindow='1']
[spanelitem
title='pjax'
titlesize='30px'
titlebold=''
titleitalic='1'
caption='非同期通信による高速なページ遷移'
captionsize='13px'
txtcolor='#fff'
overlaycolor='#49d17f'
hovertitle='Ajax + pushState'
hovercaption='詳細はこちら'
hovertxtcolor='#fff'
hoveroverlaycolor='#1c3526'
bgimg='https://drive.google.com/uc?export=view&id=15s05GoPqIYlEXJccJTfL1_5_7FZICaCi'
url='https://demo.dptheme.net/dp18/archives/3996']
[spanelitem
title='Shortcodes'
titlesize='27px'
titlebold=''
titleitalic='1'
caption='豊富で実用的なショートコード'
captionsize='13px'
txtcolor='#fff'
overlaycolor='#d61156'
hovertitle='for DigiPress'
hovercaption='ショートコード一覧をみる'
hovertxtcolor='#fff'
hoveroverlaycolor='#9b122e'
bgimg='https://drive.google.com/uc?export=view&id=1vN2qQQ1pdqQyDN58wlNnEYmFUj0yP0Li'
url='https://demo.dptheme.net/dp18/archives/1648']
[spanelitem
title='メディアスライダー'
titlesize='25px'
titlebold=''
titleitalic='1'
caption='自動再生する動画と画像のスライダー'
captionsize='13px'
txtcolor='#fff'
overlaycolor='#9b9412'
hovertitle='エフェクトは10種類'
hovercaption='YouTube, Vimeo, MP4対応'
hovertxtcolor='#fff'
hoveroverlaycolor='#4f4b04'
bgimg='https://drive.google.com/uc?export=view&id=1b4szhNJNJMzMwK5ZwkeWasQn1M2HOksf'
url='https://demo.dptheme.net/dp18/archives/4121']
[spanelitem
title='豊富なレイアウト'
titlesize='25px'
titlebold=''
titleitalic='1'
caption='ハイセンスなアーカイブデザイン'
captionsize='13px'
txtcolor='#fff'
overlaycolor='#0c9eb5'
hovertitle='+ widget'
hovercaption='専用ウィジェットも搭載'
hovertxtcolor='#fff'
hoveroverlaycolor='#065966'
bgimg='https://drive.google.com/uc?export=view&id=1-7NeteUOMtiA7DQtu8msXGyRA6Xf8jN8'
url='https://demo.dptheme.net/dp18/archives/3490']
[/spanel]