Woocommerce product images replaced with a gallery plugin

Question

First I would like to analyze my problem. Using Wordpress/Woocommerce I need to add videos beside images in the gallery of the product. Woocommerce does not support videos at all.

So, I thought to install an extra gallery plugin that supports both images and videos.

Now, I want to map a specific image/video gallery collection to a specific product. I want also to view this gallery collection in a new region that is not belong to the standard text fields like description or short description. Lets say above of the main product image. The php code that represent the gallery collection id=1 looks like below :

<?php echo do_shortcode('[wonderplugin_gallery id="1"]'); ?>

The problem is that I need the gallery collection id to be variable, something like this :

<?php echo do_shortcode('[wonderplugin_gallery id="X"]'); ?>

where X represnt the specific gallery collection. How the heck can I connect the gallery collection ID XXXX to my Product page XXXXX?

I have programming skills but I am new to the wordpress code logic.

Any other suggestions to my problem like plugins that may replace the default product gallery with better one ?

Regards,

You need to add custom field to your product, see the following article : http://www.remicorson.com/mastering-woocommerce-products-custom-fields/ — Anand Shah, Sep 18 '15 at 11:17
Thanks I already did that and it worked. The only problem is the double quotes from the parameters. If the id param have quotes then plugin can not find the gallery collection using the the SQL query . Is that a bug or should I escape such special characters ? — Maverick, Sep 18 '15 at 14:32

score 0 · Accepted Answer · answered Sep 18 '15 at 13:33

I'd either use the product custom fields as Anand suggested, or create a metabox with the necessary input fields (or dropdowns depending on how you use the gallery plugin).

First I'd create a metabox, and in that metabox I'd pull the info from the plugin (gallery id's and names). Out of that you can create a dropdown. You should be able to select the id from that metabox for each product like you suggested. For instance something like this could work:

<?php

if ( ! function_exists( 'product_add_meta' ) ){
    function product_add_meta(){
        add_meta_box("gallery_dropdown", "Select Gallery", "product_gallery_meta_box", "product");
    }
}
add_action("admin_init", "product_add_meta");

if ( ! function_exists( 'product_gallery_meta_box' ) ){
    function product_gallery_meta_box( $post ){
        $post_types = array('product');     //limit meta box to certain post types
        global $post;
        $product = get_product( $post->ID );
        $values = get_post_custom( $post->ID );
        $gallery = (isset($values['gallery'][0])) ? $values['gallery'][0] : '';
        wp_nonce_field( 'my_meta_box_nonce', 'meta_box_nonce' );
        ?>
        <p>
            <select name="gallery" id="gallery">
            //example of how the option should look
            <option value="<?php echo $gallery_id; ?>" <?php selected( $gallery, $gallery_id ); ?>><?php echo $gallery_name; ?></option>
                <?php
                //pull options from plugin here and create an option dropdown with foreach
                ?>
            </select>
        </p>
        <?php
    }
}

if ( ! function_exists( 'product_gallery_save_meta_box' ) ){
    function product_gallery_save_meta_box( $post_id ){
        if( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ){
            return;
        }
        if( !isset( $_POST['gallery'] ) || !wp_verify_nonce( $_POST['meta_box_nonce'], 'my_meta_box_nonce' ) ) {
            return;
        }
        if( !current_user_can( 'edit_pages' ) ) {
            return;
        }
        if( isset( $_POST['gallery'] ) ){
            update_post_meta( $post_id, 'gallery', wp_kses( $_POST['gallery'] ,'') );
        }
    }
}
add_action( 'save_post', 'product_gallery_save_meta_box' );

If you put this in the functions.php, it should show a metabox called 'Select Gallery' with an empty dropdown on your woocommerce product page.

I haven't filled the options that you get from the plugin with which you create your galleries, but it shouldn't be too hard.

I used a custom text field to save the whole shortcode and not just the id number. In this case as you can read my previous answer I have problem with the double quotes in the id number . The gallery plugin can find the collection in the db . Is that a plugin's bug ? If I save the shortcode without quotes in the id parameter works fine. — Maverick, Sep 18 '15 at 14:37
Did you try to reverse the quotes `` ? There is a great answer about quotes in php [here](http://stackoverflow.com/questions/3446216/what-is-the-difference-between-single-quoted-and-double-quoted-strings-in-php) — dingo_d, Sep 18 '15 at 15:31
No but I want just to copy/paste the whole shortcode and not just the id number to my custom text field. With few words I don't want to process the generated plugin's shortcode. I might try to edit the plugin source code since I believe it's a bug. I will make some tests before I will take my final decision of what might be wrong here. — Maverick, Sep 18 '15 at 16:35

score 0 · Answer 2 · answered Sep 18 '15 at 14:15

One way is to bind the product page id and gallery id. If you can change the id of a gallery then change it to match the id of the product page. Now you can create shortcode with any of these two examples.

// outside the loop use global ( uncomment appropriate statement )
// global $product; 
// global $post;

do_shortcode( sprintf( '[wonderplugin_gallery id="%d"]', $product->id ) );
do_shortcode( sprintf( '[wonderplugin_gallery id="%d"]', $post->ID ) );

HERE is a link for plugin that reveals most of the IDs on admin pages.

Another is to create Custom Field ( post meta ) in edit product admin page ( named gallery_id for example ), and to save there id of the gallery to use. To create shortcode use get_post_meta() function that retrieves the saved post meta.

do_shortcode( sprintf( '[wonderplugin_gallery id="%d"]', get_post_meta( $post->ID, 'gallery_id', true ) ) );

To get the gallery id meta use $post->ID, $product->id, or get_the_ID() function, the latter only inside the loop.

Woocommerce product images replaced with a gallery plugin

2 Answers2