DigiPress

Highly Flexible WordPress Theme

メニュー

ショートコード集プラグインに「フレックスボックス」を追加しました

2018/05/05

DigiPressテーマ専用のプラグインとして提供しております「Shortcodes for DigiPress」に新たに フレックスボックス用ショートコードを追加しました。

このショートコードを利用して、任意の複数の要素(コンテンツ)を表示幅に合わせて自動的に横並びに配置したり、等幅で表示させることができます。

注意事項

  • このショートコードによるコンテンツのフレックス表示はブラウザ(主にIE)のバージョンによっては反映されません。
  • 表示幅が680ピクセル以下の場合は、フレックスボックスは縦並び(column)表示になります。

対応ブラウザ/バージョン

22.0〜 19.0〜 11〜 6.1〜 12.10〜 4.4〜 7.1〜

表示例

※視認性のため、背景カラーを付けています。
1つ目のコンテンツ。
2つ目のコンテンツ。
3つ目のコンテンツ。
要素の個数に合わせて各要素の表示幅が自動で等幅表示されます。

このショートコード

[flexbox flexchildren=1]
[flexitem]
1つ目のコンテンツ。
[/flexitem]
[flexitem]
2つ目のコンテンツ。
[/flexitem]
[flexitem]
3つ目のコンテンツ。
要素の個数に合わせて各要素の表示幅が自動で等幅表示されます。
[/flexitem]
[/flexbox]

その他サンプルはこちらからご覧いただけます。

既存ユーザー様はご自身のアカウントでログイン後、以下よりこのショートコードによるフレックスボックスの表示サンプルシミュレータ、使い方、パラメータの詳細をご覧頂けます。

Share / Subscribe
Facebook Likes
Tweets
Hatena Bookmarks
Pinterest
Pocket
Feedly
Send to LINE