Support » Plugin: LuckyWP Table of Contents » Automatically toggle / open accordion block after clicking anchor / link

  • Resolved thinh94

    (@thinh94)


    Hello everyone,

    I was wondering if it’s possible to open an accordion after clicking an anchor/link.

    As an example:
    I have an accordion (stackable) with a headline tag in it.
    I have a table of content that includes this headline tag.
    So the ToC has an ExampleHeadline on example-url.com/page.
    It brings me down to example-url.com/page/#ExampleHeadline.

    An example page is included.

    What do I have to do to make it open when I click on the ToC link?

    As a further level, which is not essential tho, can I even open an accordion block within an accordion block using such a method?

    Thank you for your help.
    Stay safe and healthy.

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author LuckyWP

    (@theluckywp)

    Hello, @thinh94 !

    Try use this JavaScript code:

    (function($){
    	$(function(){
    		$('.lwptoc_item A').click(function(){
    			var $target = $($(this).attr('href'));
    			if ($target.length) {				
    				$target.parents('.ugb-accordion').each(function(){
    					var $this = $(this);
    					if (!$this.hasClass('ugb-accordion--open')) {
    						$this.addClass('ugb-accordion--open');
    					}
    				});
    			}
    		});
    	});
    })(jQuery);

    Hello @theluckywp !
    Thank you so much, this is working perfectly!

    First I didn’t know how to add the script and then I found your Plugin: LuckyWP Scripts Control. You’re awesome!

    Much appreciated 🙂

    Plugin Author LuckyWP

    (@theluckywp)

    Great!
    I glad what you resolved problems 🙂

    Good evening,

    I am using the toogle tool: The page I need help with is: https://www.cornare.gov.co/proyectos-cornare-por-municipio/

    What I need to do is to open an specific toggle item when I click on an URL.

    In the example page I have a text named Abejorral in which I click and it is supposed to go and show the content of the toogle item with this ID.

    I appreciate your help. Thanks in advance.

    Plugin Author LuckyWP

    (@theluckywp)

    Hello, @webmastercornare !
    Where on your page table of contents?

    Hi Lucky,
    Thanks for your reply, I am starting as a webmaster so I appreciate your help.

    I wonder if can expand an specific accordion item after clicking an anchor link. For example if I click over the word Abejorral; https://www.cornare.gov.co/proyectos-cornare-por-municipio/#Abejorral
    what I need is to expand/show only the content of the accordon item with the id=Abejorral

    In the page I shared, I am using the toggles element to collapse the content, because it is going to be about 26 items ( in the page I shared I only have 3 for now).

    I haven’t figured out in my case how to open an specific item of the accordion by clicking anchor/link

    Thank you very much for your help

    Plugin Author LuckyWP

    (@theluckywp)

    For make this you need write JS-script, which on click an anchor link will be expand accordion.

Viewing 7 replies - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.