Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Shortcode: Create Headings with anchor + link icon
<?php // only copy this line if needed!
* Create a shortcode to insert a header with an anchor icon.
* Use [heading size="2" id="anchor"]Heading[/heading]
* Recommended: Add prefix / change shortcode name to avoid conflicts
function br_heading_shortcode( $atts, $content = null ) {
// set default size="2" to default to h2
$a = shortcode_atts( array(
'size' => '2',
'id' => false,
), $atts );
// generate an ID if we don't have one passed in
$anchor = $a['id'] ?: sanitize_title( $content );
// optional: ensure Dashicons is enqueued
wp_enqueue_script( 'dashicons' );
// replace <span class="dashicons dashicons-admin-links"></span> with a different icon if desired
<h<?php echo esc_attr( $a['size'] ); ?> id="<?php echo esc_attr( $anchor ); ?>">
<a href="#<?php echo esc_attr( $anchor ); ?>">
<span class="dashicons dashicons-admin-links"></span>
<?php echo wp_kses_post( $content ); ?>
</h<?php echo esc_attr( $a['size'] ); ?>>
return ob_get_clean();
add_shortcode( 'heading', 'br_heading_shortcode' );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.