[Support request] woocommerce category display layout including description

Home Forums Support [Support request] woocommerce category display layout including description

Home Forums Support woocommerce category display layout including description

Viewing 15 posts - 1 through 15 (of 27 total)
  • Author
    Posts
  • #1573799
    John MacKenzie

    if i add in the description to showing in the woocommerce settings in customizer it does some weird stiff and puts the menus on the right.

    i want it to look more like the link from the original page, Title above the description then add to cart buttons on right.

    Thanks!
    John

    #1573813
    Elvin
    Staff
    Customer Support

    Hi,

    if i add in the description to showing in the woocommerce settings in customizer it does some weird stiff and puts the menus on the right.

    I’m not exactly sure I get the whole picture. Can you provide screenshots of what’s occuring?

    Or perhaps revert to the setting that makes the issue happen so we could check.

    Let us know.

    A wise man once said:
    "Have you cleared your cache?"

    #1573823
    John MacKenzie

    thanks i enabled short description in the customizer and it makes the filers pop over to the right. but short description isnt want i want added i want the proper description added?
    Thanks!

    #1574127
    David
    Staff
    Customer Support

    Hi there,

    thats not a default feature of Woocommerce. They actually sell an extension to provide that feature. But you can hook in the description using this PHP Snippet:

    add_action( 'woocommerce_after_shop_loop_item_title', 'woo_shop_long_description' );
    function woo_shop_long_description() {
    	global $product;
    
    	?>
            <div itemprop="description">
                <?php echo apply_filters( 'the_content', $product->post->post_content ) ?>
            </div>
    	<?php
    }
    #1575237
    John MacKenzie

    thanks but it shows the whole description not the more… like our current site. here is the code from the page content-product on the current theme which i assume is driving that page.

    but ive tried to edit the default version with some of this code without success

    thanks!

    
    if ( ! defined( 'ABSPATH' ) ) {
    	exit; // Exit if accessed directly
    }
    
    global $product, $woocommerce_loop;
    
    // Store loop count we're currently on
    if ( empty( $woocommerce_loop['loop'] ) ) {
    	$woocommerce_loop['loop'] = 0;
    }
    
    // Store column count for displaying the grid
    if ( empty( $woocommerce_loop['columns'] ) ) {
    	$woocommerce_loop['columns'] = apply_filters( 'loop_shop_columns', 4 );
    }
    
    // Ensure visibility
    if ( ! $product || ! $product->is_visible() ) {
    	return;
    }
    
    // Increase loop count
    $woocommerce_loop['loop']++;
    
    // Extra post classes
    $classes = array();
    if ( 0 == ( $woocommerce_loop['loop'] - 1 ) % $woocommerce_loop['columns'] || 1 == $woocommerce_loop['columns'] ) {
    	$classes[] = 'first';
    }
    if ( 0 == $woocommerce_loop['loop'] % $woocommerce_loop['columns'] ) {
    	$classes[] = 'last';
    }
    
    // Bootstrap Column
    $kt_woo_grid_column = kt_option('kt_woo_grid_column',3);
    $kt_woo_grid_column_tablet = kt_option('kt_woo_grid_column_tablet',2);
    $kt_woo_grid_column_mobile = kt_option('kt_woo_grid_column_mobile',1);
    
    // $bootstrapColumn = round( 12 / $woocommerce_loop['columns'] );
    // $classes[] = 'col-xs-12 col-md-' . $bootstrapColumn;
    
    $kt_woo_shop_sidebar_are = kt_option('kt_woo_shop_sidebar_are','left');
    
    $classes[] ='product-item';
    
    // Set columns
    $boostrap_columns_destop = round( 12 / $kt_woo_grid_column );
    
    $classes[] = 'col-md-'.$boostrap_columns_destop;
    
    $kt_woo_ipad_grid_column = round( 12 / $kt_woo_grid_column_tablet );
    $classes[] = 'col-sm-'.$kt_woo_ipad_grid_column;
    
    $kt_woo_mobile_grid_column = round( 12 / $kt_woo_grid_column_mobile );
    
    $classes[] = 'col-xs-'.$kt_woo_mobile_grid_column;
    
    // if( $kt_woo_shop_sidebar_are =="full"){
    //     $classes[] = 'col-sm-4';
    // }else{
    //     $classes[] = 'col-sm-6';
    // }
    
    ?>
    <li <?php post_class( $classes ); ?>>
        <div class="product-container">
    	<?php do_action( 'woocommerce_before_shop_loop_item' ); ?>
        	<div class="left-block">
                <?php
                woocommerce_show_product_loop_sale_flash();
                ?>
                <a href="<?php echo esc_url( get_permalink() ) ; ?>">
                    <?php
            			
            			echo woocommerce_get_product_thumbnail();
            		?>
                </a>
                <div class="quick-view">
                    <?php
            			/**
            			 * kt_loop_product_function hook
            			 *
            			 * @hooked kt_get_tool_wishlish - 1
                         * @hooked kt_get_tool_compare - 5
                         * @hooked kt_get_tool_quickview - 10
            			 */
            			do_action( 'kt_loop_product_function' );
            		?>
                </div>
                <?php
                    /**
                     * woocommerce_after_shop_loop_item hook
                     *
                     * @hooked woocommerce_template_loop_add_to_cart - 10
                     */
                    do_action( 'woocommerce_after_shop_loop_item' );
                ?>
            </div>
            <div class="right-block">
                <?php
                // $product_name = get_the_title();
                // if( strlen( $product_name ) > 25 ) {
                //     $product_name = substr( $product_name, 0, 25);
                //     $product_name = trim( $product_name ) ."...";
                // }
                ?>
                <h5 class="product-name"><a title="<?php echo esc_attr( get_the_title() );?>" href="<?php the_permalink(); ?>"><?php the_title( ); ?></a></h5>
                <div class="content_price">
                    <?php
            			/**
            			 * woocommerce_after_shop_loop_item_title hook
        			     *
            			 * @hooked woocommerce_template_loop_price - 10
            			 */
            			do_action( 'kt_after_shop_loop_item_title' );
            		?>
                </div>
                <div class="info-orther">
                    <div class="product-desc"><?php echo apply_filters( 'woocommerce_short_description', $post->post_excerpt ) ?></div>
                </div>
            </div>
        </div>
    </li>
    
    #1575651
    David
    Staff
    Customer Support

    Where is that content entered on the Product – is that in the Short Description field ?

    #1576433
    John MacKenzie

    its taking the first part of the product description but stripping any bold and spacing formatting it looks like. but its also removing the very FIRST line from the product description…. odd and then only showing a snippet, not the whole description.

    thanks!

    #1577726
    Tom
    Lead Developer
    Lead Developer

    Your current theme is doing this:

    <?php echo apply_filters( 'woocommerce_short_description', $post->post_excerpt ); ?>

    So the adjusted code would be:

    add_action( 'woocommerce_after_shop_loop_item_title', 'woo_shop_long_description' );
    function woo_shop_long_description() {
    	global $product;
    
    	?>
            <div itemprop="description">
                <?php echo apply_filters( 'woocommerce_short_description', $post->post_excerpt ); ?>
            </div>
    	<?php
    }
    #1579284
    John MacKenzie

    thanks! i added that but nothing showing with with that code?

    cheers
    John

    #1580486
    Tom
    Lead Developer
    Lead Developer

    You could try changing $post->post_excerpt to $product->post_excerpt, although I’m not 100% that will do the trick. I just took a look at the code you shared and tried to pick out the important part.

    #1580622
    John MacKenzie

    thanks… hmm no love from that one either 🙁 any other ideas

    thanks a lot!

    John

    #1581591
    David
    Staff
    Customer Support

    OK so – what it looks like they are doing is extracting the Second Paragraph from the Full Description, we could try something like this:

    add_action( 'woocommerce_after_shop_loop_item', 'woo_shop_long_description', 5 );
    function woo_shop_long_description() {
        if (is_shop() || is_product_category() || is_product_tag()) {
        global $product;
        $html = apply_filters( 'the_content', $product->post->post_content );
        $html_pieces = explode('<p>', $html);
        $description = strip_tags($html_pieces[2]);
        ?>
        <div itemprop="description">
            <?php echo $description; ?>
        </div>
        <?php
        }
    }
    #1582311
    John MacKenzie

    thanks thats looking pretty good. How can we get the columns like the old site as well so its

    photo description Price and add to cart button

    Thanks!
    John

    #1582366
    John MacKenzie

    oh and how do i STOP the new description from showing on the related products widget at the bottom of product pages.

    thanks

    #1582586
    David
    Staff
    Customer Support

    I have updated the code here

    This should only display the description on shop and archive pages.
    Strip the bold tag from the description and place it outside of the main container link, before the Cart function.

    Make that change then i can look at fixing the layout.

Viewing 15 posts - 1 through 15 (of 27 total)
  • You must be logged in to reply to this topic.