Can I display a flat table of contents using the first letter of the document name?

Kathryn Reddie September 23, 2020

University glossary.png

I'm trying to replicate the above onto a Confluence page, with the content pulled from labels.  Here's the original webpage - https://www.anu.edu.au/directories/university-glossary

Is there any way to do it, or should I just forget about it and use a live search function instead, and get the user to start typing what they are looking for?

Thanks in advance,

Kathryn.

 

1 answer

0 votes
David at David Simpson Apps
Marketplace Partner
Marketplace Partners provide apps and integrations available on the Atlassian Marketplace that extend the power of Atlassian products.
September 23, 2020

Back in the early 2010s, I wrote a Confluence macro called azList which did just this.

Here's a video of it in action (though sadly no longer maintained):

https://www.youtube.com/watch?v=cElY-7mSwAs 

It was based on the following jquery plugin:

https://github.com/dvdsmpsn/azList

It should be trivial to convert into a user macro for use on Confluence Server.

It would be a wrapper which inserts the following around an unordered list:

<div class="azList">$body</div>

Then adds the following javascript&colon;

AJS.toInit(function($){
$.each($('.azList > ul'),function(index, value) {
$(this).attr('id', 'azList-'+index); // Add a unique id to each ul
$(this).azList();
});
});

 And a sprinkling of CSS:

.azListIndex li {
display: inline;
padding: 0.2em;
}
.azListIndex li a {
background: #f0f0f0;
border-bottom: 1px solid #ccc;
padding: 0.1em 0.3em;
text-decoration:none;
}
.azListIndex a:hover {
background: #dedede;
border-bottom:1px solid #000;
}
.azListInitial {
list-style-type: none;
font-size:1.4em;
padding-top:0.6em;
background:none;
} 

Suggest an answer

Log in or Sign up to answer
DEPLOYMENT TYPE
SERVER
VERSION
7.3.1
TAGS
AUG Leaders

Atlassian Community Events