Sign in

Anchor links

  • This topic has 2 replies, 2 voices, and was last updated 5 months, 3 weeks ago by .
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #5942
    HugoMmn

    Hello,

    I followed te documentation, and did a research on the forum, but I can’t make anchor links work. I’m using the WYSIWYG editor.
    I would like to make a link that would take you further down the page, to a heading, without creating a table of content.

    I found a way to do it by creating a table of content, going to the HTML code and deleting everything from the table except the “div class” and the header I want to link to.

    Isn’t there an easier way to achieve it ?

    Thank you.

    #5949
    itips3727

    There may be other ways to do this, but below is what I tend to do.

    Done using the WYSIWYG editor, so choose the <>HTML button (Source code).

    First, go further down the page, where you want to jump to. Create a bookmark with the id attribute. For example:

    <h2 id="C4">Section 4</h2>

    Next, go back up the page and add a link to the bookmark (“Jump to Chapter 4”), from within the same page:

    Jump to Section 4

    Save your changes and test using Preview.

    #5953
    HugoMmn

    There may be other ways to do this, but below is what I tend to do.

    Done using the WYSIWYG editor, so choose the <>HTML button (Source code).

    First, go further down the page, where you want to jump to. Create a bookmark with the id attribute. For example:

    <span class=”enlighter-g1″><</span><span class=”enlighter-text”>h2 id=</span><span class=”enlighter-s0″>”C4″</span><span class=”enlighter-g1″>></span><span class=”enlighter-text”>Section </span><span class=”enlighter-n1″>4</span><span class=”enlighter-g1″><</span><span class=”enlighter-text”>/h2</span><span class=”enlighter-g1″>></span>
    <h2 id=”C4″>Section 4</h2>

    <h2 id=”C4″>Section 4</h2> Next, go back up the page and add a link to the bookmark (“Jump to Chapter 4”), from within the same page:

    <span class=”enlighter-g1″><</span><span class=”enlighter-text”>a href=</span><span class=”enlighter-s0″>”#C4″</span><span class=”enlighter-text”> rel=</span><span class=”enlighter-s0″>”nofollow”</span><span class=”enlighter-g1″>></span><span class=”enlighter-text”>Jump to Section </span><span class=”enlighter-n1″>4</span><span class=”enlighter-g1″><</span><span class=”enlighter-text”>/a</span><span class=”enlighter-g1″>></span>

    Jump to Section 4 Save your changes and test using Preview.

    Hey !

    Thank you it is working and it’s easier to do indeed 🙂

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.