- This topic has 7 replies, 2 voices, and was last updated 5 years, 8 months ago by
.
This is a follow on from this ticket:
https://support.shufflehound.com/forums/topic/woocommerce-product-issues/#post-45978
I am having issues with columns and spacing, relating to Woocommerce. From the previous ticket thread I currently have the following custom CSS code on my website:
.woocommerce .woocomerce-styling ul.products li.first { padding-left: 0; } .woocommerce #page-container .woocomerce-styling ul.products li { padding-right: 0; width: 24%; }I am experiencing difficulty on the actual Shop page, as well as individual product pages.
Shop page (link)
It is supposed to have the left sidebar and then three columns, however only two columns show products and there is a blank column to the right. in the settings it is set to be three columns – I don’t understand why CSS code is needed to get this to work?
Also – I would prefer to have more spacing in between the sidebar and first column of products
Individual Products (link example)
Before the introduction of the CSS code, the individual product pages used to show an image to the left, and then details (price, size choice etc) to the right. Now they are on top of each other. Feels like a similar issue to the shop page?
Can you please advise
Hi @photobernard,
I hope you are well today and thank you for your questions.
It is supposed to have the left sidebar and then three columns, however only two columns show products and there is a blank column to the right. in the settings it is set to be three columns – I don’t understand why CSS code is needed to get this to work?
Could you please share me the screenshot of the whole screen where you have configured the settings to display three columns so that I can troubleshoot it?
Also – I would prefer to have more spacing in between the sidebar and first column of products
You can try achieving this using Yellow Pencil editor as described in the below page.
https://support.shufflehound.com/how-to-change-almost-any-element/
Before the introduction of the CSS code, the individual product pages used to show an image to the left, and then details (price, size choice etc) to the right. Now they are on top of each other. Feels like a similar issue to the shop page?
I have tested it on my test site and it’s working fine for me using latest version of Jevelin theme as displayed in the attached screenshot.
Please try temporarily removing the custom CSS code from your site and deactivating the fusion plugin.
Best regards,
Shufflehound teamCould you please share me the screenshot of the whole screen where you have configured the settings to display three columns so that I can troubleshoot it?
Please see screenshot below. I have played around with this – if I change it to 2 columns, then the products are shown in a single column, with this blank column still to the right.
Furthermore, if as per the screenshot I select 4 columns, and set “Woocommerse Layout” to default AND add in the CSS code, then it displays perfectly. But without the CSS code it doesn’t work – same problem with the blank column to the right.
I have tested it on my test site and it’s working fine for me using latest version of Jevelin theme as displayed in the attached screenshot.
Please try temporarily removing the custom CSS code from your site and deactivating the fusion plugin.
I have done this, and still I am seeing issues.
Ok then would you mind if I log in to your site and do some troubleshooting? If this is ok then could you please temporary share me your site admin log in details privately by adding them in the box having text “Enter your private content here (only you and forum moderators will be able see it)”?
Thanks – details attached
Solution for this topic
I logged into your site and saw the issue was caused due to Fusion : Plugin so I have disabled it.
Could you please check it now?
Thanks – the issue now seems to be resolved.
You are most welcome here 🙂
