I’m stuck trying to get my site together in time for our launch.
We’ve got a wordpress plugin that displays a product based on selected inputs. Each variation has an image which is layered over top of each other and in pNG to create a final picture. It all works well on the product page http://tattersfield.co/online-tailor-store/double-breasted/luciano-79000-1-jacket/ but now I need the image to display in our Composite Product area http://tattersfield.co/online-tailor-store/three-piece-single-breasted-suit/test-3-piece-suit .
This is the code I need to update to display the plugin generated image instead of the product thumbnail.
<?php
/**
* Composited Product Image
* @version 3.0.0
*/
// Exit if accessed directly
if ( ! defined( 'ABSPATH' ) )
exit;
if ( has_post_thumbnail( $product_id ) ) {
?><div class="composited_product_images"><?php
$image_title = esc_attr( get_the_title( get_post_thumbnail_id( $product_id ) ) );
$image_link = wp_get_attachment_url( get_post_thumbnail_id( $product_id ) );
$image = get_the_post_thumbnail( $product_id, apply_filters( 'woocommerce_composited_product_thumbnail_size', 'shop_catalog' ), array(
'title' => $image_title
) );
echo apply_filters( 'woocommerce_composited_product_image_html', sprintf( '<a href="%s" class="composited_product_image zoom" title="%s" data-rel="prettyPhoto">%s</a>', $image_link, $image_title, $image ), $product_id );
?></div><?php
}And this is a snippet of the code from the plugin that displays the image. What do I need to do to get these 2 pieces to work together to display the image I’m after?
Frontend Single Product Page
============================= */
public function display_product_image() {
global $post, $jckpc_options;
$setImages = get_post_meta( $post->ID, $this->slug.'_images', true );
$defaults = get_post_meta( $post->ID, $this->slug.'_defaults', true );
$querySelectors = $_GET;
if(!empty($querySelectors)) {
$sanitisedQuerySelectors = array();
foreach($querySelectors as $attSlug => $attVal) {
$sanitisedQuerySelectors[$this->sanitise_str($attSlug)] = $this->sanitise_str($attVal);
}
$querySelectors = $sanitisedQuerySelectors;
}
$images = array();
if( $setImages['background'] && $setImages['background'] != '' ) {
$imgSrc = wp_get_attachment_image_src($setImages['background'], apply_filters( 'single_product_large_thumbnail_size', 'shop_single' ));
$images[] = '<img id="'.$this->slug.'_image_background" src="'.$imgSrc[0].'">';
}
$setImages = array_reverse($setImages);
$img_i = 1; foreach($setImages as $attSlug => $attVals) {
$default = ( isset($defaults[$attSlug]) && isset($setImages[$attSlug][$defaults[$attSlug]]) ) ? $setImages[$attSlug][$defaults[$attSlug]] : false;
$default = ( isset($querySelectors[$attSlug]) && isset($setImages[$attSlug][$querySelectors[$attSlug]]) ) ? $setImages[$attSlug][$querySelectors[$attSlug]] : $default;
$images[$img_i] = '<div id="'.$this->slug.'_image_'.$attSlug.'">';
if($default) {
$imgSrc = wp_get_attachment_image_src($default, apply_filters( 'single_product_large_thumbnail_size', 'shop_single' ));
$images[$img_i] .= '<img src="'.$imgSrc[0].'">';
}
$images[$img_i] .= '</div>';
$img_i++;
}
// output images
echo '<style>';
echo '#jckpc_images {';
// width
echo "width: {$jckpc_options['image_container_width']['width']};";
// align
if($jckpc_options['image_container_align'] == "centre") {
echo "margin-left: auto; margin-right: auto;";
$jckpc_options['image_container_align'] = "none";
}
echo "float: {$jckpc_options['image_container_align']};";
// spacing
echo "margin-top: {$jckpc_options['image_container_margin']['margin-top']};";
echo "margin-right: {$jckpc_options['image_container_margin']['margin-right']};";
echo "margin-bottom: {$jckpc_options['image_container_margin']['margin-bottom']};";
echo "margin-left: {$jckpc_options['image_container_margin']['margin-left']};";
// padding
echo "padding-top: {$jckpc_options['image_container_padding']['padding-top']};";
echo "padding-right: {$jckpc_options['image_container_padding']['padding-right']};";
echo "padding-bottom: {$jckpc_options['image_container_padding']['padding-bottom']};";
echo "padding-left: {$jckpc_options['image_container_padding']['padding-left']};";
// background
echo "background: {$jckpc_options['image_container_background']};";
echo '}';
$horThumbSpacing = $jckpc_options['thumb_spacing']/2;
$verThumbSpacing = $jckpc_options['thumb_spacing'];
echo "#jckpc_thumbnails {";
echo "margin: {$verThumbSpacing}px -{$horThumbSpacing}px -{$verThumbSpacing}px;";
echo "}";
echo '#jckpc_thumbnails a {';
echo "float: left;";
echo "display: inline;";
$thumbWidth = 100/(int)$jckpc_options['thumb_cols_rows'];
echo "width: {$thumbWidth}%;";
// spacing
echo "padding: 0 {$horThumbSpacing}px {$verThumbSpacing}px;";
echo '}';
echo "#jckpc_image_wrap #jckpc_loading {";
// background
echo "background: {$jckpc_options['loading_overlay_colour']};";
echo "}";
echo "#jckpc_image_wrap #jckpc_loading i {";
$loadingIconMTop = 20/2;
echo "font-size: 20px;";
echo "line-height: 20px;";
echo "margin-top: -{$loadingIconMTop}px;";
echo "color: {$jckpc_options['loading_icon_colour']};";
echo "}";
// breakpoint
if($jckpc_options['enable_breakpoint']) {
echo "@media (max-width: {$jckpc_options['breakpoint']['width']}) {";
echo '#jckpc_images {';
// width
echo "width: {$jckpc_options['image_container_width_breakpoint']['width']};";
// align
if($jckpc_options['image_container_align_breakpoint'] == "centre") {
echo "margin-left: auto; margin-right: auto;";
$jckpc_options['image_container_align_breakpoint'] = "none";
}
echo "float: {$jckpc_options['image_container_align_breakpoint']};";
// spacing
echo "margin-top: {$jckpc_options['image_container_margin_breakpoint']['margin-top']};";
echo "margin-right: {$jckpc_options['image_container_margin_breakpoint']['margin-right']};";
echo "margin-bottom: {$jckpc_options['image_container_margin_breakpoint']['margin-bottom']};";
echo "margin-left: {$jckpc_options['image_container_margin_breakpoint']['margin-left']};";
echo "}";
echo "}";
}
echo '</style>';
echo '<div id="'.$this->slug.'_images">';
echo '<div id="'.$this->slug.'_image_wrap" data-loading="0">';
foreach($images as $image) {
echo $image;
}
echo '<div id="'.$this->slug.'_loading"><i class="jckpc-icn-'.$jckpc_options['loading_icon'].' animate-spin"></i></div>';
echo '</div>';
if($jckpc_options['show_thumbs']) $this->get_thumbnails();
echo '</div>';
}
public function get_thumbnails() {
global $post, $product, $woocommerce;
$attachment_ids = $product->get_gallery_attachment_ids();
if ( $attachment_ids ) {
echo '<div id="'.$this->slug.'_thumbnails">';
$loop = 0;
$columns = apply_filters( 'woocommerce_product_thumbnails_columns', 3 );
foreach ( $attachment_ids as $attachment_id ) {
$classes = array( 'zoom' );
if ( $loop == 0 || $loop % $columns == 0 )
$classes[] = 'first';
if ( ( $loop + 1 ) % $columns == 0 )
$classes[] = 'last';
$image_link = wp_get_attachment_url( $attachment_id );
if ( ! $image_link )
continue;
$image = wp_get_attachment_image( $attachment_id, apply_filters( 'single_product_small_thumbnail_size', 'shop_thumbnail' ) );
$image_class = esc_attr( implode( ' ', $classes ) );
$image_title = esc_attr( get_the_title( $attachment_id ) );
echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', sprintf( '<a href="%s" class="%s" title="%s" data-rel="prettyPhoto[product-gallery]">%s</a>', $image_link, $image_class, $image_title, $image ), $attachment_id, $post->ID, $image_class );
$loop++;
}
echo '</div>';
}
}
public function get_image_data($pid, $atts) {
$imgData = array(
'prodid' => $pid
);
if(!empty($atts)){
foreach($atts as $attSlug => $attVal) {
if(substr($attSlug, 0, 10) != "attribute_") $attSlug = 'attribute_'.$attSlug;
$imgData[$attSlug] = sanitize_title_with_dashes($attVal);
}
}