add link to another block on same page

Permalink 1 user found helpful
How do I create a link to something in another block on the same page?

View Replies: View Best Answer
jordanlev replied on at Permalink Best Answer Reply
It's not very straightforward, but here's the process.

1) Create the "anchor" (the spot in the page you want to scroll to when the link is clicked) by adding an HTML block and pasting this code in it:
<a name="my-link-name" />

You will probably want to move that so it's directly above the block that you want to scroll to when the link is clicked.

2) Create the link to the anchor by adding a content block, typing in the link text, highlighting that text and clicking the little "chain link" icon in the toolbar. In the "Link URL" box, enter a hash symbol (#) followed by the name you used for the anchor -- for example:

Hope that helps!
clorenz replied on at Permalink Reply
OK, so I'm clear on this, since I have very little knowledge of this:

1. Let's say the name of my link will be the word, product.

So, the HTML code will be
<a name="product" />

2. In the link URL box, I insert:

is that right?

thanks very much.
jordanlev replied on at Permalink Reply
You got it!
EIanetti replied on at Permalink Reply
I wanted to try this and found this simple post.

I linked the anchor text "The Story" as follows

Insert this text in an HTML block above the target block:
<a name="the-story" />

Insert this text in the link box: #the-story

The link worked, but unfortunately, it caused all the text in the target block to turn blue and behave as link text.

It did the same to all subsequent blocks as well.

Is there a solution to that?
jordanlev replied on at Permalink Reply
Hmm... try this instead:
<a name="the-story"></a>
EIanetti replied on at Permalink Reply
Perfection. ;-) Thanks
EIanetti replied on at Permalink Reply
This is working well now!
misebaz replied on at Permalink Reply

I am trying this out and it works but it keeps opening in a new tab. Is there any way that I can stay on the same page when a link is clicked?


jordanlev replied on at Permalink Reply
If it's opening in a new tab, it's probably due to some javascript on your page that is modifying links to do that (because there's nothing about the procedure I explained above that would make it open in a new tab on its own). This javascript might be from your theme, or an addon you have... or maybe some script code that was put into the "header extra content" page property or in an HTML block somewhere on the page.
junebird replied on at Permalink Reply
Hi There,

I am really struggeling with my anchor tags.
I'm trying to make a back to top anchor tag (thats hard coded into the code and not added via edit page).
So I have an image as the button and then it links to the anchor at the top of the page.
When I click the button it simply changes the URL to the same page, but with #backtotop at the end of it.
It doesn't move me to the top of the page at all. I saw someone say that there's a cheat because concrete5 can be buggy with anchor tags, so I tried adding the ./ infront of the # as they recommend, but it gives the same result mentioned above.

(could it be an issue due to the fact that the website is still in the conc subfolder?)

This is my code:
<a name="backtotop"></a>

<a href="./#backtotop"><img src="<?=$this->getThemePath()?>/images/back-to-top.jpg" alt="back to top" /></a>
jordanlev replied on at Permalink Reply
Being in a subfolder should not matter, because anchor links are handled entirely client-side in the browser (so once the page is loaded into the browser then the anchor links don't request anything more from the server).

Having <a name="backtotop"></a> and then linking to it via <a href="#backtotop"...</a> should work just fine. If not, there might be some javascript on the page that is altering the link clicks somehow? Or double-check the spelling of everything? If the site is publicly available, can you post a link to that page so we can look at it?

Alternately, you could try doing the anchor as an id on a div instead, like <div id="backtotop"></div> ... and leave the link (<a href="#backtotop">...</a>) the same.

junebird replied on at Permalink Reply
Thanks so much!
Changing it to a div worked perfectly!
sully210 replied on at Permalink Reply
If I want to add a link to an anchor on another page in my site how would I do that? Do I need to add the entire URL to accomplish this?