I have created anchors and links to them in the same article, using the Bookmark editing feature, but they don’t work. What do I need to do to fix this? Thanks in advance for your help.
Do you have a published page or a shareable snippet that we could examine? We use EditLive to create and to link to anchors with no problem.
We’re using Ephox/EditLive also.
Here’s a sample of the code:
<ul>
<li><a href="#accelerating">Accelerating the Development and Testing of New Payment and Service Delivery Models</a></li>
.
.
.
</ul>
<h3 name=“accelerating”>Accelerating the Development and Testing of New Payment and Service Delivery Models</h3>
In the display version of the page, when you click on the link, it doesn’t go anywhere. I think you’re going to have to view the page source to see the actual code, because it’s rendering when this reply posts to your forum.
Thanks again for your help.
@rmsgross1: I’ve copied your snippet over to http://jsbin.com/welcome/34959/ since the forums can be cruel with HTML code. Your code shows that the h3 element is using the “name” attribute. The “name” attribute will specify an anchor on a elements; however, other elements will need to use the “id” attribute according to http://www.w3.org/TR/html401/struct/links.html#h-12.2.3 and http://www.w3.org/TR/html5/history.html#scroll-to-fragid . If EditLive is appending the wrong attribute to h3 then this may be a bug worth reporting to Tech Support.
No, LiveEdit is correctly inserting the “id” parameter; I changed them to “name” because I thought that “id” was wrong. I have now changed them back to “id” – NG. The links still go nowhere.
Hmm, can you provide an updated HTML snippet?
First of all, I need to know something. Of the below examples, which is the correct way to specify the anchor definition?
<h3><a name=“heading”>Heading</a></h3>
<h3><a name=“heading”></a>Heading</h3>
<a name=“heading”><h3>Heading</h3></a>
<a name=“heading”></a><h3>Heading</h3>
<h3 id=“heading”>Heading</h3>
Second, whenever I specify only the “name” parameter, even on the “a” tag, Percussion automatically adds the “id” parameter, which I think is what’s screwing me up. So it would end up looking like <a name=“heading” id=“heading”>, where I have coded the “name” parameter and Percussion coded the “id” parameter. That seems to be an incorrect thing that Percussion is doing.
All variations should work – it would come down to the desired appearance.
One question that may be silly is whether the page height is not large enough to constitute scrolling.
If you can paste the entire source for a page to gist.github.com or jsbin.com then we can examine the behavior together because all of your examples should work.
Testing the gist you have provided it works in my browser without a problem.
You say that when you click on an anchor link it doesn’t go anywhere. Do you see the fragment identifier in the address bar? Have you tried publishing the page to see if the published version works?
It’s the published (and every other) version that doesn’t work.
The address bar doesn’t change. The fragment identifier at the bottom of the page does change, from index.html#tag1 to index.html#tag2, etc. Is that correct?
Yes, hyperlinks linking to a fragment identifier should appear in that form. Upon clicking on these hyperlinks the address bar should change to reflect the destination, but if you’re not seeing such behavior then I am curious whether something else is happening. Do you have a shareable link to the published version?
I can’t click on the hyperlinks; they only appear when I mouse over the links in the text. They disappear when I move the mouse down to the bottom of the page.
The page in question is here:
http://innovations.cgifederal.com/initiatives/index.html
It’s not a browser issue. It’s specifically a Percussion issue. In straight HTML it works fine, as you yourself have seen. It’s Percussion that’s somehow disabling the linking function.
Please look at http://innovations.cgifederal.com/resources/javascript/script.js at the patchJumpLinksTabIndex function.
Line 212 will match all hyperlinks then Line 216 will be true for all your anchors then 217 binds the click event listener which finally returns false on line 234.
This JavaScript is preventing your page from activating anchors.
Isn’t this standard Javascript code that comes with Percussion?
( ⚆ _ ⚆ ) Don’t think so. We didn’t receive any standard JavaScript code in our installation or our Modeling and Design session.
I especially like the following line in that file:
//THIS IS A HACK THAT CAN BE TAKEN OUT ONCE TEMPLATE DRIVEN //CURRENTLY NOT ALL PAGES HAVE BREADCRUMBS //SO.. #MAIN-CONTENT DEFINED in SSI
It may be that when you had your modelling and design session the PSO (/s) may have added this file per your requirements (or something like that). But Riley is correct, this is not part of the “standard” installation (at least not for CM System).
Okay. Thanks for all of your help!