アコーディオン(Pro版のみ)


アコーディオンブロックは、コンテンツ内が長くなってしまった場合にコンテンツ部分を折りたたんで隠すことができますので、すっきりとしたページ作りができます。

使用例

スタイルは7種類あります。タイトル部分には、WordPress 標準の見出しブロックと VK Blocks のアイコンブロックを横並びで配置し、Font Awesome アイコンを表示させています。

背景なし

お車でお越しの場合

駐車場代無料100台収容可能。バスも一般車も駐車可能です。
○○インターチェンジより国道〇号線を南へ3Km、「ベクトル」の交差点を右折、200mほど道なりで左手にございます。

電車をご利用の場合

名古屋駅から
名鉄「名古屋駅」より名鉄○○線「ベクトル駅」で下車。徒歩約20分。

背景なし / 枠線

お車でお越しの場合

駐車場代無料100台収容可能。バスも一般車も駐車可能です。
○○インターチェンジより国道〇号線を南へ3Km、「ベクトル」の交差点を右折、200mほど道なりで左手にございます。

電車をご利用の場合

名古屋駅から
名鉄「名古屋駅」より名鉄○○線「ベクトル駅」で下車。徒歩約20分。

背景あり

お車でお越しの場合

駐車場代無料100台収容可能。バスも一般車も駐車可能です。
○○インターチェンジより国道〇号線を南へ3Km、「ベクトル」の交差点を右折、200mほど道なりで左手にございます。

電車をご利用の場合

名古屋駅から
名鉄「名古屋駅」より名鉄○○線「ベクトル駅」で下車。徒歩約20分。

背景あり / 枠線

お車でお越しの場合

駐車場代無料100台収容可能。バスも一般車も駐車可能です。
○○インターチェンジより国道〇号線を南へ3Km、「ベクトル」の交差点を右折、200mほど道なりで左手にございます。

電車をご利用の場合

名古屋駅から
名鉄「名古屋駅」より名鉄○○線「ベクトル駅」で下車。徒歩約20分。

背景あり / 角丸

お車でお越しの場合

駐車場代無料100台収容可能。バスも一般車も駐車可能です。
○○インターチェンジより国道〇号線を南へ3Km、「ベクトル」の交差点を右折、200mほど道なりで左手にございます。

電車をご利用の場合

名古屋駅から
名鉄「名古屋駅」より名鉄○○線「ベクトル駅」で下車。徒歩約20分。

背景あり / 角丸 / 枠線

お車でお越しの場合

駐車場代無料100台収容可能。バスも一般車も駐車可能です。
○○インターチェンジより国道〇号線を南へ3Km、「ベクトル」の交差点を右折、200mほど道なりで左手にございます。

電車をご利用の場合

名古屋駅から
名鉄「名古屋駅」より名鉄○○線「ベクトル駅」で下車。徒歩約20分。

装飾なし

「装飾なし」のスタイルは、中にグループブロックを入れることで、アコーディオンの色や余白を調整しやすくなります。

たとえば、以下のようなQ&Aが作れます。

はい、会計ソフトは事業の規模に関わらず非常に有用です。会計ソフトを使用することで、財務記録を簡単に整理・管理し、正確な財務報告を効率的に作成できます。また、会計ソフトは税務申告の準備を容易にし、経費追跡や請求書の発行などの日常業務を自動化するのに役立ちます。

はい、ビジネスの規模とニーズに応じた会計ソフトの選定から導入、さらに使い方のトレーニングまでサポートいたします。

参考パターン: 会計事務所 よくある質問 アコーディオン | VK パターンライブラリ

アコーディオンブロックを挿入すると、以下のブロックがセットで配置されます。

  • アコーディオン タイトル
  • アコーディオン コンテンツ

それぞれのブロックの中に、グループブロックを入れて調整しています。

初期状態の開閉設定

初期表示の際に、アコーディオンの開閉状態を指定できます。開いて表示させたい場合は、設定パネルの「アコーディオン設定」の初期表示状態で「開く」を選びます。

また、デバイスごとの開閉も指定できます。

「デバイスごとに初期状態を設定」をオンにすると、モバイル / タブレット / PC でのデフォルトの開閉状態を指定できます。PCではアコーディオンを開いた状態で初期表示させたいが、タブレットとスマホでは閉じた状態でよいときなどに、ご利用ください。

PAGE TOP

このデモサイトは Vektor,Inc. のテーマとプラグインで構築されています。ご購入や詳細情報は下記のリンクもご参考ください。