Increase columns for upsells and cross-sells products - Support

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

Author

Posts
January 5, 2019 at 2:00 am #1050148
tremblayly
Participant
Hi
I found the following topic: https://kriesi.at/support/topic/increase-columns-for-cross-sells-products/ that provides a way to do this.

I implemented the change in my child theme’s function.php and styles.css files by using the same code for upsells and cross-sells but changing the filter names for the upsells products. It does not appear to work.

Here’s a link a to a product that contains upsells: https://silviafindings.com/product/spring-ring-clasp-sterling-silver-closed-jump-ring-5-5mm-heavy
Here’s a link to a product you can add to your cart that contains cross-sells: https://silviafindings.com/product/leaf-charm-sterling-silver-23-mm-x-9-mm-x-1-7mm

Here’s what I have added to my functions.php file:
```
/*  increase # of columns of cross-sells products */
remove_filter('woocommerce_cross_sells_total', 'avia_woocommerce_cross_sale_count', 10);
remove_filter('woocommerce_cross_sells_columns', 'avia_woocommerce_cross_sale_count', 10);

add_filter('woocommerce_cross_sells_total', 'avia_woocommerce_cross_sale_count_mod', 21);
add_filter('woocommerce_cross_sells_columns', 'avia_woocommerce_cross_sale_count_mod', 21);

function avia_woocommerce_cross_sale_count_mod($count)
{
	return 5;
}

/*  increase # of columns of upsells products */
remove_filter('woocommerce_upsells_total', 'avia_woocommerce_up_sale_count', 10);
remove_filter('woocommerce_upsells_columns', 'avia_woocommerce_up_sale_count', 10);

add_filter('woocommerce_upsells_total', 'avia_woocommerce_up_sale_count_mod', 21);
add_filter('woocommerce_upsells_columns', 'avia_woocommerce_up_sale_count_mod', 21);

function avia_woocommerce_up_sale_count_mod($count)
{
	retu
```
Here’s what my styles.css has:
/* customize cross-sells/upsells 5 columns and H2 font size*/
#top .products columns-5 div .products .product {
width: 18.6%!important;
}

Any help wold be greatly appreciated.
Thanks
Lyse
January 8, 2019 at 9:28 pm #1051493

Basilis
Inactive Moderator

Hey tremblayly,

Unfortunately, it would require quite some time and customization of the theme to achieve this, so I am sorry to tell you that this is not covered by our support. However, if it’s really important for you to get this done, you can always hire a freelancer to do the job for you :)

Best regards,
Basilis

January 8, 2019 at 9:40 pm #1051501

tremblayly
Participant

Hi Basilis,

I’m already half there and the solution was provided to another customer. So can someone help me.

Thanks
Lyse

January 9, 2019 at 6:02 pm #1051965

Victoria
Inactive Moderator

Hi Lyse,

Here is the link for you

Change number of upsells output

woocommerce.com/document/change-number-of-upsells-output/embed/#?secret=CLlBxGb6mq" data-secret="CLlBxGb6mq" width="600" height="338" title="“Change number of upsells output” — <a href="https://automattic.pxf.io/y2XdbN/" target="_blank" rel="nofollow">WooCommerce</a> Docs" frameborder="0" marginwidth="0" marginheight="0" scrolling="no">

And here is the code to take a look in /enfold/config-woocommerce/config.php

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

January 9, 2019 at 6:16 pm #1051976

tremblayly
Participant

Hi Victoria,

Thank you for the links. They are useful. I had tried that code snippet before but it didn’t work. I added it again and still I don’t see my 5 columns.

You can see here
http://silviafindings.staging.wpengine.com/product/spring-ring-clasp-sterling-silver-closed-jump-ring-5-5mm-heavy (hosted on WPengine)

Any idea why this would not work?

Thanks
Lyse

January 12, 2019 at 2:12 pm #1053069

Victoria
Inactive Moderator

Hi Lyse,

Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

Best regards,
Victoria

January 12, 2019 at 4:17 pm #1053149

tremblayly
Participant

Hi Victoria

I have since added the cross-sells and upsells on my live site.

upsell: https://silviafindings.com/product/leaf-charm-sterling-silver-23-mm-x-9-mm-x-1-7mm
cross-sell: https://silviafindings.com/product/spring-ring-clasp-sterling-silver-closed-jump-ring-5-5mm-heavy

I’ve include the temporary credentials below.

Thanks
Lyse

January 16, 2019 at 7:48 pm #1054666

Basilis
Inactive Moderator

Hi,

I cant login with the password, can you please check further?

Best regards,
Basilis

January 16, 2019 at 7:54 pm #1054673

tremblayly
Participant

Hi Basilis,

I have resetted the password. Please try now.

Lyse

January 22, 2019 at 1:03 am #1056951

Basilis
Inactive Moderator

Hi,

It seems that the function is not executing properly. Do allow us some more time.

Best regards,
Basilis

January 22, 2019 at 6:39 am #1057043

tremblayly
Participant

Hi Basilis
No problem
Lyse

January 23, 2019 at 1:57 am #1057534

Basilis
Inactive Moderator

Hi,

Thank u!

Best regards,
Basilis

February 5, 2019 at 7:24 pm #1063268

tremblayly
Participant

Hi
Any progress on this issue?
Thanks
Lyse

February 11, 2019 at 5:23 am #1065282

Ismael
Moderator

Hi,

I would like to apologize for the late response.
I edited the css code a bit to adjust the width of the columns. (see private field)

Best regards,
Ismael

February 11, 2019 at 5:45 pm #1065528

tremblayly
Participant

Hi Ismael,

Can you please tell me where you modified the CSS so I can make sure to update my local copy. I’ve been editing the CSS just yesterday for other changes I’m making, and I can’t see where you made the changes and I don’t want to overwrite what you did to fix my issue.

Also, I don’t see it working at all for the cross-sells product here: https://silviafindings.com/product/leaf-charm-sterling-silver-23-mm-x-9-mm-x-1-7mm

Thanks
Lyse

February 13, 2019 at 4:29 am #1066211
Ismael
Moderator
Hi,

I just added this code in the Quick CSS field.
```
#top .product_column_4 .products .product {
    margin: 0 1% 1% 0;
    width: 18.6%;
}
```
I can see that its working in the cross-sell product. Please purge the cache prior to checking the page.

Best regards,
Ismael
February 13, 2019 at 6:17 pm #1066571

tremblayly
Participant

Hi Ismael,

I have restarted my PC and still the following cross-sells don’t seem to display correctly after that.

On initial loading of the page, the products display 3 on the first line, then next 2 on the next line
After refreshing the page, the products display as seen on the following screenshot:
https://www.dropbox.com/s/k5jj522kaaonqni/Screenshot_2019-02-13%20Cart%20%C2%BB%20SilviaFindings.png?dl=0

Thanks for your patience….
Lyse

February 18, 2019 at 5:12 am #1068105

Ismael
Moderator

Hi,

Thanks for the update.

Could you give us a link to that product? This is what I see on my end.

Screenshot: https://imgur.com/a/iQhnUmZ

Best regards,
Ismael

February 18, 2019 at 6:14 am #1068133

tremblayly
Participant

Hi Ismael
The cross sells appear in your cart, so you need to add this product to your cart to see.

Lyse

February 20, 2019 at 6:48 am #1069276
Ismael
Moderator
Hi,

Ah, yes. I can see it now. Please add this css code.
```
div.cross-sells .products .product {
    margin: 0 1% 1% 0;
    width: 18.6%;
}
```
Best regards,
Ismael
Author

Posts

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

You must be logged in to reply to this topic.