WP Shortcode

theme-shortcode.php

<?php
/*
Shortcode Documentation
=======================

=> Bootstrap 4 Component
=> Github Documentation 
=> Gist Link: https://goo.gl/vuhT4r

TOC:

1. Alert Type Shortcode
2. Progress Bar Shortcode
3. Button Type Shortcode
4. Card Shortcode
5. Static Google Maps Shortcode
6. List Shortcode (Using explode seperator)
7. Feature Section Shortcode (Integrated with Visual Composer)  
8. Visual Composer Add-on (Integrated with Feature Section)
9. Collapse Shortcode 
*/

?>


<?php
/*
   Plugin Name: Boostrap 4 Shortcode
   Plugin URI: https://www.humayunbd.com/crazy
   description: Create Some Bootstrap 4 Shortcode
   Version: 1.2
   Author: Humayun Ahmed
   Author URI: https://www.humayunbd.com
   License: MIT 
*/



//Alert Type Shortcode

function crazyland_alert_shortcode($atts, $content = null){
	extract(shortcode_atts(
		array(
		  'type' => '',
		   'text' => '',
		),
		$atts 
	));

	return '<div class="alert alert-'.esc_attr($type).'" role="alert">'.$text.'</div>';
}
add_shortcode('alert','crazyland_alert_shortcode');



// Progress Bar Shortcode

function crazyland_progress_shortcode($atts, $content = null){
	extract(shortcode_atts(
		array(
			'percentage' => '',
			'value' => ''
		),
		$atts 
	));

	return '<div class="progress">
		  <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: '. ($percentage) .'%">
			'.$value.' 
		  </div>
		</div>';
}
add_shortcode('progress','crazyland_progress_shortcode');




// Button Shortcode

function crazyland_button_shortcode($atts, $content = null){
	extract(shortcode_atts(
		array(
			'type' => '',
			'class' => '',
			'text' => ''
		),
		$atts 
	));

	return '<button type="'.$type.'" class="btn btn-'.$class.'">'.$text.'</button>';
}
add_shortcode('button','crazyland_button_shortcode');



// Card Shortcode

function crazyland_card_shortcode($atts, $content = null){
	extract(shortcode_atts(
		array(
			'width' => '',
			'title' => '',
			'text'=> '',
			'id' => '',
			'size' => ''
		),
		$atts 
	));

	return '<div class="card" style="width: '.($width).'%;">
	 <img class="card-img-top" src="'.wp_get_attachment_image_url($id, 'thumbnail').'" alt="Card image cap">
	  <div class="card-body">
	    <h5 class="card-title">'.$title.'</h5>
	    <p class="card-text">'.$text.'</p>
	  </div>
	</div>';
}
add_shortcode('card','crazyland_card_shortcode');



// Maps Shortcode

function crazyland_maps_shortcode($atts) {
	$default = array(
		'lat' => '22.9196383',
		'lon' => '91.520781',
		'zoom' => '16',
		'width' => '600',
		'height' => '400',
	);

	$map_data = shortcode_atts( $default, $atts);

	$img = '<img src="http://maps.google.com/maps/api/staticmap?center=%f,%f&zoom=%d&size=%dx%d" />';

	return sprintf($img,$map_data['lat'],$map_data['lon'],$map_data['zoom'],$map_data['width'],$map_data['height']);
}
add_shortcode( 'maps', 'crazyland_maps_shortcode');



// List Shortcode (Using explode seperator)

function crazyland_list_shortcode($atts){

	extract(shortcode_atts(
		array(
			'items' => ''
		),
		$atts
	));

	$items_array = explode(',', $items);

		$my_html = '<ul>';
			foreach ( $items_array as $item) {
				$my_html .= '<li>'.$item.'</li>';
			}

		$my_html .= '</ul>';

		return $my_html;
}
add_shortcode( 'list', 'crazyland_list_shortcode' );




// Feauture Shortcode (Homepage)

function crazyland_feature_shortcode($atts){
	extract(shortcode_atts(
		array(
			'choose_icon' => '<i class="fa fa-home"></i>',
			'icon_type' => '1',
			'upload_icon' => '',
			'title' => '',
			'desc' => ''
		),
		$atts
	));
	$my_html = '
		<div class="crazyland_feuture_item">
			<div class="fauture_icon_wrap">';

			if($icon_type == '2'){
				$img_url = wp_get_attachment_image_url( $upload_icon, 'thumbnail' );
				$my_html .= '<img src="'.$img_url.'"/>';
			}else{
				$my_html .= '<i class="'.$choose_icon.'"></i> ';
			}
		$my_html .= '
		
			</div>
			
			<h5>'.$title.'</h5>
			
			'.wpautop($desc).'
		</div>
	';
	return $my_html;
}
add_shortcode( 'feature', 'crazyland_feature_shortcode' );




// VC Shortcode for (Fetured Area)

function your_name_integrateWithVC() {
   vc_map( array(
      "name" => __( "CrazyLand Fauture", "my-text-domain" ),
      "base" => "feature", // Shortcode Name
      "category" => __( "CrazyLand", "my-text-domain"),
      "params" => array(
      	 array(
            "type" => "dropdown", // Params Type
            "heading" => __( "Select Icon Type", "my-text-domain" ), 
            "param_name" => "icon_type", // Shortcode Key or Attribute
            "value" => array(
            	"Select Icon" => "1", // Value for dependency 
            	"Upload Icon" => "2" // Value for dependency 
            ),
            "description" => __( "Select your icon type, You can set a image as a icon.", "my-text-domain" )
         ),
         array(
            "type" => "iconpicker",
            "heading" => __( "Select Icon", "my-text-domain" ),
            "param_name" => "choose_icon", // Shortcode Key or Attribute
            "value" => __( "fa fa-home", "my-text-domain" ), 
            "description" => __( "Choose feauture icon with some awesome icon pack", "my-text-domain" ),
            "dependency" => array(
            	"element" => "icon_type",  // Params <= (Shortcode Attribute)
            	"value" => array("1") // Select Icon Value (1)
            )
         ),
         array(
            "type" => "attach_image",
            "heading" => __( "Upload image icon", "my-text-domain" ),
            "param_name" => "upload_icon", // Shortcode Key or Attribute
            "description" => __( "You can upload a image as a icon from your local directory", "my-text-domain" ),
            "dependency" => array(
            	"element" => "icon_type",  // Params <= (Shortcode Attribute)
            	"value" => array("2") // Upload Icon Value (2)
            )
         ),
         array(
            "type" => "textfield",
            "heading" => __( "Title", "my-text-domain" ),
            "param_name" => "title", // Shortcode Key or Attribute
            "description" => __( "Type Feature Title", "my-text-domain" )
         ),

         array(
            "type" => "textarea",
            "heading" => __( "Feauture Description", "my-text-domain" ),
            "param_name" => "desc", // Shortcode Key or Attribute
            "description" => __( "Your Feature Description", "my-text-domain" )
         )
      ),

   ) );
}
add_action( 'vc_before_init', 'your_name_integrateWithVC' );




// Collapse Shortcode

function collapse_shortcode($atts, $content = null){
    extract( shortcode_atts( array(
    	'linktext' => 'Link with href',
    	'title' => 'Button with data-target',
    	'content' => 'Anim pariatur cliche reprehenderit',
    ), $atts) );  
	
            $ariaexpanded = '';
            $btnClass = '';

            if ($ariaexpanded = false) {
            	$btnClass = 'collapsed';
            }else{
            	$btnClass = '';
            }

    	$list_items = '<div class="collapse-items">';
		$list_items .= '
		<p>
		  <a class="btn btn-primary '.$btnClass.'" data-toggle="collapse" href="#collapseExample" role="button" aria-expanded="'.$ariaexpanded.'" aria-controls="collapseExample">
		    '.$linktext.'
		  </a>

		  <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="'.$ariaexpanded.'" aria-controls="collapseExample">
		    '.$title.'
		  </button>
		</p>
		<div class="collapse" id="collapseExample"> 
		  <div class="card card-body">
		    '.$content.'
		  </div>
		</div>
		';
    	$list_items.= '</div>';

    return $list_items;
}
add_shortcode('collapse', 'collapse_shortcode');

/*

//======List Item======//
=========================

[list items="Alert Type, Progress Bar, Button , Card , Static Google Maps , Collapse Shortcode"]

//======Progress Bar======//
============================

[progress percentage="10" value="10%"]
[progress percentage="20" value="20%"]
[progress percentage="30" value="30%"]
[progress percentage="40" value="40%"]
[progress percentage="50" value="50%"]
[progress percentage="60" value="60%"]
[progress percentage="70" value="70%"]
[progress percentage="80" value="80%"]
[progress percentage="90" value="90%"]
[progress percentage="100" value="100%"]



//======Alert======//
============================

[alert type="primary" text="Primary"]
[alert type="warning" text="warning"]
[alert type="success" text="success"]
[alert type="info" text="info"]
[alert type="light" text="light"]
[alert type="dark" text="dark"]



//======Button======//
============================

[button type="button" class="primary" text="primary"]

[button type="button" class="secondary" text="secondary"]

[button type="button" class="success" text="success"]

[button type="button" class="danger" text="danger"]

[button type="button" class="warning" text="warning"]

[button type="button" class="info" text="info"]

[button type="button" class="light" text="light"]

[button type="button" class="dark" text="dark"]




//======Card======//
============================

[card width="100%" title="Hello RRF!!" text="Lorem Ipsum is simply dummy text of the industry., " id="43" size="large"]



//======Maps======//
============================

[maps lat="22.9215699" lon="91.5232245"]



//======Collapse======//
============================

[collapse linktext="Hello RRF!!" title="Welcome to our foundation" content="Anim pariatur cliche reprehenderit."]


*/