Output product HTML in custom shortcode for WooCommerce - php

Question

EDIT: I've simplified my code considerably to see if I can actually get HTML to ouput, but no luck.
Here is the simplified version, removing all my custom HTML and only adding <div class="test"></div> to see if I can get my shortcode to output HTML, which it does not.
//custom shortcodes
function product_snippet( $atts ) {
// Attributes
$atts = shortcode_atts(
array(
'id' => '',
'snippet' => '',
),
$atts,
'product_snippet'
);
return $product = wc_get_product($atts['id']);
return $product_img = $product->get_image();
return $product_title = $product->get_title();
return $product_link = get_permalink($atts['id']);
return $children = $product->get_children();
return $children_array = array();
echo "<div class='test'></div>";
}
add_shortcode( 'product_snippet', 'product_snippet' );
This stops the site from crashing, but not HTML is outputted.
ORIGINAL POST:
I am trying to write a custom shortcode so that my client will be more easily able to edit their website. I've added the following code to my WordPress's functions.php file and I can't determine why it isn't working.
The idea is to input a grouped product's ID into the short code, and it will pull up the product's Title, Image, and all child products.
function product_snippet( $atts ) {
$a = shortcode_atts( array (
'id',
'snippet',
), $atts);
$product = wc_get_product($a['id']);
$product_img = $product->get_image();
$product_title = $product->get_title();
$product_link = get_permalink($a['id']);
$children = $product->get_children();
//initialize array so that child products can be sorted by price.
$children_array = array();
//Assign each child product to its price in array so that child products can be sorted by price in HTML.
foreach ($children as $key => $value) {
$children_array[$value] = wc_get_product($value)->get_price();
};
asort($children_array);
return '<div class="main_pro">
<div class="left-sd">' . do_shortcode('[product id="' . $a['id'] . '"]') . '</div>
<div class="right-sd">
<div class="info">
<h2>'. $product_title . '</h2>
<p>' . $a['snippet'] . ' More Info >></p>
</div>
<ul>
' . foreach ($children_array as $key => $value) {
$option = wc_get_product($key);
$option_title = $option->post->post_title;
. '
<li>
<div id="outer-bar">
<div class="bar-l">
' . $option_title;
if ($option->get_attribute('pa_pack-size')) {
strval(wc_get_product($key)->get_attribute('pa_pack-size'));
.'<br/>
<span class="small_pz">
' . "$" . strval(round(($option->get_price() / intval($option->get_attribute('pa_pack-size'))), 2)) . " per tray - SAVE $" . strval(round(($product->get_price() * $option->get_price() - $option->get_price()), 2)); . '
</span>
' . }
. '</div>
<div class="bar-r">' . do_shortcode('[add_to_cart id="' . $key . '"]'); . '</div>
</div>
</li>
' . }
. ' </ul>
</div>
</div>';
};
add_shortcode( 'product_snippet', 'product_snippet' );
Assume I have my opening and closing <?php ?> tags. I don't write in PHP a lot so I apologize if my code is janky. If I can get this closer to best practices (I don't think my concatenation looks right) I'm open to feedback.

Answer 1

There was a bunch of errors in the code. Try this.
function product_snippet($atts)
{
$a = shortcode_atts(array(
'id',
'snippet',
), $atts);
$product = wc_get_product($a['id']);
$product_img = $product->get_image();
$product_title = $product->get_title();
$product_link = get_permalink($a['id']);
$children = $product->get_children();
//initialize array so that child products can be sorted by price.
$children_array = array();
//Assign each child product to its price in array so that child products can be sorted by price in HTML.
foreach ($children as $key => $value) {
$children_array[$value] = wc_get_product($value)->get_price();
};
asort($children_array);
$string = '<div class="main_pro">
<div class="left-sd">' . do_shortcode('[product id="' . $a['id'] . '"]') . '</div>
<div class="right-sd">
<div class="info">
<h2>' . $product_title . '</h2>
<p>' . $a['snippet'] . ' More Info >></p>
</div>
<ul>';
foreach ($children_array as $key => $value) {
$option = wc_get_product($key);
$option_title = $option->post->post_title;
$string .= '
<li>
<div id="outer-bar">
<div class="bar-l">
' . $option_title;
if ($option->get_attribute('pa_pack-size')) {
strval(wc_get_product($key)->get_attribute('pa_pack-size'));
$string .= '<br/>
<span class="small_pz">
' . "$" . strval(round(($option->get_price() / intval($option->get_attribute('pa_pack-size'))), 2)) . " per tray - SAVE $" . strval(round(($product->get_price() * $option->get_price() - $option->get_price()), 2)) .
'</span>';
}
$string .= '</div>
<div class="bar-r">' . do_shortcode('[add_to_cart id="' . $key . '"]') . '</div>
</div>
</li>
';
}
$string .= ' </ul>
</div>
</div>';
return $string;
}
add_shortcode('product_snippet', 'product_snippet');

Answer 2

I have changed a little your code to make it work. This is just an example that you can complete. Try it and let me know:
//custom shortcodes
if( !function_exists('product_snippet') ) {
function product_snippet( $atts ) {
// Attributes
extract( shortcode_atts(
array(
'id' => '', // You will use $id to get the value of this attribute
'snippet' => '' // You will use $snippet to get the value of this attribute
),
$atts
));
// Get an instance of the product object
$product = wc_get_product( $id );
// Displays go here
return '<div class="test">'.$product->get_image().''.$product->get_title().'</div>';
}
add_shortcode( 'product_snippet', 'product_snippet' );
}
You should get an html output this time …
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.