How To Add An Anchor Link Offset In Divi For Fixed Headers

แชร์
ฝัง
  • เผยแพร่เมื่อ 29 ก.ย. 2024
  • When you are using a fixed Theme Builder header on your Divi website alongside anchor links, you might have noticed a common issue: clicking on an anchor link causes the page to scroll to the desired section, but the fixed header overlaps the content at the top. This happens because the anchor link does not account for the height of the fixed header. This is not a good user experience, so in this tutorial, I will show you how to incorporate an offset distance for anchor links in Divi to prevent content from being hidden by the fixed header in the Divi Theme Builder.
    👉 Blog Post: www.peeayecrea...
    🔗 DIVI ASSISTANT: www.peeayecrea...
    What Is Divi Assistant? A huge collection of incredibly handy features and tools to make your life easier when working on your Divi website - startup actions, general utilities, interface hacks, custom settings, global styles, learning resources, maintenance tools, code editors, accessibility improvements, alt text fixes, media hacks, local fonts, system report sharing, import/export tools, and so much more!
    **Try an instant admin demo (link in product page) to explore the features for yourself! **
    Become a member of our Divi Adventure Club!
    www.peeayecrea...
    Join The Divi Teacher Facebook group: / thediviteacher
    Visit our Divi child themes, plugins, tutorials, and courses here: www.peeayecrea...
    Thanks for watching!

ความคิดเห็น • 10

  • @shawnsmith7375
    @shawnsmith7375 2 หลายเดือนก่อน +1

    Hey, Nelson, THANK YOU. I've encountered this problem before and I have my own work-arounds, but this is a better solution. I appreciate you sharing it with us, and giving us the code solution rather than just pointing to the plugin. I have the plugin and I'm glad for all your plugins, but I also have a client who INSISTS on NO PLUGINS, so thanks for taking the time to show the non-plugin solution. WELL DONE - as always. BTW,
    @buckinghamandchester is correct - your thumbnail seems to be the wrong one.

  • @buckinghamandchester
    @buckinghamandchester 2 หลายเดือนก่อน +2

    Wrong thumbnail?

    • @PeeAyeCreative
      @PeeAyeCreative  2 หลายเดือนก่อน

      Yes, thanks, I uploaded 3 tutorials at once on my end, not a good idea 😫

  • @teluobir
    @teluobir หลายเดือนก่อน

    Thanks but it just does not work. When using the code, it only works on some links but not all… for some reason I haven't been able to figure out. It just blocks some of the anchors from working (links internal to the page just don't return any action, doesn't scroll to anywhere).

  • @lele-tz1uz
    @lele-tz1uz 2 หลายเดือนก่อน +1

    videos always much appreciated, the only problem is that in your blog neither the video play nor the dropdown to open the jquery code works for me

    • @PeeAyeCreative
      @PeeAyeCreative  2 หลายเดือนก่อน

      Thanks, this is some issue with Termageddon cookie consent tool, they should have r fixed now.

  • @TheAbulletAway
    @TheAbulletAway 2 หลายเดือนก่อน +1

    This is very helpful, thanks for the video. :)

  • @5xbusiness
    @5xbusiness 2 หลายเดือนก่อน +1

    Great solution

    • @PeeAyeCreative
      @PeeAyeCreative  2 หลายเดือนก่อน

      I'm glad you like it 👍