我正在使用WordPress与WooCommerce，我已经制作了一个自定义主题（可能是问题的一部分）但我已经基于默认的Wordpress主题 .

当我点击没有任何图片的产品页面时，布局很好，它显示一个空白的图片图像 .

然后，当我将图像添加到同一产品，刷新页面产品页面时，选项卡的布局样式将消失，而选项卡将显示为没有样式的文本 . 似乎 ::before 和 ::after 代码出现在"no image"标签上，但是当我添加图像时它们会消失！

图像的样式也会发生变化，大小变得疯狂，图像右侧没有填充，因此描述/ Headers /添加到购物车接触图像！

网站：http://frenchies-boutique.wadessolutions.com

该网站围绕Twenty Fifteen主题构建 .

single-product.php

<?php
/**
 * The Template for displaying all single products.
 *
 * Override this template by copying it to yourtheme/woocommerce/single-product.php
 *
 * @author      WooThemes
 * @package     WooCommerce/Templates
 * @version     1.6.4
 */

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

get_header( 'shop' ); ?>

<?php
/**
 * woocommerce_before_main_content hook
 *
 * @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
 * @hooked woocommerce_breadcrumb - 20
 */
do_action( 'woocommerce_before_main_content' );
?>

<?php while ( have_posts() ) : the_post(); ?>

    <?php wc_get_template_part( 'content', 'single-product' ); ?>

<?php endwhile; // end of the loop. ?>

<?php
/**
 * woocommerce_after_main_content hook
 *
 * @hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content)
 */
do_action( 'woocommerce_after_main_content' );
?>

<?php
/**
 * woocommerce_sidebar hook
 *
 * @hooked woocommerce_get_sidebar - 10
 */
do_action( 'woocommerce_sidebar' );
?>

<?php get_footer( 'shop' ); ?>

product-image.php

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

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

global $post, $woocommerce, $product;

?>
<div class="images">

    <?php
    if ( has_post_thumbnail() ) {

        $image_title    = esc_attr( get_the_title( get_post_thumbnail_id() ) );
        $image_caption  = get_post( get_post_thumbnail_id() )->post_excerpt;
        $image_link     = wp_get_attachment_url( get_post_thumbnail_id() );
        $image          = get_the_post_thumbnail( $post->ID, apply_filters( 'single_product_large_thumbnail_size', 'shop_single' ), array(
            'title' => $image_title,
            'alt'   => $image_title
        ) );

        $attachment_count = count( $product->get_gallery_attachment_ids() );

        if ( $attachment_count > 0 ) {
            $gallery = '[product-gallery]';
        } else {
            $gallery = '';
        }

        echo apply_filters( 'woocommerce_single_product_image_html', sprintf( '<a href="%s" itemprop="image" class="woocommerce-main-image zoom" title="%s" data-rel="prettyPhoto' . $gallery . '">%s</a>', $image_link, $image_caption, $image ), $post->ID );

    } else {

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

    }
    ?>

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

</div>

谢谢

css wordpress woocommerce