Using Anchors In WordPress

Using Anchors In WordPress

I had struggled for a while with trying to figure out how to use them in WordPress, but when it came down to it, it was merely a case of adding a little HTML. Here’s how to do it:

First of all, create all the text on your page, including where you will be linking from (a list of FAQs) for examples and where you will be linking to (the anchor – a set of answers for example). Bear in mind that you can use anchors to link to another page altogether, so the link does not need to be on the same page as the anchor.

Create the anchor

Once you have created all your text, go to the place that you want to place the anchor. This is most likely some text, but can just as easily be an image or any other part of your WordPress post. Making sure that you are in the HTML editing part of your WYSIWYG editor, put your cursor before the text/image/code. Once there, you will need to “mark” the text, so that the place of the anchor is specified. You should do this by putting the following code ahead of the text/code, changing the word label for any string you choose (this could be descriptive, or simply sequential numbering):

< a>Text and/or code here…< /a>

]]>

Repeat this process for every part of the page that you want anchors, using a different label for each one.

Create the link

Now that your anchor is in place, you are ready to create the link to it. This is done by using the href HTML tag. As such, use can use relative or absolute links accordingly. The href tag syntax is made up like this:

< a rel=”nofollow” onclick=”javascript:_gaq.push([‘_trackPageview’, ‘/outgoing/article_exit_link/3248097’]);” href=”URL you are linking to”>Text that will link to URL< /a>

Therefore, in this case, you will create a link such as this, replacing the appropriate parts so that it suits your application:

< a rel=”nofollow” onclick=”javascript:_gaq.push([‘_trackPageview’, ‘/outgoing/article_exit_link/3248097’]);” href=”http://www.yourdomain.com/faqs/#label”>Text linking to anchor< /a>

If the link and the anchor are on the same page however, you can use a relative URL, which involves deleting everything between the first quotation marks (“) and the hash symbol (#), leaving a much simpler href:

< a rel=”nofollow” onclick=”javascript:_gaq.push([‘_trackPageview’, ‘/outgoing/article_exit_link/3248097’]);” href=”#label”>Text linking to anchor< /a>

Let me know if you have any problems or suggestions, but even more so, let me know if this helped you out.