[Resolved] Adding a class to a text link in the page editor?

Home Forums Support [Resolved] Adding a class to a text link in the page editor?

Home Forums Support Adding a class to a text link in the page editor?

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #2080632
    Greg

    Hey GP

    Is there anyway of adding a class to a regular text link in the page editor? I’ve created a block with page contents (for longer form content) and wanted to apply the smooth scroll class to the links – but can’t figure out how to go about it.

    Thanks
    Greg

    #2080644
    Leo
    Staff
    Customer Support

    Hi there,

    Are you referring to the headline block?

    If so this should help:
    https://www.screencast.com/t/DKuuCOuS8VLp

    #2080678
    Greg

    Hi Leo,

    Thanks, but no, not the headline block.

    It’s a block within a grid that I’ve created to make a sidebar-like Contents block.
    Hopefully this screenshot helps to explain better:

    Screenshot

    Thanks
    Greg

    #2080686
    Ying
    Staff
    Customer Support

    Hi Greg,

    The additional CSS classes are added the the entire ul (list block), instead of the individual li.

    I would suggest using GB’s Buttons block instead of the list block.

    #2080693
    Greg

    Hi Ying

    Thanks, so it’s not possible to apply them to the individual li in this instance? Do you know the CSS for the smooth-scroll, so I could apply it to the entire block with custom CSS instead?

    Thanks
    Greg

    #2080706
    Ying
    Staff
    Customer Support

    so it’s not possible to apply them to the individual li in this instance?

    There’s a workaround, you can edit the list block as HTML, then add the smooth-scroll class manually to the link (a):
    https://www.screencast.com/t/5bpyo96ebNpz

    Do you know the CSS for the smooth-scroll, so I could apply it to the entire block with custom CSS instead?

    Smooth scroll is using JS instead of CSS..

    Let me know if this helps 🙂

    #2080726
    Greg

    Thanks for the suggestion Ying, the only issue with that is that my client will be editing these blocks in the future – and they’re not comfortable with editing HTML.

    Do you have any other ideas for a possible workaround?

    Thanks
    Greg

    #2080993
    David
    Staff
    Customer Support

    Hi there,

    simplest solution would be to make all links attract the smooth scroll behaviour. So there is no need to add classes to the link – this doc explains how:

    https://docs.generatepress.com/article/generate_smooth_scroll_elements/

    #2081052
    Greg

    Thanks David, I’ve added the snippet (set to run everywhere), removed my custom CSS classes, cleared the cache, and double checked smooth scroll is ticked in the Customiser > General.

    But, I’m still not seeing the smooth scroll, any idea what I might be missing?

    Thanks!
    Greg

    #2081056
    David
    Staff
    Customer Support

    Try clearing your browser caches as they are working for me.

    #2081087
    Greg

    Thanks David, I had emptied the cache with inspect element + right click on refresh, but clearing it fully has sorted it.

    Thanks for the help everyone 🙂
    Greg

    #2081096
    David
    Staff
    Customer Support
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.