Wordpress WooCommerce 360 Images as the featured image

readme.md

#How to do it.

Using 360° Product Images with woocommerce (Rather than putting them in the description)

Plugin needed: http://www.magictoolbox.com/magic360 http://www.woothemes.com/woocommerce

Place the fucntions code in your functions.php. this will create a function called get_the_slug() which will use the product's name

Then in the product-image.php file, you can call the name of the product here by pasting my code into the file, it'll call the name of the product as the image then follow the sequence.

#NOTE!

The 360 image sequence has to be named the same os the product slug for this to work, so if your slug is 'huge_door_frame', then you must name your images 'huge_door_frame_01', 'huge_door_frame_02', 'huge_door_frame_03' etc

functions.php

// This will make a new function called "get_the_slug()" which will get the page
// slug, for example, of the page is ...com/blog/news/story-name-here, then this
// will echo 'story-name-here'. I'm using this in WooCommerce for the product
// 360 images, because I need to rename each set of images so they become
// unique, I needed a way of getting separating them. The only drawback here, is
// that you need to know the slug before you make the images, AND if you rename
// that page, the images will break. SO. It's something that is experimental,
// but if monitored right, shouldn't be a problem! &

function get_the_slug( $id=null ){
  if( empty($id) ):
    global $post;
    if( empty($post) )
      return ''; // No global $post var available.
    $id = $post->ID;
  endif;

  $slug = basename( get_permalink($id) );
  return $slug;
}

product-image.php

<?php
/**
 * Single Product Image
 *
 * @author   	WooThemes
 * @package 	WooCommerce/Templates
 * @version     2.0.3
 */

if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly

global $post, $woocommerce, $product;

?>
<div class="img sixcol first clearfix">

	<?php
		if ( has_post_thumbnail() ) {

			$image       		= get_the_post_thumbnail( $post->ID, apply_filters( 'single_product_large_thumbnail_size', 'shop_single' ) );
			$image_title 		= esc_attr( get_the_title( get_post_thumbnail_id() ) );
			$image_link  		= wp_get_attachment_url( get_post_thumbnail_id() );
			$attachment_count   = count( $product->get_gallery_attachment_ids() );

			if ( $attachment_count > 0 ) {
				$gallery = '[product-gallery]';
			} else {
				$gallery = '';
			}
// Don't forget to change the filename, i've got a specific size in the filename for the smaller thumbnail
			echo apply_filters( 'woocommerce_single_product_image_html', sprintf( '<a href="%s" itemprop="image" data-magic360-options="filename:'.get_the_slug().'_{col}-590x780.jpg; large-filename:'.get_the_slug().'_{col}.jpg;" class="woocommerce-main-image Magic360" title="%s"  data-rel="prettyPhoto' . $gallery . '">%s</a>', $image_link, $image_title, $image ), $post->ID );

		} else {

			echo apply_filters( 'woocommerce_single_product_image_html', sprintf( '<img src="%s" alt="Placeholder" />', woocommerce_placeholder_img_src() ), $post->ID );

		}
	?>

	<?php do_action( 'woocommerce_product_thumbnails' ); ?>

</div>