1

I would need to create a component in SXA that displays a link to all elements on the page that have a h2 title.

In a non-SXA site I would know how to do this as I would have control over my components. They could set an anchor and set some values that can be read by the navigation component to display them as links. We also have solutions that enable us to get the navigation on top but still be executed after the other renderings. So that would be ok..

But I need to do this in SXA... and I still want to use the default SXA components. So, how can I:

  • add an anchor to the titles
  • list all those anchors (and the title as text for them)
  • make sure the anchor navigation rendering is executed after it has all information
Improve this question
1
  • without some custom JavaScript to read all the h2 tags and create the links, I don't think you will be able to do it with OOTB components. Unless you just add the javascript into the PlainHTML component :)
    – Richard Seal ♦
    Commented May 16, 2018 at 16:52

1 Answer 1

Reset to default
2

You can create custom JavaScript function:

  1. read all h2 tag on document.ready
  2. Create dynamic html with step-1 content
  3. Add dynamic html into div

You can use OOTB html snippet component to insert the JavaScript function or create custom JavaScript file and upload into theme.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.