如何使用" Woocommerce Product Image Flipper"在主页上翻转图像。插入?

时间:2017-08-27 13:59:19

标签: php css wordpress

我正在使用Wordpress插件" Woocommerce Product Image Flipper"在悬停时翻转图像。 它在产品类别页面上完美运行,但不在主页上。

如何在主页上翻转图像?

我正在显示主页模板,它显示以下部分:
" New In" ," On Sale"," Bestsellers"
当我将鼠标悬停在它们上面时,我希望图像像在产品类别页面上一样翻转。

插件的代码如下:

 <?php
/*
Plugin Name: WooCommerce Product Image Flipper
Plugin URI: 
Version: 0.4.0
Description: Adds a secondary image on product archives that is revealed on hover. Perfect for displaying front/back shots of clothing and other products.
Author: jameskoster
Author URI: 
Text Domain: woocommerce-product-image-flipper
Domain Path: /languages/

License: GNU General Public License v3.0
License URI:
*/

/**
 * Check if WooCommerce is active
 */
if ( in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', get_option( 'active_plugins' ) ) ) ) {

    /**
     * Localisation (with WPML support)
     */
    add_action( 'init', 'plugin_init' );
    function plugin_init() {
        load_plugin_textdomain( 'woocommerce-product-image-flipper', false, dirname( plugin_basename( __FILE__ ) ) . '/languages' );
    }


    /**
     * Image Flipper class
     */
    if ( ! class_exists( 'WC_pif' ) ) {

        class WC_pif {

            public function __construct() {
                add_action( 'wp_enqueue_scripts', array( $this, 'pif_scripts' ) );
                add_action( 'woocommerce_before_shop_loop_item_title', array( $this, 'woocommerce_template_loop_second_product_thumbnail' ), 11 );
                add_filter( 'post_class', array( $this, 'product_has_gallery' ) );
            }


            /**
             * Class functions
             */

            public function pif_scripts() {
                if ( apply_filters( 'woocommerce_product_image_flipper_styles', true ) ) {
                    wp_enqueue_style( 'pif-styles', plugins_url( '/assets/css/style.css', __FILE__ ) );
                }
            }

            public function product_has_gallery( $classes ) {
                global $product;

                $post_type = get_post_type( get_the_ID() );

                if ( ! is_admin() ) {

                    if ( $post_type == 'product' ) {

                        $attachment_ids = $this->get_gallery_image_ids( $product );

                        if ( $attachment_ids ) {
                            $classes[] = 'pif-has-gallery';
                        }
                    }
                }

                return $classes;
            }


            /**
             * Frontend functions
             */
            public function woocommerce_template_loop_second_product_thumbnail() {
                global $product, $woocommerce;

                $attachment_ids = $this->get_gallery_image_ids( $product );

                if ( $attachment_ids ) {
                    $attachment_ids     = array_values( $attachment_ids );
                    $secondary_image_id = $attachment_ids['1'];

                    $secondary_image_alt = get_post_meta( $secondary_image_id, '_wp_attachment_image_alt', true );
                    $secondary_image_title = get_the_title($secondary_image_id);

                    echo wp_get_attachment_image(
                        $secondary_image_id,
                        'shop_catalog',
                        '',
                        array(
                            'class' => 'secondary-image attachment-shop-catalog wp-post-image wp-post-image--secondary',
                            'alt' => $secondary_image_alt,
                            'title' => $secondary_image_title
                        )
                    );
                }
            }


            /**
             * WooCommerce Compatibility Functions
             */
            public function get_gallery_image_ids( $product ) {
                if ( ! is_a( $product, 'WC_Product' ) ) {
                    return;
                }

                if ( is_callable( 'WC_Product::get_gallery_image_ids' ) ) {
                    return $product->get_gallery_image_ids();
                } else {
                    return $product->get_gallery_attachment_ids();
                }
            }

        }


        $WC_pif = new WC_pif();
    }
}

0 个答案:

没有答案