Button Shortcode
Adds a [button] shortcode that turns a link into a styled button using your theme's button styles, for calls to action inside classic content and widgets.
Opens WPIDE on
Code
add_shortcode( 'button', function ( $atts ) {
$atts = shortcode_atts( array(
'url' => '',
'text' => 'Learn more',
'new_tab' => 'no',
'class' => '',
), $atts, 'button' );
if ( '' === $atts['url'] ) {
return '';
}
$target = 'yes' === $atts['new_tab'] ? ' target="_blank" rel="noopener noreferrer"' : '';
$class = trim( 'wp-element-button button wpide-button ' . implode( ' ', array_map( 'sanitize_html_class', explode( ' ', $atts['class'] ) ) ) );
return '<a class="' . esc_attr( $class ) . '" href="' . esc_url( $atts['url'] ) . '"' . $target . '>' . esc_html( $atts['text'] ) . '</a>';
} );
Notes
Example: [button url="/contact/" text="Get in touch" new_tab="no"].
How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.