Forums

Articles
Create
cancel
Showing results for 
Search instead for 
Did you mean: 

ToC and epand macro not work together

Marcin Szumicki June 24, 2021

Hi,

I have a problem with ToC and expand the macro when I use them together.

Some headers are in expand macro area.

The link from the table of contents doesn't take me to the header (h1, h2, h3, ..) if the header is in expand macro that is currently collapsed.

When macro are epanded links works fine.


h1
   h2
   h3

(h1)text 
asd
--expand macro area --

h2
asda

h3
dsad

--expand macro area --

 

3 answers

1 accepted

1 vote
Answer accepted
David at David Simpson Apps
Atlassian Partner
June 24, 2021

If the heading is hidden within an expand macro, then the link from the ToC will not automatically open the expand so that you can jump to the heading.

Browsers do not work like that. If the linked item is hidden, likely nothing will happen.

Try structuring your page so that headings are not hidden, or remove some of the nesting levels in the ToC macro.

Marcin Szumicki June 24, 2021

Hi, David
thx for answer.

I describe the elements of webservices. H1 is my service and h2 is my method.

Expand macro was supposed to help me present only a given content and reduce the data on the page.
Is there any other replacement for the expanded macro that would work with ToC?

1 vote
David at David Simpson Apps
Atlassian Partner
June 25, 2021

As you're on Confluence Server, you can hack this to work.

Add the following code to Custom HTML | At end of the HEAD:

<script>
  // for https://community.atlassian.com/t5/Confluence-questions/ToC-and-epand-macro-not-work-together/qaq-p/1733348#U1733374
  AJS.toInit(function ($) {
    setTimeout(function () {
      $('.toc-macro a').on('click', function () {
          var $self = $(this);
          var $target = $($self.attr('href'));
  
          if($target.is(':visible') == false) {
            $target.parents('.expand-container:first').find('.expand-control:first').click();
            setTimeout(function () {
              if ($target.is(':visible') == true) {
                $self.click();
              }
            }, 300); // wait a little for the expand to open
          }
      });
    }, 3000); // wait a while for the ToC to load. Should really use Mutation Observer API
  });
</script>

This will wait (hopefully) until the ToC has loaded, then for each heading in an expand, when the ToC link is clicked, it will see if the heading is hidden, then open the parent expand macro, then wait a moment while the expand opens, then go to the link.

It's by no means perfect, but a reasonable first attempt at hacking a solution to your problem.

Marcin Szumicki June 25, 2021

@David at David Simpson Apps 
thank you very much

I will try to test that. 
Now i looking for admin in organisation to put changes into code.

1 vote
David at David Simpson Apps
Atlassian Partner
June 24, 2021

If you’re on Cloud, there’s not a lot you can do.

On Server/DC, you could add a client side/ JavaScript click handler on the ToC macro which expands the macro first. 

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events