WordPress Shortcode – Very puzzling issue?

2 Views

I am trying to create a ‘Pie Chart’ shortcode to use in WP. All works fine apart from the percentage number. If it is entered into the array it works fine, but if I remove that number (ie; 100 – as seen in the code below), any number that is entered on the front-end by the user returns empty?? Quite puzzling? 

function piechart_inner_shortcode( $atts ) {

extract( shortcode_atts( array(
  'data_percentage' => '100',
  'title' => 'Title',
), $atts ) );

   $output = '<div class="chart"><div class="percentage" data-percent="'. $data_percentage .'"><span>'.$data_percentage.'%</span></div><div class="label"><strong>'.$title.'</strong></div></div>';

   return $output;

}

add_shortcode( 'piechart_inner', 'piechart_inner_shortcode' );

And this is the shortcode that needs to be entered on the front-end –

Read More

[piechart_inner data-percent=”45″ title=”WordPress”][/piechart_inner]

Which outputs nothing for the data-percent, whatever value is entered?

Many thanks

Post Views: 2

Related posts

Leave a Reply

1 comment

  1. You are using the wrong variable. You are giving data-percent when you have variable data_percentage

    Your shortcode should look like this:

    [piechart_inner data_percentage="45" title="WordPress"][/piechart_inner]

    Or change the function to following:

    function piechart_inner_shortcode( $atts ) {

extract( shortcode_atts( array(
  'data-percent' => '100',
  'title' => 'Title',
), $atts ) );

   $output = '<div class="chart"><div class="percentage" data-percent="'. $data-percent .'"><span>'.$data-percent.'%</span></div><div class="label"><strong>'.$title.'</strong></div></div>';

   return $output;

}

add_shortcode( 'piechart_inner', 'piechart_inner_shortcode' );