fixing an issue with anchors in divi - kary4/divituts GitHub Wiki

Try to implement the following temporary fix:

Open up function.php file and right after

add_action( 'wp_head', 'et_add_viewport_meta' );

add


function et_maybe_add_scroll_to_anchor_fix() {
	$option_name   = 'divi_scroll_to_anchor_fix';
	$theme_options = get_option( 'et_divi' );
	$add_scroll_to_anchor_fix = isset ( $theme_options[ $option_name ] ) ? $theme_options[ $option_name ] : false;
	if ( 'on' === $add_scroll_to_anchor_fix ) {
		echo '<script>
				document.addEventListener( "DOMContentLoaded", function( event ) {
					window.et_location_hash = window.location.hash;
					if ( "" !== window.et_location_hash ) {
						// Prevent jump to anchor - Firefox
						window.scrollTo( 0, 0 );
						var et_anchor_element = document.getElementById( window.et_location_hash.substring( 1 ) );
						window.et_location_hash_style = et_anchor_element.style.display;
						// Prevent jump to anchor - Other Browsers
						et_anchor_element.style.display = "none";
					}
				} );
		</script>';
	}
}
add_action( 'wp_head', 'et_maybe_add_scroll_to_anchor_fix', 9 );

Next open up js/custom.js file and right before

et_fix_page_container_position();

add this code

function et_page_load_scroll_to_anchor() {
			var $map_container = $( window.et_location_hash + ' .et_pb_map_container' ),
				$map = $map_container.children( '.et_pb_map' ),
				$target = $( window.et_location_hash );

			// Make the target element visible again
			$target.css( 'display', window.et_location_hash_style );

			var distance = ( 'undefined' !== typeof( $target.offset().top ) ) ? $target.offset().top : 0,
				speed = ( distance > 4000 ) ? 1600 : 800;

			if ( $map_container.length ) {
				google.maps.event.trigger( $map[0], 'resize' );
			}

			// Allow the header sizing functions enough time to finish before scrolling the page
			setTimeout(function() {
				et_pb_smooth_scroll( $target, false, speed, 'swing');

				// During the page scroll animation the header's height might change.
				// Do the scroll animation again to ensure its accuracy.
				setTimeout(function() {
					et_pb_smooth_scroll( $target, false, 150, 'linear' );
				}, speed + 25 );

			}, 700 );
		}

Then in the same file right after

et_fix_page_container_position();

add

if ( window.hasOwnProperty( 'et_location_hash' ) && '' !== window.et_location_hash ) {
				// Handle the page scroll that we prevented earlier in the <head>
				et_page_load_scroll_to_anchor();
			}

And finally open up options_divi.php file and right after

"desc" => esc_html__("In some cases users will want to create parent categories or links as placeholders to hold a list of child links or categories. In this case it is not desirable to have the parent links lead anywhere, but instead merely serve an organizational function. Enabling this options will remove the links from all parent pages/categories so that they don't lead anywhere when clicked.",$themename)
),

add

array( "name" => esc_html__("Alternative scroll-to-anchor method", $themename),
				"id" => $shortname."_scroll_to_anchor_fix",
				"type" => "checkbox2",
				"std" => "false",
				"desc" => esc_html__("Sometimes when using the CSS ID of a section to link directly to it from another page, the page's final scroll position can be inaccurate. Enable this option to use an alternative method for scrolling to anchors which can be more accurate than the default method in some cases.", $themename)
			),

So, no you can go to the wp admin>divi>theme options>navigation>general settings and enable the Alternative scroll-to-anchor method option.

⚠️ **GitHub.com Fallback** ⚠️