function the_image($atts) {
        "to" => 'https://pics.wikifeet.com/Melania-Trump-Feet-720891.jpg'
    ), $atts));
    return '<div class="class1">';
        return '<img class="class2" src="'.$to.'" alt="The First Caption" width="100%" height="auto">';
        return '<i class="fa fa-expand" aria-hidden="true"></i>;'
    return '</div>';
add_shortcode("the_image", "the_image");

Please help me If you think I am missing any sanitization. secondly,

How should I print attribute in the shortcode I mean the image link needs to be entered by the user. I have put the default → "to" =>'https://pics.wikifeet.com/Melania-Trump-Feet-720891.jpg'

but this needs to be changed. please guide me.

  • Do you think that this is faulty → ` src="'.$to.'"` – The WP Intermediate Aug 8 '17 at 8:10

You're returning each line individually. It's only going to output the first line since return stops execution of the function. Instead, add each line to a string by concatenating with .=:

function wpse_276152_image_shortcode( $atts ) {
    $atts = shortcode_atts( array(
        'to' => 'https://pics.wikifeet.com/Melania-Trump-Feet-720891.jpg'
    ), $atts );

    $output = '<div class="class1">';
    $output .= '<img class="class2" src="' . $atts['to'] . '" alt="The First Caption" width="100%" height="auto">';
    $output .= '<i class="fa fa-expand" aria-hidden="true"></i>';
    $output .= '</div>';

    return $output;
add_shortcode( 'the_image', 'wpse_276152_image_shortcode' );

.= is the same as saying $output = $output . ' string to add'.

Also note some other changes I made:

  1. the_image is too generic a name for a function. You're increasing your chances of running into conflict issues. Note that the function name and shortcode don't need to be the same.
  2. Don't use extract(). As your code gets more complex it can make maintenance needlessly difficult.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.