By Experiencing issues with Elementor anchor links not working on mobile devices? You’re not alone. In this 2025 guide, we’ll explore common causes and provide step-by-step solutions to ensure smooth navigation for your mobile users. No worries, you are at the right place with a viable solution.
So, anchor links are one of the easiest ways to move to another website section. Just like the table of contents in your article through which a user can easily navigate to any area of the article but with ease. That’s why they are essential, and when it comes to creating anchor tags or links, Elementor is the most flexible and reliable choice than any other WordPress plugin.
In Simple words anchor links, also known as jump links, allow users to navigate to specific sections within a page. In Elementor, this is typically achieved using the Menu Anchor widget, which assigns a unique ID to a section
Let’s dive deeper and find out how you can fix if your elementor anchor links are not working.
Common Causes of Anchor Link Issues on Mobile:
Before we dig into the solution, you should know why elementor anchor links are not working on mobile. This will also help you to analyze the problem better and then fix it accordingly. One prevalent issue arises when using fixed headers. On mobile devices, the fixed header can obscure the anchored section, making it seem like the link isn’t working. Adjusting the scroll offset can resolve this.
So, here are some of the common issues for which your anchor links may not be working on mobile.
Theme Compatibility:
So, another reason the Elementor link may not work correctly is theme compatibility with elementor. This issue usually occurs when your current theme doesn’t align with the Elementor version.
Solution: you may need to move towards a better compatible theme to resolve this issue. In this regard, you can get help from the developer or designer.
Javascript Errors:
JavaScript issues are among the most common reasons anchor links are not working on mobile. For example, some mobile versions don’t support JavaScript or have some restrictions on some devices. In that case, it’s evident if your elementor anchor links are not working on that specific mobile.
Solution: move to another mobile and check if it gets resolved. Otherwise, you need to configure the custom codes to resolve this issue.
To adjust the scroll offset in Elementor, you can add the following JavaScript code to your site
jQuery(document).ready(function($){
$('.elementor-nav-menu a').click(function(e){
e.preventDefault();
var target = $(this).attr('href');
$('html, body').animate({
scrollTop: $(target).offset().top - 100 // Adjust offset as needed
}, 600);
});
});
This script ensures that the anchored section is not hidden behind the fixed header.”
Caching Problems:
Caching is the advanced mechanism used to enhance website performance. That’s why another reason could be the caching problem under which anchor links can fail to work on mobile devices.
Solution: to resolve this issue, all you need is to clear the cache to ensure that the latest version of the website works correctly.
Elementor Settings:
Elementor has many setting options, and the problem might be related to it.
Solution: Double-check and ensure that the “scroll to anchor” feature is enabled.
Page Loading Speed:
Can page loading speed also affect the anchor links? Well, it’s true if your site takes too long to load, it will not only affect user experience but will also be the cause for which elementor anchor links may not work accurately.
Solution: various factors affect the site speed—for example, a slow server, excessive HTTP requests, larger files or images. You can use WP-Optimize or WP Rocket to fix and optimize your site speed.
Scroll Behavior Settings:
CSS or Javascript usually controls a website’s scrolling behavior settings or effects. Poorly customized scroll behavior will lead to not working anchor links as expected.
Solution: Check and test the custom codes on different mobiles or devices to ensure proper working.
Conflict Between Theme or Plugin:
However, WordPress themes or plugins are the most beneficial. What if they get conflicts with each other? That can be frustrating. That’s why using fewer and much-needed plugins is always recommended. However, if your elementor anchor links are not working, the conflict might be between any WordPress theme or plugin.
Solution: To resolve this issue, you need to deactivate all the plugins and check if the issue gets resolved. Later, add one by one to find the culprit.
Limited Targets:
Another common cause is the limited targets. For example, if your target page doesn’t exist or is having trouble loading, it will limit your scroll link to work.
Solution: To fix this error, create target links and set them in the theme.
How to Fix If Elemtor Anchor Links Are Not Working?
To fix the anchor links, you first need to know the cause, as the solution lies in the problem. If you have successfully figured out the cause, then it’s super easy to fix. However, we have also stated some of the most common reasons with solutions under which your Elementor anchor links may not work on mobile.
Give each one a try and fix the issue.
Best Practices for Anchor Links in 2025:
With the increasing variety of devices and screen sizes, it’s crucial to test anchor links across multiple platforms. Utilize responsive website design principles and consider using plugins that are regularly updated to maintain compatibility
- Always test anchor links on real mobile devices, not just simulators.
- Use simple, clean IDs (e.g.,
#about-usinstead of#AboutUs!@#). - Avoid duplicate IDs on the same page.
- Keep menus clean with clear links (use full URL when in doubt).
- Use updated Elementor versions and regularly audit site performance.
Why This Issue Matters in 2025
Mobile users make up over 65% of web traffic in 2025. If your anchor links don’t work properly, users may leave your site frustrated — leading to higher bounce rates and lower SEO rankings.
📉 Fact: A recent study from Backlinko shows that mobile UX issues can reduce organic traffic by up to 20% over time.
Use Full URL in Menu Links
Sometimes, anchor links like #contact work fine on desktop but not on mobile because of how menus render.
👉 Fix: Use the full URL with the anchor:
https://yourdomain.com/page-name/#anchor-idSet Scroll Padding in CSS
On mobile, a fixed header might cover the anchor section. You can solve this with simple CSS.
📌 Add this CSS in your theme or Elementor Customizer:
html {
scroll-padding-top: 100px; /* Adjust as per header size */
}Still Not Working? Try These Advanced Fixes
If none of the above methods work, try these:
- Deactivate all plugins temporarily – A conflict could be breaking anchor link behavior.
- Switch to a default theme like Twenty Twenty-Four – If it works, the issue may be with your theme.
- Check browser console for errors – You may find JavaScript conflicts affecting smooth scrolling.
Conclusion:
By understanding the common causes of anchor link issues in Elementor and implementing the solutions provided, you can enhance the mobile navigation experience for your users. Remember to test changes thoroughly and stay updated with the latest best practices
If you still face issues or want a professional Elementor setup — contact us here or explore our Elementor troubleshooting guides.
Do Subscribe the Newsletter and Push Notification Because we'll share premium knowledge about web here for free.
