Button Shortcode

Below, you’ll find a detailed guide on how to add the Button Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Button Plugin shortcode not to show or not to work correctly.

Before starting, here is an overview of the Button Plugin and the shortcodes it provides:

Button

"Button is a functional WordPress plugin designed to enhance your site's interactivity. It offers customizable buttons for a more engaging user experience. Use the 'button' slug to activate it."

★★★★☆ (51) Active Installs: 3000+ Tested with: 6.3.2 PHP Version: 5.6

Included Shortcodes:

• [WD_Button]

Button [WD_Button] Shortcode

The WD_Button shortcode is a customizable button generator for WordPress. It fetches button settings from the post meta and applies them to button elements. The button’s background and hover colors, opacity, and layout are all customizable. The button layout can be set to “simple_button”, which uses a predefined layout. Shortcode: [WD_Button]

Shortcode: [WD_Button]

Parameters

Here is a list of all possible WD_Button shortcode parameters and attributes:

• id – It represents the individual IDs of the buttons.
• button_bg_color_start – It sets the initial background color of the button.
• button_bg_color_end – It sets the final background color of the button.
• opacity_start – It sets the initial transparency of the button color.
• opacity_end – It sets the final transparency of the button color.
• button_bg_hover_color_start – It sets the initial hover color of the button.
• button_bg_hover_color_end – It sets the final hover color of the button.
• hover_opacity_start – It sets the initial hover transparency of the button.
• hover_opacity_end – It sets the final hover transparency of the button.
• button_layout – It defines the layout of the button.

Examples and Usage

Basic Example – Showcases a simple usage of the shortcode to display a button with a predefined ID.

[WD_Button id=1 /]

Advanced Examples

Illustrates the usage of the shortcode to display multiple buttons by providing a comma-separated list of IDs. The buttons will load in the order of the IDs provided.

[WD_Button id=1,2,3 /]

Demonstrates how to use the shortcode to display a button by referencing its ID. If the button with the specified ID is not found, the shortcode will try to load the button by its title.

[WD_Button id="1" title="Submit" /]

PHP Function Code

In case you have difficulties debugging what causing issues with [WD_Button] shortcode, check below the related PHP functions code.

Shortcode line:

add_shortcode( 'WD_Button', 'button_shortcode' );

Shortcode PHP function:

                    function button_shortcode( $post ){
	ob_start();

	$post_id 	=	$post['id'];
	$button_ids 	= 	explode( ",", $post_id );

	foreach( $button_ids as $id ){

		if(isset($id)){

			$custom_data = unserialize(get_post_meta($id,'button_custom_setting_'.$id, true));

			$button_bg_color_start 			= button_rgba_color( $custom_data['button_bg_color_start'], $custom_data['opacity_start']);

			$button_bg_color_end 			= button_rgba_color( $custom_data['button_bg_color_end'], $custom_data['opacity_end']);

			$button_bg_hover_color_start 	= button_rgba_color( $custom_data['button_bg_hover_color_start'], $custom_data['hover_opacity_start']);

			$button_bg_hover_color_end 		= button_rgba_color( $custom_data['button_bg_hover_color_end'], $custom_data['hover_opacity_end']);

			if( $custom_data['button_layout'] == "simple_button" ){

				require( BUTTON_PATH.'inc/button-layouts/simple-button/simple-button.php' );

			}			
		}
	}

	return ob_get_clean();
}
                    

Code file location:

button/button/inc/shortcode.php

Conclusion

Now that you’ve learned how to embed the Button Plugin shortcode, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.