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

    I’ve set added a WooCommerce Product Grid using the Avia builder, and set it to 5 columns.
    The first product appears on its own. The second line contains the other 4 products.

    My product list hasn’t been rendered with the correct first/last css classes for li.product items.

    I am running on PHP 7.3, Enfold 4.5.7 and WP 5.2.2.
    In the Chrome Inspector, simply moving the DOM element with class first to the top of the ul.products list fixes the layout issue. So I suggest this is potentially an issue in the way this grid is rendered.

    Please advise.

    #1112537

    Hey tech,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
    #av_section_7 .shop_columns_5 .products .product.first {
      clear: none;
    }
    

    If you need further assistance please let us know.
    Best regards,
    Victoria

    #1113213

    Hi Victoria,
    thank you for this quick fix.

    However it doesn’t work well. The right-margin for ‘last’ element makes the first product look inconsistent with the others. Have a look.
    Plus you’ve given me a very specific CSS rule which works only for this particular case. It is not future proof, it won’t work in other places or other column layouts (3 columns, 4 columns, etc..) and it will cause potential problems on mobile screens.

    The issue is that the rendering or the CSS of the Product Grid is not right.

    Can you escalate this issue to your developers and come back to me with an ETA please?

    Clement

    #1113350

    Hi Clement,

    We had this issue in one of the previous versions, however, it was fixed. You might want to reupdate your theme over FTP and make sure all files get overwritten, then the issue should be gone.

    Best regards,
    Victoria

    #1114906

    Hi,

    I’ve done a fresh download from Themeforest and reuploaded Version: 4.5.7.
    Problem still persists.

    Please can you advise?

    #1115552

    Hi tech,

    Please have a look at this thread

    Best regards,
    Victoria

    #1115715

    Hi Victoria,

    Thank you. Unfortunately, this thread is relating to an older version of the theme, probably 4.4.
    And when I checked the file in question: line 299/300 in enfold/config-templatebuilder/avia-shortcodes/productslider.php:
    in Enfold v4.5.7 the corresponding file is: line 490: enfold/config-templatebuilder/avia-shortcodes/productslider/productslider.php:

    And it already contains the fixes mentioned in the thread. Namely:

    			/**
    			 * @since WC 3.3.0 we have to reset WC loop counter otherwise layout might break
    			 */
    			if( function_exists( 'wc_reset_loop' ) )
    			{
    				wc_reset_loop();
    			}
    			
    			wp_reset_query();
    			return $output;

    Please can you investigate further

    #1116243

    Hi tech,

    Did you delete enfold folder when you uploaded a fresh copy? If not please, do so, and then install Enfold.

    Best regards,
    Victoria

    #1116637

    Hi Victoria,

    This is what I had done.
    But for sake of being extra cautious I have deleted the folder this morning and re-uploaded a fresh copy from themeforest.

    Still the issue remains.

    #1117210

    Hi,

    Can we do changes on the backend or the site is live?

    Best regards,
    Basilis

    #1117809
    This reply has been marked as private.
    #1120166

    Hi,

    Sorry for the late reply.

    The reason for the broken layout is that you put the layerslider in a codeblock element in a section.

    Use the ALB element, or codeblock outside a section – then the output is correct – see link to testpage in private content.

    Best regards,
    Günter

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