VK Blocks Pro アコーディオンブロックのHTMLの変更に関する予告

いつも弊社製品をご利用いただきありがとうございます。

次回アップデート VK Blocks Pro 1.13.0 にて、アコーディオンブロックのHTML構造の変更を行う予定です。

アコーディオンブロックのCSSを独自にカスタマイズしている方はご注意ください。

変更の理由

普段は後からクラス名やDOM構造を変更するという事はしないのですが、WordPressのアップデートでDOMの入れ子を少なく出来るようになった事、class名の命名と役割が一致していない事から、今後CSSでカスタマイズしようとする人が混乱しないように、まだカスタマイズしての利用者が少ないうちに変更を実施しようという判断です。

1.12.0 までのアコーディオンブロックが出力するHTML例

<div class="wp-block-vk-blocks-accordion vk_accordion-container">
    <div class="vk_accordion-header"></div>
    <div class="vk_accordion-body">
        <div class="wp-block-vk-blocks-accordion-trigger vk_accordion-trigger">
            <p>アコーディオンタイトル</p>
            <span class="vk_accordion-toggle vk_accordion-toggle-close"></span>
        </div>
        <div class="wp-block-vk-blocks-accordion-target vk_accordion-target vk_accordion-target-close">
            アコーディオン コンテンツ
        </div>
    </div>
    <div class="vk_accordion-footer"></div>
</div>

1.13.0 からのアコーディオンブロックが出力するHTML例

<div class="wp-block-vk-blocks-accordion vk_accordion">
    <div class="wp-block-vk-blocks-accordion-trigger vk_accordion-trigger">
        <p>アコーディオンタイトル</p>
        <span class="vk_accordion-toggle vk_accordion-toggle-close"></span>
    </div>
    <div class="wp-block-vk-blocks-accordion-target vk_accordion-target vk_accordion-target-close">
        アコーディオン コンテンツ
    </div>
</div>