Wordpress Shortcode Not Displaying Results - php

Question

I have been attempting to create my own shortcode for my Wordpress theme to make life a bit easier. Unfortunately I have run into issues with my code.
Below, the code in the Javascript section is what I have placed in my functions.php file, and in the HTML section is what I have placed on my page in Wordpress as the shortcode, however nothing seems to appear?
1: JAVASCRIPT
2: HTML
function hire_equipment_func($atts) {
extract( shortcode_atts( array(
'img' => 'no-img',
'user' => 'no-user',
'text' => 'no-text',
), $atts ) );
if ( $atts['img'] == '' || $atts['user'] == '' || $atts['text'] == '' ) return;
$output =
'<div>
<div>' . $atts['img'] . '</div><br />
<div>' . $atts['user'] . '</div>
<div>' . $atts['text'] . '</div>
</div>';
return $output;
}
add_shortcode( 'hire_equipment', 'hire_equipment_func' );
[hire_equipment img="" user="Test Float" text="Can be used anywhere"]
Any help with this issue would be GREATLY appreciated!!
Kind regards,
Jesse

Answer 1

This will return nothing if one of the attributes is not set, and will return each attribute in a div otherwise.
function hire_equipment_func($atts) {
$atts = array_change_key_case((array)$atts, CASE_LOWER);
if (!isset($atts['img']) || !isset($atts['user']) || !isset($atts['text'])) return;
$output =
'<div>
<div>' . $atts['img'] . '</div><br />
<div>' . $atts['user'] . '</div>
<div>' . $atts['text'] . '</div>
</div>';
return $output;
}
add_shortcode( 'hire_equipment', 'hire_equipment_func' );

Answer 2

function hire_equipment_func($atts) {
extract( shortcode_atts( array(
'img' => 'no-img',
'user' => 'no-user',
'text' => 'no-text',
), $atts ) );
if ( $atts['img'] == 'no-img' || $atts['user'] == 'no-user' || $atts['text'] == 'no-text' ) return;
$output =
'<div>
<div>' . $atts['img'] . '</div><br />
<div>' . $atts['user'] . '</div>
<div>' . $atts['text'] . '</div>
</div>';
return $output;
}
add_shortcode( 'hire_equipment', 'hire_equipment_func' );
[hire_equipment img="" user="Test Float" text="Can be used anywhere"]
Okay, for some reason I placed the same text from each attribute (e.g. 'no-img' from attribute 'img') into each text area in the IF statement, and it worked!
So I have answered my own question! However, I am still interested in wondering WHY that works the way it did. I am willing to mark the question as ANSWERED once someone helps me in understanding the concept reason behind it.
Thanks!
Jesse

Answer 3

This will remove sections that are not specified, so if you toss this snippet of PHP into your functions.php file (in your child theme, preferably):
function hire_equipment_func( $atts ) {
extract(
shortcode_atts(
array(
'img' => 'no-img'
, 'user' => 'no-user'
, 'text' => 'no-text'
)
, $atts
)
);
$output = '<div>' . PHP_EOL;
if( isset( $atts[ 'img' ] ) ) { $output .= ' <div>' . $atts[ 'img' ] . '</div><br>' . PHP_EOL; }
if( isset( $atts[ 'user' ] ) ) { $output .= ' <div>' . $atts[ 'user' ] . '</div>' . PHP_EOL; }
if( isset( $atts[ 'text' ] ) ) { $output .= ' <div>' . $atts[ 'text' ] . '</div>' . PHP_EOL; }
$output .= '</div>';
return $output;
}
add_shortcode( 'hire_equipment', 'hire_equipment_func' );
and place this WordPress shortcode on your page:
[hire_equipment img="" user="Test Float" text="Can be used anywhere"]
you will get:
　
Test Float
Can be used anywhere
Example 2:
[hire_equipment img="/file/path/image.svg" user="Test Float" text="Can be used anywhere"]
yields
/file/path/image.svg
Test Float
Can be used anywhere
Example 3:
[hire_equipment img="/file/path/image.svg" text="Can be used anywhere"]
outputs
/file/path/image.svg
Can be used anywhere
Example 4:
[hire_equipment img="" user="" text=""]
shows
　
caused by that line break in your markup.
If you're wondering, PHP_EOL is a PHP constant denoting the correct 'End Of Line' symbol for your platform.