How to Create Anchor Links in WordPress

Aug 18, 2015 | WordPress Wednesday

Creating Anchor Tags Video

Creating anchor tags in WordPress is not the most intuitive process. Here’s a quick video to simplify the task.

This is the nerd code that you can use to create the point on the page that you want the individual to speed down to:

<a name=”tag_name_here”></a>

Then you would use think link – www.yourdomainname.com/#tag_name_here

Trying to do this in DIVI? There’s an even easier way – https://youtu.be/XysLoSUbt9s

Full Video Transcript

Hi everyone! Welcome to another WordPress how-to video. Brought to you by me – Kori Ashton. I want to thank Grace for sending in a question regarding; anchor tags and anchor links inside of WordPress. Wondering…how do you make that happen?

Some of you might have called them “speed tags” or “speed dials”. And that’s when (let’s say you have a really long page like this,) and you want to allow somebody to quickly zip or speed dial down the page. Maybe down here to Judo Topics.

So, I’m going to show you how to do that Today using just a little bit of “nerd code.”

We want to go in to your dashboard area and go to the page itself. This is the page and I’m in the “text mode” not the “visual mode.” I want to scroll down to the area that I want them to be able to zip down to.

So, I’m going to go here. Here is my h2 tag. This is actually where I want them to be able to kind of zip right down to. Put some space in there and I’m going write this little bit of “nerd code.” <a (which is for your link) name = open quotes. I’m going to close my quotes. I’m just going to type in, Judo. Close the link and… Just like that!

So now if I were to click over to “visual mode” here and scroll down the page, you’re actually going to be able to see a little tiny box that has an anchor in it. See! Check that out. So that is actually the anchor point on the page that it will speed down to.

Now, I need the text that they click on to make that happen.

So, I’m going to go back up to the top of my page. I’m going to enter data. I’m going to type in click here for more Judo topics. I’m going to highlight that because I want that whole area to be what is “clickable.” I’m going to click on “link.” Instead of typing in a whole long URL, I’m just going to use a hash tag (and remember what I named it.) I named it, Judo. Hash tag, Judo. Add link. See it has all this nerd code for you beautifully! So if I were to click “updated” and go back to my test page here and click, “refresh.” Now, I should have it. A link here that says “click here for more Judo topics.” When I click on there it should zip me down the page to Judo topics. Check that out! Pretty cool.

Let’s say you want to do that, but you want this link when they click here to take you to a different page and zip down to a certain spot.

Let me show you how to do that.

So, let’s go to another page that we want to put that anchor on. Lets say…another page. Again, being in text mode- or what we call “nerd code mode.” You’re just going to drop in that same anchor tag that we created on the other page.

Just drop in-a name, Judo. Going into the visual mode; you’ll see there is a little anchor right here. So, that sets the anchor point on the page that you want them to zip down to. Click, “update.” We’re going to view this page. What we want to do is grab the link right here. Okay. We want to grab this link because this is the page we want them to go to. Then we’re going to go back to that text that we have that’s linked. We’re going to go to our test page. This is our linked text. I’m going to switch back to text “nerd code” mode. Just before that hash tag I’m going to paste in that pages’ URL. Okay. So you have the full URL of the page you want to go to. \#Judo.

Alright., so now when we click “update.” Go back to my test page. If I click “refresh,” it should now (when I click on that,) take me to…perfect…another page and down to the Judo section. So, this is another page and it immediately brought me down to that really that spot on the page that’s just fast, there’s my topic. That’s what I want people to see.

So, I hope this video helps you. I am going to place a link where you can get this “nerd code” and literally just copy and paste it onto your WordPress website.

If you have any other questions connect with me over on Twitter @KoriAshton or email me your questions here on the website.
Have a great day y’all. Bye, bye!