Alert: 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.
the_block_template_skip_link() WordPress Function
The the_block_template_skip_link() function is used to output a link to the content of a block when using the Block Editor. This function is useful for when you want to skip over a block that is not important, or when you want to quickly jump to the content of a block.
the_block_template_skip_link() #
Prints the skip-link script & styles.
Source
File: wp-includes/theme-templates.php
function the_block_template_skip_link() { global $_wp_current_template_content; // 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; } ?> <?php /** * Print the skip-link styles. */ ?> <style id="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; } </style> <?php /** * Print the skip-link script. */ ?> <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 esc_html_e( 'Skip to content' ); ?>'; // Inject the skip link. sibling.parentElement.insertBefore( skipLink, sibling ); }() ); </script> <?php }
Expand full source codeCollapse full source codeView on TracView on GitHub
Changelog
Version | Description |
---|---|
5.8.0 | Introduced. |