Close accordion link

[candidcreative]

I’d like a Close/See Less link at the end of accordion content to save scrolling back up to close it. I have several accordions set up on the same page.

I’m running Wordpress 4.9.7–en_GB and Pro 2.1.5

Thanks

[paul.r]

Hi,

Thanks for writing in! Regretfully this isn’t a feature offered by X. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

Thanks for understanding. Take care!

[candidcreative]

Hi there - thanks for your reply.

I was hoping you’d be able to supply support ehre, in the same way that you have for X theme, at this link (https://theme.co/apex/forums/topic/close-accordion-button/) I’ve tried this solution, but it hasn’t worked on my set-up

Thanks

[christian]

Hey @candidcreative,

@paul.r’s answer is correct. You see, your situation is the main reason why we avoid giving custom codes unlike in the past. You copy a code from the thread and it does not work on your end. The truth is, the codes that we give here in the forum are not official parts of the theme therefore we do not offer support for them as they are not maintainable. We do not give much thought on the code’s quality or if it they will affect other parts of the theme and because of that, they have the potential to break or break other parts of the theme. Custom codes only serve as a guide for users who have some web development knowledge. They give an idea but not necessarily a solution. Let alone a solid solution for your project. Our mistake in the past though is we did not make this clear. We’re sorry about that.

I will give you an idea now, but again, please note that this is not a part of our support service. Issues that will arise from the use of this guide will not be supported and neither can we offer enhancements.

Use the Accordion element and not the Classic Accordion. Assign a open_accordion class to your button that will open all accordion and close_accordion class to the button to close all accordion and then add this code to your Content or Global JS.

jQuery(function($) {
  	$('.x-anchor-button.close_accordion').on('touchend click', function() {
  		$('.x-acc-header').removeClass('x-active');
		$('.x-acc-item div[role="tabpanel"]').addClass('x-collapsed');
	});
  	$('.x-anchor-button.open_accordion').on('touchend click', function() {
  		$('.x-acc-header').addClass('x-active');
		$('.x-acc-item div[role="tabpanel"]').removeClass('x-collapsed');
	});
});

I’ve tested that code and it works on my end. Please do keep in mind that this, like any custom code, has the potential to break or cause something to break now or in the future. If that happens, this should be forwarded to a third party developer.

Also, we could not always provide an idea or a solution. It just happens that I was able to for this case.

Thank you for understanding.