I want to replace my product description by my description + all product images (include variation product images) in single product page.
I can do that with Magento but now when change to Woocommerce I can not.
After research I tried with filter hook but not success.
I can add text to product decscription but I am stucking how to using functions wp_get_attachment_image_url()
or wp_get_attachment_image()
.
Sample code for display image as I know:
echo wp_get_attachment_image( get_the_ID(), array('700', '600'), "", array( "class" => "img-responsive" ) ).
How to apply in my code?
// Display description tab when empty add_filter( 'woocommerce_product_tabs', 'display_description_product_tabs' ); function display_description_product_tabs( $tabs ) { $tabs['description'] = array( 'title' => __( 'Description', 'woocommerce' ), 'priority' => 10, 'callback' => 'woocommerce_product_description_tab', ); return $tabs; } // Add image to description add_filter( 'the_content', 'add_product_image_woocommerce_description' ); function add_product_image_woocommerce_description( $content ) { global $product; // Single product pages (woocommerce) if ( is_product() ) { // Image id $attachment_ids = $product->get_gallery_image_ids(); $image_content = ""; foreach( $attachment_ids as $attachment_id ) { $image_content .= '<img src="'. wp_get_attachment_image_url($attachment_id, 'full') . '" alt="image_content" width="500" height="600">'; } $image_content .= '<p> TEST Image content </p>'; // Inserting the custom content at the end $content .= $image_content; } return $content; }
Advertisement
Answer
You can use the WC_Product
get_image()
method like:
echo $product->get_image( array('700', '600'), array( "class" => "img-responsive" ), '' );
Then in your code you can buffer all echoed custom code plus the main product image (at the end of your product description content) as follow:
// Display description tab when empty add_filter( 'woocommerce_product_tabs', 'display_description_product_tabs' ); function display_description_product_tabs( $tabs ) { $tabs['description'] = array( 'title' => __( 'Description', 'woocommerce' ), 'priority' => 10, 'callback' => 'woocommerce_product_description_tab', ); return $tabs; } // Add image to description add_filter( 'the_content', 'add_product_image_woocommerce_description' ); function add_product_image_woocommerce_description( $content ) { global $product; // Single product pages (woocommerce) if ( is_product() ) { ob_start(); // Start buffering // HERE your main image echo $product->get_image( array('700', '600'), array( "class" => "img-responsive" ), '' ); $image_content = ""; // Loop through gallery Image Ids foreach( $product->get_gallery_image_ids() as $image_id ) { echo '<img src="'. wp_get_attachment_image_url($image_id, 'full') . '" alt="image_content" width="500" height="600">'; } echo '<p> TEST Image content </p>'; // Testing text // Inserting the buffered content after $content .= ob_get_clean(); } return $content; }