9. A Link Tags

				
					
<a href="url">link text</a>
				
			

Video Summary

All right, this is the link element or the a tag. And this is how we can link different tax pictures sections of our webpage to go to a another web page. Now, we can link this within our website. So let’s say if you’re on your homepage and you want to go to one of your service pages, we can set that up through an a tag. If you’re writing a blog article, and you want to reference something we can use a tag. So before we hop into code pen, I do want to go over the addition to these different tags, right. So we have the a tag right here, and you can see that we have the h ref equals the two parentheses and the URL. So with an a tag, we need to we need a reference or specify which URL we want to take the user to. Right so h ref is just short for HTML reference, which is just a what web page are you trying to take the user to? And basically all we got to do is enter in the URL right here, and everything will be good to go. Alright, so let’s hop in a code pen because you’ll see how this works in a second. 

Alright, so we have a little paragraph right here. This is a sense of a paragraph what we want to do now is we want to use our eight tags. So we’re going to do is we’re going to do the pointing arrow a an h ref equals had the parentheses and we’re going to wrap that into a pointing arrow bracket. 

What we’re going to want to do is is since we’re going to want to make this whole paragraph, a link, we want to make sure that we’re closing that tag. So we’re going to come here and do a left pointing arrow forward slash a right pointing arrow. Alright. And now if we come down here, this whole paragraph is linkable. We don’t have a URL yet, but a the code compiler is reading this as a link right? That’s why the color has changed. And we have a underline right here, right? Now, if you click it, nothing happens. It just changes colors. That’s because we haven’t used a we haven’t used a URL yet. So let’s just use the let’s just use nfl.com. 

So now, nothing’s changed. But if we come here and click on this, we go to nfl.com. Right? So what happens if we don’t want to? We don’t want to link the whole paragraph, right? Because a lot of times that doesn’t really make sense. So let me just cut this so I just use CTRL COPY or Ctrl X or Command X, if you’re a Mac or PC, and I’m just gonna paste this back in so we can see our tax. 

But let’s just say let’s for the sake of this argument, let’s just make this paragraph a little bit longer. And now if we look down here, you know, you don’t want more times than not, you don’t want a full paragraph to be linkable. Because if you’re thinking about someone on mobile, they might accidentally tap the paragraph while they’re scrolling to read more and it might just frustrate them. So maybe you just want to say maybe this is a paragraph of sin. If you you know, if you want to talk to us fill out this form. You know, maybe that’s the last times. So what we’re gonna do is we’re gonna come up here and we’re going to cut out the first tag and we’re going to put this in front of the last sentence. 

Right, so now if we come down here and look, only the last sentence is actually clickable. But I want to make sure that you guys know that this ending tag even though it’s in front of the P is still works fine, but just know that maybe you don’t want the word paragraph to be linkable. So let’s cut out this end a tag and let’s put it in front of sentence. 

So we come down here and now only this is a sentence is clickable and linkable. So this can be used to cover whole sections, images, pictures, paragraphs, really any elements that you use in HTML can be linkable and we use the H tag to do so. 

I think this was going to be a huge part in how you set up your WordPress website later. Because you might want to be able to make in reference things, different things on your page. And knowing and understanding how this works will be pretty monumental when we get into later stages. So with that being said, we’re on to the next section.

PHP Code Snippets Powered By : XYZScripts.com