Great question! This is a little more "advanced" but is straightforward enough. You'll basically just need to find and link to the section ID of each accordion.
How to find a section ID using devtools
Note: this is easier to do on a "live" page instead of in the theme editor/template, but both are possible.
- While on the FAQs page/template open your browser's dev tools
- Devtools info for Chrome available here
- Devtools info for Firefox available here
- With devtools open, hover and click into the section for which you are trying to find the ID in your browser window.
- The section will be highlighted in the code and the frontend as you click through various chunks of text in devtools.
- This may require a bit of clicking around and you may need to "expand" or "un-nest" parent containers in the theme editor
- Once you find the section you're looking for, you will see that it starts with something like "<section id="shopify-section-template--15276797132844__accordion-01"
- Click into the id snippet of that code and copy this ID…
- Find the button for the block you are trying to link and paste this in as your link URL.
- Note you must type a single hash ("#") into the "button link" setting before the section ID.
- The hash tells the frontend that this URL is actually on the same current page, so the browser won't try to navigate to another/external URL.
- So in the example above, I would have #shopify-section-template--15276797132844__accordion-01 as the URL in my button link.
- Repeat for the other sections as needed.
We've recorded a little example of this process which is available below:
👀 Screenshare showing how to find the a section ID using your browser's devtools.
