Home Forums WoodMart support forum Breadcumbs

Breadcumbs

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #44651

    Kahan Ryan
    Participant

    I want to put the page Breadcumbs on the product image. . I want to make the background color of Breadcumbs like wayfair product page.

    #44660

    Artem Temos
    Keymaster

    Hi,

    Please, send us a link to your current product page so we can see if it is possible.

    Regards

    #44716

    Kahan Ryan
    Participant

    here is my link

    #44797

    Artem Temos
    Keymaster

    Hello,

    Try to create a file in your child theme woodmart-child/woocommerce/content-single-product.php and place the following code inside it

    <?php
    /**
     * The template for displaying product content in the single-product.php template
     *
     * Override this template by copying it to yourtheme/woocommerce/content-single-product.php
     *
     * @author 		WooThemes
     * @package 	WooCommerce/Templates
     * @version     3.0.0
     */
    
    if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
    
    $product_images_class  	= woodmart_product_images_class();
    $product_summary_class 	= woodmart_product_summary_class();
    $single_product_class  	= woodmart_single_product_class();
    $content_class 			= woodmart_get_content_class();
    $product_design 		= woodmart_product_design();
    
    $container_summary = 'container';
    
    if( woodmart_get_opt( 'single_full_width' ) ) {
    	$container_summary = 'container-fluid';
    }
    
    ?>
    
    <div class="single-breadcrumbs-wrapper">
    	<div class="container">
    		<?php woocommerce_breadcrumb(); ?>
    		<?php if ( woodmart_get_opt( 'products_nav' ) ): ?>
    			<?php woodmart_products_nav(); ?>
    		<?php endif ?>
    	</div>
    </div>
    
    <div class="container">
    	<?php
    		/**
    		 * woocommerce_before_single_product hook
    		 *
    		 * @hooked wc_print_notices - 10
    		 */
    		 do_action( 'woocommerce_before_single_product' );
    
    		 if ( post_password_required() ) {
    		 	echo get_the_password_form();
    		 	return;
    		 }
    
    	?>
    </div>
    <div id="product-<?php the_ID(); ?>" <?php post_class( $single_product_class ); ?>>
    
    	<div class="<?php echo esc_attr( $container_summary ); ?>">
    
    		<div class="row product-image-summary-wrap">
    			<div class="product-image-summary <?php echo esc_attr( $content_class ); ?>">
    				<div class="row product-image-summary-inner">
    					<div class="<?php echo esc_attr( $product_images_class ); ?> product-images">
    						<div class="product-images-inner">
    							<?php
    								/**
    								 * woocommerce_before_single_product_summary hook
    								 *
    								 * @hooked woocommerce_show_product_sale_flash - 10
    								 * @hooked woocommerce_show_product_images - 20
    								 */
    								do_action( 'woocommerce_before_single_product_summary' );
    							?>
    						</div>
    					</div>
    					<div class="<?php echo esc_attr( $product_summary_class ); ?> summary entry-summary">
    						<div class="summary-inner">
    							<?php
    								/**
    								 * woocommerce_single_product_summary hook
    								 *
    								 * @hooked woocommerce_template_single_title - 5
    								 * @hooked woocommerce_template_single_rating - 10
    								 * @hooked woocommerce_template_single_price - 10
    								 * @hooked woocommerce_template_single_excerpt - 20
    								 * @hooked woocommerce_template_single_add_to_cart - 30
    								 * @hooked woocommerce_template_single_meta - 40
    								 * @hooked woocommerce_template_single_sharing - 50
    								 */
    								do_action( 'woocommerce_single_product_summary' );
    							?>
    						</div>
    					</div>
    				</div><!-- .summary -->
    			</div>
    
    			<?php 
    				/**
    				 * woocommerce_sidebar hook
    				 *
    				 * @hooked woocommerce_get_sidebar - 10
    				 */
    				do_action( 'woocommerce_sidebar' );
    			?>
    
    		</div>
    		
    		<?php
    			/**
    			 * woodmart_after_product_content hook
    			 *
    			 * @hooked woodmart_product_extra_content - 20
    			 */
    			do_action( 'woodmart_after_product_content' );
    		?>
    
    	</div>
    
    	<div class="product-tabs-wrapper">
    		<div class="container">
    			<div class="row">
    				<div class="col-sm-12 poduct-tabs-inner">
    					<?php
    						/**
    						 * woocommerce_after_single_product_summary hook
    						 *
    						 * @hooked woocommerce_output_product_data_tabs - 10
    						 * @hooked woocommerce_upsell_display - 15
    						 * @hooked woocommerce_output_related_products - 20
    						 */
    						do_action( 'woocommerce_after_single_product_summary' );
    					?>
    				</div>
    			</div>	
    		</div>
    	</div>
    
    	<?php
    		do_action( 'woodmart_after_product_tabs' );
    	?>
    
    </div><!-- #product-<?php the_ID(); ?> -->
    
    <?php do_action( 'woocommerce_after_single_product' ); ?>

    Add the following CSS code to the custom CSS section in Theme Settings

    .single-breadcrumbs-wrapper {
        margin-bottom: 20px;
        padding-bottom: 5px;
        padding-top: 10px;
        margin-top: -40px;
        background: #f4f4f4;
    }

    Regards

    #44939

    Kahan Ryan
    Participant

    thank you back

    my theme is not child theme. should i use child theme

    #44943

    Artem Temos
    Keymaster

    You can edit it in the parent theme but then you will lose changes after the update.

    #44985

    Kahan Ryan
    Participant

    how to my site turn child theme instead parent theme

    #45020

    Artem Temos
    Keymaster

    You can download the child theme from ThemeForest in your account and install it via Appearance -> Themes as a regular theme.

    #45110

    Kahan Ryan
    Participant

    I activated the child theme. but the theme is not active in the css code. How do I confirm that the child theme is active?

    Attachments:
    You must be logged in to view attached files.
    #45115

    Artem Temos
    Keymaster

    Yes, the child theme is activated https://gyazo.com/78c0674abaa48416b096bc5ab8592410

    #45119

    Kahan Ryan
    Participant

    ok

    woodmart-child/woocommerce/content-single-product.php

    there is no woocommerce filen child theme file

    should i create woocommerce then change and put code /content-single-product.php

    #45141

    Kahan Ryan
    Participant

    ok i did it

    Thank you

Viewing 12 posts - 1 through 12 (of 12 total)

The topic ‘Breadcumbs’ is closed to new replies.