[Resolved] How To Use HTML Anchor And Jumps to the Header Including The Title?

Home Forums Support How To Use HTML Anchor And Jumps to the Header Including The Title?

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #1490861
    Peter Paul

    Hi Team,

    Okay, this is a bit difficult for me to describe.
    But I recently posted an article and in the table of the article I used the HTML anchor feature.
    So I added a #NAMEOFHEADING as the anchor link.
    However, I noticed that when I click the link it jumps after the heading block, making the heading title not visible.
    *See the article link on private info.

    How can we not make it jump right past the heading title?
    So that when a visitor clicks on the link on the table, it jumps down to the section and shows that section including the heading or title of that section.

    Thanks!

    #1491102
    Elvin
    Staff
    Customer Support

    Hi,

    How can we not make it jump right past the heading title?
    So that when a visitor clicks on the link on the table, it jumps down to the section and shows that section including the heading or title of that section.

    It doesn’t jump past the heading title on my end as shown here: https://share.getcloudapp.com/L1uQdDZQ

    However, I do see that the heading may be too close to the topside of the viewport when jumping to it.

    To address this, consider adding offset to the jumplink targets.

    In your case, you can try this css:

    
    /* for desktop and tablets */
    @media (min-width:769px){
    .entry-content h3:before {
        content: "";
        display: block;
        height: 90px;
        margin: -90px 0 0;
    }
    }
    /* for mobile */
    @media (max-width:768px){
    .entry-content h3:before {
        content: "";
        display: block;
        height: 45px;
        margin: -45px 0 0;
    }
    }
    

    A wise man once said:
    "Have you cleared your cache?"

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