Creating an anchor link - Post ID 266821

User 2796380 Photo


Registered User
94 posts

Creating an anchor link

An anchor link, is the easiest link to create. These are added by linking to an ID that is applied to any element found in your project. When the link is clicked, it will take the user to the specific location of where the ID is located on the page. To accompish this enter the #id-name in the Href input.

You can also link to anchors located on another page by using the HTML file name and then append that with #id-name. An example would be about-us.html#staff.


Not that easy for me to understand.............. If you have say 3 pieces of text at top of page make these 3 text links then on the page where the paragraph is located put a 1px x 1px clear picture and use that with the #ID-name in the Href input?
If this is correct I highlited the TEXT I want to use but how do you make it a link?
Larry Penny
User 103173 Photo


VP of Software Development
0 posts

Whatever you put in the ID box for that element, this will be your anchor name. Just use the HTML page name and append a # with your ID when you create a link.

If you are highliting words inside an element, click the Link + icon at the top and in the URL, enter the anchor name there.

Examples and full instructions are outlined here:
http://www.coffeecup.com/help/articles/ … nchor-link
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 2796380 Photo


Registered User
94 posts

I must be really dense. How do you do this if you have more than one anchor link on a page? I understand the link + icon how do you identify the anchor spot?
Larry Penny
User 103173 Photo


VP of Software Development
0 posts

Larry Penny wrote:
I must be really dense. How do you do this if you have more than one anchor link on a page?

The number of links on a page makes no difference. The same process always applies.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 2796380 Photo


Registered User
94 posts

I am assuming I don't need to include the page name unless it is a different page where the qnchor link is located.
Larry Penny
User 103173 Photo


VP of Software Development
0 posts

Larry Penny wrote:
I am assuming I don't need to include the page name unless it is a different page where the qnchor link is located.

Correct.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 2796380 Photo


Registered User
94 posts

Still having problems with anchor.
At the top of a page name erl-2 have "What are bones and joints?"
Way down the same page I have the "What are bones and joints? as the title of the article.

When I click on edit and highlight the "What are bones and joints?" at top of page then click on the Link+ box opens with Set = What are bones and joints?
Title =
URL=
What do I put in these boxes?
Then what do I do next down the page where the article "What are bones and joints?"
Is there a demo somewhere showing me exactly what to do?
Larry Penny
User 103173 Photo


VP of Software Development
0 posts

Title can be anything you like. Use "What are bones and joints". The URL is ID you want to set the anchor to. Just enter #ID or if it is another page, page.html#ID
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 2796380 Photo


Registered User
94 posts

I think I understand what to do at top of page. I don't understand how you identify where you want to go to way down the page. Which I assume is the "anchor" point. So step by step how do I do this.
Larry Penny
User 2484360 Photo


Registered User
3,293 posts

Larry Penny wrote:
I think I understand what to do at top of page. I don't understand how you identify where you want to go to way down the page. Which I assume is the "anchor" point. So step by step how do I do this.


Do this. Add a Text Link element at the top of the page, then at the bottom of the page, add a Heading 1 element. For the text link, enter the this #main-heading into the HERF input, then select the Heading 1 element and on it's Design pane enter main-heading into the ID input. Then preview the page and click the link.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.