Multiple Parameters for a Shortcode

Question

I am working on building some shortcodes for my blog. I can set a single parameter for my shortcode, but not sure how to set different parameter.

For example, I can use [myshortcode myvalue] to output a html block within the post content.

Here is what I am currently using:

function test_shortcodes( $atts ) {
    extract( shortcode_atts( array(
        'myvalue' => '<div class="shortcodecontent"></div>'

    ), $atts ) );

    return $myvalue;
}
add_shortcode( 'myshortcode', 'test_shortcodes' );

Now, how can I use [myshortcode myothervalue] to output a different block of html?

Please note that the shortcode is same, only the parameter is changed.

Answer 1

Lets look at the shortcode

[SH_TEST var1="somevalue" var2="someothervalue"]THE SHORTCODE CONTENT[/SH_TEST]

the shortcode handler function accepts 3 paramters

1. $atts - an array of attributes passed by the shortcode in our case:

   • $atts['var1'] is set to 'somevalue'
   • $atts['var2'] is set to 'someothervalue'

2. $content - is a string of the value enclosed with in the shortcode tags, in our case: -$content is set to THE SHORTCODE CONTENT

3. $tag - is a string of the shortcode tag, in our case: -$tag is set to SH_TEST

When I create a shortcode i usually define the default values and merge them with the values submitted by the shortcode tag ex:

add_shortcode('SH_TEST','SH_TEST_handler');
function SH_TEST_handler($atts = array(), $content = null, $tag){
    shortcode_atts(array(
        'var1' => 'default var1',
        'var2' => false
    ), $atts);

    if ($atts['var2'])
          return 'myothervalue';
    else
          return 'myvalue'; 
}

Answer 2

If you use the shortcode like that atts[0] will contain the value:

add_shortcode( 'test', 'test_callback' );

function test_callback( $atts )
{
    return $atts[0];
}

Another way is calling the value with a name:

[myshortcode val="myvalue"]

function test_callback( $atts )
{
    return $atts["val"];
}

Answer 3

You're better off doing it like this:

function test_shortcodes( $atts ) {
    extract( shortcode_atts( array(
        'type' => 'myvalue'

    ), $atts ) );

    switch( $type ){
        case 'myvalue': 
            $output = '<div class="shortcodecontent"></div>';
            break;

        case 'myothervalue': 
            $output = '<div class="othershortcodecontent"></div>';
            break;

        default:
            $output = '<div class="defaultshortcodecontent"></div>';
            break;
    }

    return $output;
}
add_shortcode( 'myshortcode', 'test_shortcodes' );

Use it like this:

[myshortcode type="myvalue"] to output <div class="shortcodecontent"></div>

and

[myshortcode type="myothervalue"] to output <div class="othershortcodecontent"></div>

Answer 4

This way works for me in all cases using [myshortcode type="myvalue"]

function test_shortcodes( $atts = array() ) {
extract( shortcode_atts( array(
    'type' => 'myvalue'

), $atts ) );

switch( $atts['type] ){
    case 'myvalue': 
        $output = '<div class="shortcodecontent"></div>';
        break;

    case 'myothervalue': 
        $output = '<div class="othershortcodecontent"></div>';
        break;

    default:
        $output = '<div class="defaultshortcodecontent"></div>';
        break;
}

return $output;
}
add_shortcode( 'myshortcode', 'test_shortcodes' );

And if you want to add another parameter all you need to do is this [myshortcode type="myvalue" other="somevalue"]

test_shortcodes( $atts = array() ) {
extract( shortcode_atts( array(
    'type' => 'myvalue', //Could be default
    'other' => 'somevalue' //Could be default

), $atts ) );

switch( $atts['other'] ){
    case 'somevalue': 
        $output = '<div class="shortcodecontent">somevalue</div>';
        break;

    case 'myothervalue': 
        $output = '<div class="othershortcodecontent"></div>';
        break;

    default:
        $output = '<div class="defaultshortcodecontent"></div>';
        break;
}

return $output;
}
add_shortcode( 'myshortcode', 'test_shortcodes' );

I hope this helps

Answer 5

First, you will have to define $atts item in your function because $atts is an array.

Here is the complete code to pass the variable in shortcode -

Let's suppose you need to show all the product of a category through shortcode, You need to do following code in your function file -

 function creative_writing_func($atts) {
 $args = array(
'post_type'      => 'product',
'posts_per_page' => 10,
'product_cat'    => $atts['categoryname']
);

$loop = new WP_Query( $args );

while ( $loop->have_posts() ) : $loop->the_post();
global $product;
echo '<br /><a href="'.get_permalink().'">' . 
woocommerce_get_product_thumbnail().' '.get_the_title().'</a>';
endwhile;

wp_reset_query();
}

add_shortcode('creative_writing_func_short', 'creative_writing_func');

Now you can simply paste the shortcode code in your template file or Wordpress default editor -

  [creative_writing_func_short categoryname="creative-writing-english-literature"]

Where we're passing the Category name (creative-writing-english-literature) in the shortcode.

Have tested it and it's working.