Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in

It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage

ToC and epand macro not work together Edited

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

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.

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?

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. 

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.

@David Simpson _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.

Suggest an answer

Log in or Sign up to answer
TAGS
Community showcase
Published in Confluence

🏑 Atlympic Event: Confluence

Hello Community!  Quick disclaimer: We are running a contest on Community (The Atlympics!) from July 23rd - August 8th of 2021. If you are interested in participating in this contest (prizes! ...

144 views 4 8
Read article

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you