How do I make a link scroll down to a certain spot on the same page?

A subscriber asked me how to create a web page where if you click on a link, it jumps down to a different section below (on the same page.)

Here’s an example of what that looks like, and then a quick tutorial on how to create those anchors.

In this tutorial, I use the free version of the Kadence Blocks plugin:

Kadence Blocks gives me a new SPACER / DIVIDER block in the WordPress Gutenberg editor that lets me add an anchor name to the spacer / divider block. (The default WordPress block doesn’t currently let you do that.)

I’m using the default WordPress Twenty Twenty theme so it automatically has the smooth scrolling effect in it. If I had a different theme that didn’t have that smooth scrolling effect, it’s easy enough to add that effect.

The free Page Scroll to ID plugin is what I typically use for clients:

FYI: You need a self-hosted WordPress website in order to install your own plugins.

Watch the video

  • If you have any questions, please ask on the YouTube video page here.