WordPress anchor links not working? Fix the jump to your form

Your service page has a “Request an estimate” button near the top and a form farther down. Clicking the button should bring the form into view. Instead, nothing moves, the visitor lands on another page, or the section title disappears beneath the fixed header.

Those symptoms need different fixes. Start with the link and its target, then check the page address and the space below the header. A new scrolling plugin is not the first thing to add.

Here is a fictional example: a landscaping company in Portland, Oregon, has a long service page with an estimate form. We will use estimate-request as the target name. Replace the example page path with your own published address.

Find out which part of the jump is failing

Open the public page and click the affected button. Watch the address bar and note where the page stops. This small check gives you a better starting point than repeatedly changing the button text.

What happens	Check first
The address gains a # fragment, but the page stays put.	Does the target exist with the exact same name?
The jump reaches the wrong section.	Is the target name attached to the wrong block or used twice?
It works on the service page but fails from another page.	Does the link include the destination page’s address?
The section is reached, but its heading is hidden.	Is the fixed header covering the landing position?

Also check the saved link in the editor. A button that contains only # has not been given your section’s name. Changing its visible label to “Request an estimate” does not supply that missing destination.

Give the destination one stable, unique name

Select the Heading block immediately before the estimate form. In its block settings, open Advanced and enter estimate-request in the HTML Anchor field. Leave out the # here. The official WordPress page-jump guide explains this field and how to link to it.

Use a short name that describes the section. Keep capitalization consistent and avoid spaces. In our example, the heading people read could be “Tell us about your yard,” while the anchor remains estimate-request. The heading text and its anchor do different jobs.

Check for duplicates if you copied a section or made separate desktop and mobile layouts. MDN’s ID reference specifies that an ID must be unique within the document. Two blocks with the same target name make the markup invalid, even if one is visually hidden. Give each actual target its own ID and point the button to the intended one.

Avoid renaming a working anchor just to match a revised heading. Someone may already have bookmarked the section or linked to it from another page. If a rename is necessary, include those existing links in the change list.

Match the button to the right page and section

Select the individual Button block and open its link control. The WordPress Buttons documentation shows that control separately from the button’s text. For a button on the landscaping page itself, enter #estimate-request, apply the link and save the page.

A button on the homepage needs the service page too. If its published path is /landscape-design/, the link can be /landscape-design/#estimate-request. A fragment-only link on the homepage looks for the target in that current document; it does not know that the form belongs to a different page.

Use the real destination URL when editing a shared navigation link. A link that happens to work while you are viewing the service page can still fail everywhere else the menu appears. Our guide to adding internal links covers choosing and checking the destination before placing the link.

A normal HTTP check is not enough here. As MDN explains about URL fragments, the browser handles the part after #; it is not sent to the server with the request. A page can return HTTP 200 while the section name is missing. Confirm the target in the page itself.

If the header hides the heading, adjust the landing space

When the correct section is reached but its heading sits behind a fixed header, keep the working target. Ask your maintainer to check the scroll offset or the theme’s existing anchor settings.

For ordinary browser scrolling, a targeted CSS rule can provide clearance. MDN’s scrolling examples describe using scroll-margin-top for this fixed-header problem. An illustrative starting point is:

#estimate-request {
  scroll-margin-top: 6rem;
}

The 6rem value is an example, not a universal header size. Adjust it to the actual header and check both screen sizes. This rule matches that ID wherever the stylesheet applies; if other pages reuse the same name, have the maintainer scope the rule to the intended page.

For block themes, WordPress provides custom CSS through Styles. Its site-wide CSS and block-type CSS controls have different scopes and syntax, so use the appropriate location. Do not paste a complete selector into a field that expects only property declarations.

If a page builder controls scrolling, check its supported settings first. Do not keep adding competing snippets when the landing point changes unexpectedly. Identify which component handles the click and let the maintainer test one change at a time.

Ask Niwa to prepare the content correction

Niwa can read a WordPress page’s stored content and prepare a content update for review. When the button and target are stored there, give it the exact page and intended section. A useful request is:

“Inspect the estimate button and target heading in this page’s stored content. Show the current link and anchor. Prepare a correction so the button reaches the estimate section, preserve the other content, and show me the complete proposed page before saving.”

Check the full proposed content before approving it: the destination, target ID, nearby form block and unrelated sections. A page-content update writes the complete content. If the element lives in a shared template, builder field or external form, establish that source separately. Reading ordinary page content does not prove that Niwa has inspected every layout setting.

For a wider change, use the same explicit before-and-after review described in our guide to reviewing website changes. Keep any CSS adjustment separate from the content proposal so its scope is clear.

Test the route visitors actually take

After saving, open the public page while logged out. Test the button on desktop and a phone, then open the full page-and-fragment address in a fresh tab. If the link is in a shared menu, test it from another page as well. Confirm that the right heading and form are visible below the header.

Reach the link with the keyboard and activate it. Check that the next useful controls can be reached and that focus remains understandable. A scroll that looks right with a mouse is only part of the visitor’s route.

Keep a short record of the final page URL, anchor name and test results. Reaching a form is not a submitted estimate request; test submission and delivery separately with the person responsible for the form. The jump is fixed when visitors reach the intended section consistently.

Book a Niwa demo to review a specific WordPress task with us. During your Niwa demo, we cover the subscription and AI usage. There is no obligation to buy.