Link Directly to a Tab Item or Accordion Panel
Overview
Last updated:
Use this guide when you want to link from one page to another page and have a specific UW Tabs item or UW Accordion panel open automatically when the visitor arrives. This concept is sometimes referred to as “deep linking.”
On this page
Before you start
Please be aware of the following when using this feature:
- This does not work as same-page jumplinks (also known as anchor links or page jumps” in WordPress).
- Each tab label or accordion heading on the destination page must be unique or your links will not work.
- For example, you cannot have multiple accordion panels on a page titled, “Program Information.”
How to create a deep link
Please be aware of the following when using this feature:
Step 1: Go to the destination page
- Open the page that contains the Accordion or Tabs block (the page you want to link to).
- Make sure the page status is set to Published and is available to site visitors.
Step 2: Activate the item you want to link to
- Click the specific tab you want opened, or click to expand the specific accordion panel.
- After you click it, look at your browser address bar. The URL should update to include a short fragment at the end (often starting with #).
- Example format: https://something.wisc.edu/program/#program-information
Step 3: Copy the full URL from the address bar
- Click in the address bar.
- Copy the full url (including the #… part at the end).
What visitors will experience
When someone clicks the link, the destination page loads and the matching accordion panel or tab item opens and is scrolled to.
Best practices
- Keep accordion and tab titles short and meaningful. Short labels produce cleaner links and clearer navigation.
- Use heading inside Accordion or Tab panels to improve scannability for users landing mid-page
- Test the links after publishing to ensure that the correct panel opens and the scroll position is correct.
- Avoid stuffing too much content into one panel; it reduces the usefulness of deep linking if the user lands on a section but still faces long scrolling.