cancel
Showing results for 
Search instead for 
Did you mean: 

How do i show the plus and minus with accordion

How do i show the plus and minus with accordion

Hi.

I've bought an extension that adds a extra field on the sign up page but I would like it to be hidden by default so the user actively needs to click it to show.

 

The code below seems to do most of the work but I would like have a "plus"/"minus" icon to highlight that this text is expandable.

 

<div data-mage-init='{"accordion":{"openedState": "active", "collapsible": true, "active": false, "multipleCollapsible": false}}'>
    <div data-role="collapsible">
        <div data-role="trigger">
            Title 1
        </div>
    </div>
    <div data-role="content">
        <p>
            Content 1 bla bla bla.
        </p>
    </div>
</div>

It looks like it is possible if I follow this link https://devdocs.magento.com/guides/v2.2/javascript-dev-guide/widgets/widget_collapsible.html but I don't know where I have to add the code for it to work.

 

Thanks in advance!

2 REPLIES 2

Re: How do i show the plus and minus with accordion

Hi @TONZR,

I read your question for adding plus/minus you can try the Add class remove class options using javascript It would be helpful for you

If my answer is useful, give kudos and accept as solution

Best regards
Madhuresan
Bootsgrid

Re: How do i show the plus and minus with accordion

Hello @TONZR

 

Please check this link https://mirasvit.com/blog/building-tabbed-interface-with-magento-2-javascript-ui.html

 

------------------------------------------------
If my answer is useful, please Accept as Solution & give Kudos