Is there a toggle (display none) available to deactivate some accordion tabs?

Hi @2share,

Thanks for reaching us. Hope you are doing well.

We have visited your site. Unfortunately, we didn’t find the Accordion section. Currently, there is no direct option to hide the accordion item separately. But it can be achieved by tweaking some custom CSS. Please apply the following CSS in the plugin’s custom CSS field.

.ea-card .ea-header a[data-sptarget="#collapse6572"]{
        display: none;
}

N.B.: Each accordion-item has its own particular collapse Id. In my case it is #collapse6572, yours must be different. Inspect the specific accordion-item that you don’t want to display, copy that collapse id and replace it with mine. Please have a look at the screenshot.

After using the above code please let us know if it works or not. If the CSS doesn’t work for you then we would request you to share the exact page link where you have used the Easy accordion section. We will provide the solution according to that.

We are looking forward to your reply.

Hello Bayejid,

thanks for that helpful css code.
I am using a shortcode plugin and there it is working great.
The only down thing is, that now some lines are displayed where the former collapsed tabs have been.

Screenshot > https://capture.dropbox.com/1r16UEaSwfcgNzXU

Best Alex

Hi @2share,

Sorry for the delayed response. Remove the previous CSS and use the following CSS to hide the specific item.

#sp-ea-130 > .ea-card:nth-child(2), 
#sp-ea-130 > .ea-card:nth-child(3) {
    display: none;
}

Here: replace 130 with your shortcode id and replace 2 or 3 to hide that items.

Let us know if it works or not.

Hello Bayejid,

sorry for the late response, I was 14 days in holiday.
Unfortunately it is not working and I need some more help to get this done.

I’ve used your code example and replaced the corresponding ID’s

/* LEVEL 3 - BODY CARE - Tips for men*/
#sp-ea-30464 > .ea-card:nth-child(304642), /* Accordion Tab - Display none - Hair Loss*/
#sp-ea-30464 > .ea-card:nth-child(304643), /* Accordion Tab - Display none - Skincare*/
#sp-ea-30464 > .ea-card:nth-child(304644) /* Accordion Tab - Display none - Weight Loss*/ {
    display: none;
}

But it does not work. Please find here a screen video explainer > https://capture.dropbox.com/CVdbdAhZ8ZFfeWVA

Accordion Targeted URL

Best regards, Alex

Hi,

Use the following CSS to hide.

#sp-ea-30464 > .ea-card:nth-child(3), /* Accordion Tab - Display none - Hair Loss*/
#sp-ea-30464 > .ea-card:nth-child(4), /* Accordion Tab - Display none - Skincare*/
#sp-ea-30464 > .ea-card:nth-child(5) /* Accordion Tab - Display none - Weight Loss*/ {
    display: none;
}

Note: in codes, 3, 4, and 5 are the order of items of that accordion.

After using the CSS, let us know if it works or not.

Hello Bayejid,

thank you very much, it works perfect now!

Best regards, Alex

• This reply was modified 2 years, 8 months ago by 2share.

Hi

Nice to hear that it works perfectly now. If you like the plugin and support, share your experience in the review section.

Thank you too and have a nice day!

Done!

Hi @2share,

Thank you so much for your valuable review.

Have a great day ahead!