header overlaps anker link section

Hi Tommy,

Thank you for reaching out and providing detailed information about the issue.

As we can see, you are using some extra plugin or custom JS script which adds this functionality to the links with #. There is no such smooth effect by default in the WoodMart theme. Could you please clarify if you have added any custom code or plugins to achieve this effect? If you’re unsure, please disable all plugins that are not related to our theme.

Additionally, could you provide us with temporary admin access to your site? This will allow us to check the settings and code directly and find a suitable solution to prevent the header from overlapping the content when using anchor links.

Best regards

Try to add the following PHP code snippet to the child theme functions.php file to fix this

if ( ! function_exists( 'woodmart_enqueue_custom_scripts' ) ) {
	/**
	 * Add a script that calculates the height of the Sticked Header and subtracts it from the "scrollTop" value in the Elementor widget "Menu_anchor".
	 */
	function woodmart_enqueue_custom_scripts() {
		ob_start();
		?>
		jQuery(document).ready(function() {
			if (window.elementorFrontend) {
			elementorFrontend.hooks.addFilter( 'frontend/handlers/menu_anchor/scroll_top_distance', function(scrollTop) {
				var stickyElementsHeight = 0;
				var stickyRows           = jQuery('.whb-sticky-row');
				
				if (0 === stickyRows.length || ! stickyRows.parents('.whb-header').hasClass('whb-sticked')) {
					return scrollTop;
				}

				stickyRows.each(function() {
					stickyElementsHeight += jQuery(this).height();
				});

				return scrollTop - stickyElementsHeight;
			});
		}
		});
		<?php
		$script = ob_get_clean();

		wp_add_inline_script( 'woodmart-theme', $script );
	}
	add_action( 'wp_enqueue_scripts', 'woodmart_enqueue_custom_scripts', 40 );
}

Hello,

The problem is that this feature comes from Elementor and any other theme that has sticky header will have exactly the same issue. Note that if you use our theme’s anchor links in the navigation it works correctly. Check on our demo for example https://woodmart.xtemos.com/demo-event-agency/demo/event-agency/

Currently, it is available for the menu made via Appearance -> Menus. https://gyazo.com/f31881638f757beb1ded4dd4ad72f04f
We will consider adding this to other links as well. But as for now, you can continue using Elementor and our fix in the child theme.