Anchor link issue (WordPress adds website address before #)

Resolved elody
(@elody)

12 years, 10 months ago

Hello,
My problem is in the title … although my anchor link is coded correctly in my page (html view) like this :
<a href="#anchor-link">link to my anchor in the same page bellow</a>

The code interpreted by wordpress afterwards in FF, IE and so on is of this kind :
<a href="http://www.mywebsite-address.com/#anchor-link">link to my anchor in the same page bellow</a>

Having something in front of #anchor-link prevents a jquery code to grab the name of the anchor that makes a smooth scrolling down to the id … instead of it I get back to the the top of the page.

Is there a way to add a filter or do something with wordpress so that it doesn’t edit the structure of my anchor links, or I have to change my jquery code (and yes I desactivated the plugins in case of conflicts) …
BTW it’s working fine on my local site with easyPhp, no website address added, and it’s a copy of the live one !

Please help me, it’s getting really bizaaaaaaar !

Viewing 12 replies - 1 through 12 (of 12 total)

esmi
(@esmi)

12 years, 10 months ago

Use <a href="http://full_link_to_page/#anchor-link">link to my anchor in the same page below</a>
Thread Starter elody
(@elody)

12 years, 10 months ago
Thx to help esmi but I tried your tip and it doens’t work (use of a \ instead of a / before the # right ?) … I really need the code to be interpreted by WordPress this way :
```
<a href="#anchor-link">link to my anchor in the same page bellow</a>
```
and not this way :
<a href="http://www.mywebsite-address.com/#anchor-link">link to my anchor in the same page bellow</a>

Any other suggestion ? Maybe a filter before the content could help ?
Thx for ur time …
ixwa
(@ixwa)

12 years, 10 months ago

Yes I don’t get this either. I love WP but who on earth came up with the idea of having a simple href=”#” (standard markup for A LOT of js/jquery links) parsed and preceded with the website address? Come again?

This was never the intention of HTML page anchors.

So presumably there’s yet ANOTHER WP workaround/hack that undoes what shouldn’t have been done in the first place.

Thread Starter elody
(@elody)

12 years, 10 months ago

Oh I finally found the origin of the problem and a simple trick to fix this annoying link issue … It’s not WP who adds the complete site address but the plugin called Google Analytics for WordPress (not installed in my local website).
I just added a space before the # of my link to the anchor so that the plugin doesn’t rewrite the link, but still function with my jquery, so I’m very happy 🙂

I wrote the code with the space like this :
<a href=" #anchor-link">link to my anchor in the same page bellow with a space before the #</a>

ixwa
(@ixwa)

12 years, 9 months ago

I tried this but it exhibits the same behavior. Hmm.

I am using google analytics but just the standard one (didn’t know they had a WP “flavor”).

magicbryan
(@magicbryan)

12 years, 9 months ago

I don’t have any plugins installed yet and wp is interpreting my anchor tags:
<a href=#services>Services</a>
as
http://domain.com/#services

I tried the space trick elody mentioned but no luck. The strange part is that it was working correctly at first then started doing this. It is causing my jQuery to not work. Any ideas on how to disable this?

ver wp 3.2.1

ixwa
(@ixwa)

12 years, 9 months ago

The solution, in case anyone was tearing their hair out on this one:

<a href="<?php the_permalink(); ?>#top">Top</a>

So even for posts that might be a custom post type with a query string (like /?p=1234) the above still works.

More and more I see problems with just how much the WP engine does parsing/filtering on the backend, forcing us to use strict workarounds just to get basic HTML elements to function. Hmm.

Adam Wood
(@adamwood)

12 years, 8 months ago

elody’s solution worked for me for links within a post/page. I’m also using a jquery page scroller

jeffreyfreeman.com
(@jeffreyfreemancom)

12 years, 6 months ago

What’s the deal? this seems totally unnecessary, re-writing every stinking URL for no apparent reason–it just merely creates h*ll for this kind of anchor linking stuff.

I’m suffering from the same problem and about ready to dig into the core of WP 3.2.1 and find the URL re-write and rip it’s guts out and stamp on it all over the floor…

zedagent
(@zedagent)

12 years, 4 months ago

I don’t think this should be marked as resolved; I can’t find a way to stop WordPress from doing this. And adding a space before the #, while it does prevent the rest of the URL from being added, is not an option because it too breaks the jQuery I’m trying to appease.

jbeaul
(@jbeaul)

12 years, 3 months ago

I too was struggling with the URL concatination problem. Then I saw this alternate method which is working fine for me.

<a href="#myanchor">Jump to anchor</a>
.
.
.
<h3 id="myanchor">Headline</h3>

I used an H tag in the example but any element that can accept an ID will work.

Don’t ask me why. I just know it works for me.

Cheers!

Joe Beaulaurier
vusisindane
(@vusisindane)

12 years, 1 month ago
This is how I fixed mine. Sort of a combination of some of the solutions here. 1. I added a space before my # like 1 of the users suggested here, but my jquery was still not firing. So I wrote a simple jquery script that trims my hrefs and replaces the original with the new trimmed…
```
/*hack for the google analytics for wp*/
var ref = jQuery.trim(jQuery('a.gahack').attr('href'));
jQuery('a.gahack').attr('href', ref);
```
In the example above I just focused on 1 link (selector).

I hope this helps