Makes sense why you’d want to add these; they’re easy to add in traditional rich text editors, but take a little more work to get set up in Contentful.
Here’s what’s worked for me:
- Create a content type and title it Jump Link Component .
- Add a short text field titled Component Name .
- Add a short text field titled Identifier .
- Click on the Identifier field settings and then the validation tab.
- Select Prohibit a specific pattern and add /^\S+$/ to the regex input field. This will prevent users from being able to type spaces into this field (if spaces are added here, you cannot generate the proper jump link)
Now, as an example, let’s say you wanted to link to the “About Us” section of your homepage:
- Navigate to the page component for your homepage.
- Then, find the “About Us” section on that page.
- Create a new Jump Link Component and reference it above the “About Us” section, whether that’s in a Rich Text Field or a multi-reference field.
- Create links to this section combining the page link with the identifier set in the Jump Link Component . In the example of the “About Us” section, the link would look something like yoursite. com/ #about-us-section
Developer note: you will need to configure your front end to add a div with an id that matches the identifier wherever a Jump Link Component is added.
Hope this helps. Let me know if I can answer any questions.