Header Ads

Header ADS

counter shortcode element development

 


=========counter shortcode make================



html code:

................

  <div class="counter">

            <div class="counter-icon"><i class="icon-presentation"></i></div>

            <div class="counter-content">

              <h5><span data-count="212" class="number-count">212</span><span class="red-dot"></span></h5><span>Projects</span>

            </div>

          </div>


....................................

//font awesome link kore nite hobe otherwise fontawesome er icon pabe nah.




<?php 



function commet_counter($one, $two){

$commet = shortcode_atts([


'title' =>' ',

'value'  =>' ',

'icon'   =>' ',

                'counter-color'  =>'#333'



], $one);



ob_start();


?>


  <div class="counter" style="color:<?php echo $commet['counter-color']; ?>">

            <div class="counter-icon"><i class="<?php echo $commet['icon']; ?>"></i></div>

            <div class="counter-content">

              <h5><span data-count="<?php echo $commet['value']; ?>" class="number-count"><?php echo $commet['value']; ?></span><span class="red-dot"></span></h5><span><?php echo $commet['title']; ?></span>

            </div>

          </div>




<?php

return ob_get_clean();



}

add_shortcode('commet_counter', 'commet_counter');




vc_map([


'name'            =>'Commet Counter',

'base'            =>'commet_counter',

'icon'            =>get_template_directory_uri(). '/images/cat.png',

'description'     =>'Commet Custom box',

'params'          =>[


[


'param_name' => 'title',

'type'       =>'textfield',

'heading'    =>'Title'

  


],


[


'param_name' => 'value',

'type'       =>'textfield',

'heading'    =>'Value'

  


],


[


'param_name' => 'icon',

'type'       =>'iconpicker',

'heading'    =>'Select Icon'

  


],

[


'param_name' => 'counter-color',

'type'       =>'colorpicker',

'heading'    =>'Select a color'

  


]





]





]);



 ?>


.........................................................


No comments

Theme images by fpm. Powered by Blogger.