wp_enqueue_block_template_skip_link()

In this article

This function’s access is marked private. This means it is not intended for use by plugin or theme developers, only in other core functions. It is listed here for completeness.

Enqueues the skip-link script & styles.

Source

function wp_enqueue_block_template_skip_link() {
	global $_wp_current_template_content;

	// Back-compat for plugins that disable functionality by unhooking this action.
	if ( ! has_action( 'wp_footer', 'the_block_template_skip_link' ) ) {
		return;
	}
	remove_action( 'wp_footer', 'the_block_template_skip_link' );

	// Early exit if not a block theme.
	if ( ! current_theme_supports( 'block-templates' ) ) {
		return;
	}

	// Early exit if not a block template.
	if ( ! $_wp_current_template_content ) {
		return;
	}

	$skip_link_styles = '
		.skip-link.screen-reader-text {
			border: 0;
			clip: rect(1px,1px,1px,1px);
			clip-path: inset(50%);
			height: 1px;
			margin: -1px;
			overflow: hidden;
			padding: 0;
			position: absolute !important;
			width: 1px;
			word-wrap: normal !important;
		}

		.skip-link.screen-reader-text:focus {
			background-color: #eee;
			clip: auto !important;
			clip-path: none;
			color: #444;
			display: block;
			font-size: 1em;
			height: auto;
			left: 5px;
			line-height: normal;
			padding: 15px 23px 14px;
			text-decoration: none;
			top: 5px;
			width: auto;
			z-index: 100000;
		}';

	$handle = 'wp-block-template-skip-link';

	/**
	 * Print the skip-link styles.
	 */
	wp_register_style( $handle, false );
	wp_add_inline_style( $handle, $skip_link_styles );
	wp_enqueue_style( $handle );

	/**
	 * Enqueue the skip-link script.
	 */
	ob_start();
	?>
	<script>
	( function() {
		var skipLinkTarget = document.querySelector( 'main' ),
			sibling,
			skipLinkTargetID,
			skipLink;

		// Early exit if a skip-link target can't be located.
		if ( ! skipLinkTarget ) {
			return;
		}

		/*
		 * Get the site wrapper.
		 * The skip-link will be injected in the beginning of it.
		 */
		sibling = document.querySelector( '.wp-site-blocks' );

		// Early exit if the root element was not found.
		if ( ! sibling ) {
			return;
		}

		// Get the skip-link target's ID, and generate one if it doesn't exist.
		skipLinkTargetID = skipLinkTarget.id;
		if ( ! skipLinkTargetID ) {
			skipLinkTargetID = 'wp--skip-link--target';
			skipLinkTarget.id = skipLinkTargetID;
		}

		// Create the skip link.
		skipLink = document.createElement( 'a' );
		skipLink.classList.add( 'skip-link', 'screen-reader-text' );
		skipLink.href = '#' + skipLinkTargetID;
		skipLink.innerHTML = '<?php /* translators: Hidden accessibility text. */ esc_html_e( 'Skip to content' ); ?>';

		// Inject the skip link.
		sibling.parentElement.insertBefore( skipLink, sibling );
	}() );
	</script>
	<?php
	$skip_link_script = wp_remove_surrounding_empty_script_tags( ob_get_clean() );
	$script_handle    = 'wp-block-template-skip-link';
	wp_register_script( $script_handle, false, array(), false, array( 'in_footer' => true ) );
	wp_add_inline_script( $script_handle, $skip_link_script );
	wp_enqueue_script( $script_handle );
}

Changelog

VersionDescription
6.4.0Introduced.

User Contributed Notes

You must log in before being able to contribute a note or feedback.