How to use URL jump marks (anchors)

URL jump marks (also called anchors) let you link directly to a specific section or action on a page. Instead of landing at the top of the page, visitors are taken straight to the relevant component or a specific step in the contact wizard.

This can improve the user experience by reducing the number of clicks needed to reach important content.

What is a URL jump mark?

A jump mark is added to the end of a URL after a # symbol.

For example:

  • https://www.engelvoelkers.com/de/de#newsletter

  • https://www.engelvoelkers.com/de/de#contact

When someone opens one of these URLs, the website automatically navigates to the corresponding component or opens the requested contact flow.

Jump marks for page components

The following jump marks are currently available for page components:

  • #form

  • #eventSignUpForm

  • #recruitingForm

  • #downloadForm

  • #newsletter

  • #searchBanner

  • #banner

  • #linearStepsModule

  • #AffordabilityCalculator (excl. DE)

  • #LocationPreview

Example

To link directly to the newsletter component:

https://www.engelvoelkers.com/de/de#newsletter

This also works on pages such as shop profiles, provided the component exists on that page.

Example:

https://www.engelvoelkers.com/de/de/shops/berlin-hohenzollerndamm#newsletter

Jump marks for the contact wizard

You can also use jump marks to open the contact wizard. Depending on the jump mark, visitors can either start at the topic selection or jump directly to a specific intent.

Available jump marks:

  • #contact: Opens the contact wizard with the topic selection.

  • #contact-sell: Opens the Sell or Rent out intent directly.

  • #contact-buy: Opens the Buy or Rent intent directly.

  • #contact-career: Opens the Career intent directly.

  • #contact-other: Opens the Other intent directly.

Examples

Open the contact wizard:

https://www.engelvoelkers.com/de/de#contact

Open the Sell or Rent out intent directly:

https://www.engelvoelkers.com/de/de#contact-sell

These jump marks also work on Leadhub pages, such as shop profiles.

Using jump marks in Storyblok

Many components with action buttons allow you to select one of the supported jump marks as the button target. This makes it easy to create buttons such as:

  • Contact us

  • Subscribe to our newsletter

  • Download the brochure

  • Calculate affordability

without entering the full URL manually.

The available jump marks are maintained in a Storyblok datasource. Each jump mark must also be mapped to its corresponding component in the website code.

Because of this, new jump marks cannot simply be added in Storyblok. Adding support for a new component requires assistance from Engineering.

Things to keep in mind

  • The target component must exist on the page. Otherwise, the page cannot scroll to it.

  • Contact wizard jump marks work on both Storyblok pages and Leadhub pages.

  • On agent profile pages, the Career topic is not available. If you use #contact-career, the contact wizard opens at the topic selection instead of the Career intent.

  • Always test your links after publishing to ensure they navigate to the expected location.

Best practices

  • Use jump marks when you want to guide visitors directly to an important action, such as subscribing to a newsletter or submitting a contact request.

  • Link directly to the most relevant contact intent whenever possible to reduce unnecessary clicks.

  • Reuse the existing supported jump marks instead of creating custom anchor names.

  • Test jump mark links on the published page before sharing them externally.