Skip Navigation

[Resolved] How to style accordion panel header?

This support ticket is created 8 years ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Kolkata (GMT+05:30)

This topic contains 1 reply, has 2 voices.

Last updated by Minesh 8 years ago.

Assisted by: Minesh.

Author
Posts
#438658
toolset-accordion-header-style.jpg

Hello!

I am trying to: 1) Make the accordion panel open when the user clicks anywhere on the accordion panel header, not just the text; and 2) Modify the style of the accordion panel header (text size, color, background, add an icon, etc.)

How can this be accomplished?

I visited this URL: hidden link

I expected to see: Be able to click anywhere in the panel header to open the panel

Instead, I got: The panel opens/closes only when the text label is clicked.

I also want to be able to add a caret icon to the right side of the panel header so it is clear to the user that the panel opens on click action.

Thank you!

#438824

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

It will require some custom CSS and jQuery code in order to apply open/close icons to your existing accordion.

You may try to refer to the guidelines given with the following URLs:
=> hidden link
=> hidden link
=> http://stackoverflow.com/questions/13778703/adding-open-closed-icon-to-twitter-bootstrap-collapsibles-accordions
=> hidden link

If you still need further help with your custom programming, please feel free to contact our certified partners:
=> https://toolset.com/consultant/

This ticket is now closed. If you're a Toolset client and need related help, please open a new support ticket.