Magento 2でアコーディオン内のすべてのタブを開いたままにする方法

1. HTMLとCSSを使用する方法:

   • アコーディオンのタブ要素に対して、デフォルトで開いた状態にするCSSクラスを追加します。例えば、"open"というクラス名を使用します。
   • 開いた状態のタブに対して、"open"クラスを割り当てます。
   • ページの読み込み時に、JavaScriptを使用して開いた状態のタブに"open"クラスを自動的に追加します。

   以下は、HTMLとCSSの例です:

   <div class="accordion">
    <div class="tab open">タブ1</div>
    <div class="tab">タブ2</div>
    <div class="tab">タブ3</div>
   </div>

   .tab {
    display: none;
   }
   .open {
    display: block;
   }

   JavaScriptの例は、ページの読み込み時に"open"クラスを追加する方法を示しています。必要に応じて、以下のコードをカスタマイズしてください。

   document.addEventListener("DOMContentLoaded", function() {
    var tabs = document.getElementsByClassName("tab");
    tabs[0].classList.add("open");
   });

2. Magento 2のカスタムテンプレートを使用する方法:

   • テーマまたはモジュール内にあるアコーディオンのテンプレートファイルをカスタマイズします。
   • テンプレートファイル内で、開いた状態のタブに対してデフォルトのクラスを追加します。

   以下は、テンプレートファイルの例です（デフォルトのテンプレートファイルのパスはテーマやモジュールによって異なります）:

   <div class="accordion">
    <div class="tab active">タブ1</div>
    <div class="tab">タブ2</div>
    <div class="tab">タブ3</div>
   </div>

   カスタマイズしたテンプレートファイルを使用することで、アコーディオン内のタブが開いた状態で表示されます。

これらの方法を使用することで、Magento 2のアコーディオン内のすべてのタブを開いたままにすることができます。必要に応じて、アコーディオンのスタイルや動作をカスタマイズしてください。