Make Accordion Content Easier to Find and Share
Quickstart 3.6 comes to Arizona Sites on October 28, bringing new design options that support the university’s brand rollout, along with practical improvements for your website. Direct accordion links help you send visitors to specific information, while an optional Copy link button makes that information easier for visitors to share.
Send Visitors Straight to the Answer
When someone follows a direct link to an accordion, it expands and the page scrolls directly to it. Visitors arrive at the relevant information, with the surrounding page still available for context.
This works for every accordion. You can use direct links to:
- Answer a question with a specific FAQ.
- Share instructions in a support response.
- Connect related information across webpages.
- Highlight a particular topic in an email or newsletter.
Help Visitors Share Your Content
The optional Copy link button gives visitors an easy way to get a direct link to an individual accordion. They can copy it to their clipboard and share it in an email, message or webpage.
Consider enabling it for FAQs, instructions and other content people may want to pass along. It makes sharing a specific answer easier than sending a link to the whole page and explaining which section to open.
Get a Direct Link
When the Copy link button is enabled, use it to copy the accordion’s link.
Without the button, a direct link can be constructed using the page URL followed by # and the accordion’s HTML ID. Finding that ID takes a little more work; your Portfolio Manager can help if you need a link and aren’t sure how to identify it.
See It in Action
This link goes directly to the accordion above
Follow the example link to see the accordion expand and the page scroll to its content.
A Closer Look at the Implementation
An anchor identifies each accordion within the page. Following a link to that anchor expands the relevant accordion and scrolls it into view. The optional Copy link button makes the direct URL readily available to visitors.
For details about the underlying functionality, see the accordion anchors pull request (#2247).
Need Help?
Your Portfolio Manager can help you create direct links or decide where enabling Copy link would benefit your visitors.