WordPress Tutorials

In this tutorial we’ll go over the basic task of creating a ‘clickable’ text in your WordPress blog  post that links to another page or post inside your own site, or to any other page on the web. As a good rule of thumb you can have internal links open in the same tab or window, while having external links open in a new window or tab, thus keeping your page open for a longer period of time and possibly returning to it when closing the newly opened tab.

Pieter Vorster

Create Clickable Text (Inline Hyperlink)


1. Determine the url (website address) for your link. Navigate to the page that you want to link to and copy the url from the address bar at the top of page. The url that you copy should look something like this:

http://www.cutekittens.com

2. Select the section of text that you would like to become a link, then click on the link symbol in the dashboard of your WordPress text editor.

3. The Insert Link dialogue box will pup up where you can enter your link url.

URL  – Paste or type the address for you link. 

Text to display  – The clickable text that will become a link.

Target  – Selecting ‘New Window’ will open the link on a new tab. It’s important to use this setting if you’re linking to another website, this way your reader can easily find their way back to your website by closing the tab.

4. The selected text should now appear blue to indicate that it’s a link. If you click on the blue text your given the options to view the link, edit the link with the Insert Link dialogue box, or remove the link.


 

How to Create a Link Using Source Code

Curious about the code behind the link?

If you’re interested in seeing what you’re link looks like ‘behind the scenes’ click on the ‘Text’ tab in the upper right-hand corner of your text editor, this allows you to view the source code for what you enter into a blog post.

The link that we’ve just created in the tutorial will look like this:

<a href=”http://www.cutekittens.com” target=”_blank”>This is a link.</a>


 

If you’d like to try your hand at creating a link with code follow these steps:

1. Click on the ‘Text’ tab in your WordPress text editor.

2. Create your opening and closing ‘a’ tags:  <a> </a>

3. Specify your url using the ‘href’ attribute. Enter ‘href’ after the opening ‘a’ tag followed by the equals sign and your url in parenthesis:  

<a href=”http://www.somewhere.com”></a>

4. Between the ‘a’ tags enter the text for you link:   

<a href=”http://www.somewhere.com”>CLICK HERE</a>

5. If you want your link to open in a new tab then type target=”_blank” after the url: 

<a href=”http://www.cutekittens.com” target=”_blank”>This is a link.</a>

Pin It on Pinterest

Skip to content