Do you want to have these stylish bootstrap buttons on your wordpress site?
Try this shortcode.
The Code
Add the following code to your functions.php:
/**************************************************************************************
* Shortcode function for creating bootsrap buttons.
*
* @param type either one of "default", "primary", ""secondary" "info", "success",
* "warning" or "danger"
* @param label the button text
* @param href the link the button opens when clicked
* @param newwindow true/false if the link should be opened in a new tab/window
* @param classes additional css classes
* @param style additional style definitions
*************************************************************************************/
function my_button($atts, $content) {
$attributes = shortcode_atts( array(
'type' => 'primary',
'label' => 'Set Label',
'href' => '#/',
'newwindow' => 'true',
'classes' => '',
'style' => ''
), $atts );
//---------------------------------
// Resolve Target
$target = '';
if($attributes['newwindow'] == 'true'){
$target = 'target="_blank"';
}
//---------------------------------
// Create Button
$result = '<a role="button" style="' . $attributes['style'] . '" '
. 'class="btn btn-' . $attributes['type'] . ' ' . $attributes['classes']
. '" href="' . $attributes['href'] . '" '.
$target
.'>' .
$attributes['label']
. '</a>' . "\n";
return $result;
}
add_shortcode( 'button', 'my_button' );
Shortcode Usage
Here some examples of how you can use the shortcode:
[[button label="Button to Homepage" href="https://www.xresch.com"]]
[[button label='<i class="fa fa-user"></i> Friends and Partners with Icon' href="http://www.xresch.com/page-info/friends-and-partners/" type="info"]]
[[button label="Sitemap open in same Tab" href="http://www.xresch.com/more/find/sitemap/" newwindow="false" type="success"]]
[[button label=">>> Custom Style Button <<<" href="#/" classes="btn-lg" style="display: block;" type="danger" newwindow="false" ]]
Examples
The above usage examples will be rendered like this:
Button to Homepage
Friends and Partners with Icon
Sitemap open in same Tab
>>> Custom Style Button <<<