Come for the products,
stay for the community

The Atlassian Community can help you and your team get more value out of Atlassian products and practices.

Atlassian Community about banner
4,359,986
Community Members
 
Community Events
168
Community Groups

Create a floating TOC for Confluence Cloud

Hi,

I'm looking to create a floating table of contents for Confluence Cloud and was wondering if anyone's had any luck? 

I can see previous questions and all solutions are for Server based install. 

There are no Add-On's yet for Cloud for this either. 

There is a TOC Macro which i've implemented, and there is a CSS section, and was wondering if I could use this section to enable it to be floating so when users scroll, the table scrolls with it. 

Any help or insight would be appreciated. 

Thanks in advance. 

DP

2 answers

@Dipam Pala I believe the HTML and CSS macros inject their content into an iFrame. That's going to potentially create some limitations on what you're looking to do. 

0 votes

Not possible in Confluence Cloud. To do this you would need a custom HTML and CSS feature.

CSS:

.fixedPosition {
 position: fixed;
}

HTML

<script type="text/javascript">AJS.toInit(function(){
 AJS.$('.fixedPosition').each(function(){
  var clone = AJS.$(this).clone().css('visibility','hidden').removeClass('fixedPosition');
  AJS.$(this).after(clone);
 });
});</script>

 but unfortunately, in Confluence cloud, there's no custom HTML and CSS feature. 

Thanks Hazwan, 

Appreciate the feedback. I believe there's add-ons to have CSS an HTML features for Cloud, so will trial and test.

Thanks once again. 

Like Brad likes this

@Hazwan Ariffin are you able to create floating TOC in the Cloud version?

If yes, could you please share detailed steps here?

Like # people like this

I also want to understand if this possible on Confluence cloud 

Like Sven Larson likes this

A floating table of contents on the right-hand-side of each page would be amazing. Did anyone find a way to do this?

@Dipam Pala please reply back with an update

Was there an update on this topic?

Yeah, likewise - we'd love to have this feature for our docs / know of the workaround...

Likewise, keen to get this feature on our pages.  Has there been any update on this item?

Any updates on this? I have been searching for a solution here. Ideally, every page would have *both* a floating table of contents (like Google Docs have in the sidebar!) that could be expanded / hidden to help navigate large pages. 

Also, while I'm at it, can we make the Edit button floating? Always a pain to work on something and have to scroll to the top of the page, then enter the Edit workflow, then scroll back down to the spot where I need to make a change... (note: I normally use keyboard shortcut "E" to edit, but these small touches make Confluence so much more approachable for new users...)

Like # people like this

I have found there is a feature request in Atlassian's backlog for this:

https://jira.atlassian.com/browse/CONFCLOUD-72545

Like @Dipam Pala I also found a few add-ons that indicate they can be used to add custom HTML, CSS, and Javascript. I have not yet gotten through experimentation to see if the floating content can be generated with these. Here are a couple:

https://marketplace.atlassian.com/apps/1221470/html-macro-themes-for-confluence-cloud?tab=overview&hosting=cloud

https://marketplace.atlassian.com/apps/1221472/html-macro-for-confluence?hosting=cloud&tab=overview

Suggest an answer

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

Watch 4 Confluence apps compete for Best App Demo in September's Appy Hours

Calling all collaborators! Appy Hours on the Atlassian Community is a monthly event where 4 Partner and app vendor presenters go head-to-head with 5-minute demos for the title of Best App Demo. I...

507 views 0 12
Read article

Atlassian Community Events