- This topic has 11 replies, 2 voices, and was last updated 3 years, 5 months ago by David.
-
AuthorPosts
-
October 29, 2020 at 11:05 pm #1510473melvin wang
Hi,
I’m using Woocmmerce Product Shortcode in one of my page.
I would like to kindly seek for your help, how could I make the products display in horizontal Scroll like below – sample site for reference .
Thank you.
Regards,
MelvinOctober 30, 2020 at 4:18 am #1510706DavidStaffCustomer SupportHi there,
you would need a plugin for that – there are a few plugins on wordpress repository – have a search for Product Carousel or Product Slider
Heres an example one which looks to have the most installs and higher reviews:
November 1, 2020 at 10:57 pm #1514038melvin wangHi David,
Thanks for your response.
I’ve tried to use plugins, there’s still some shortcomings of the plugins
1. https://wordpress.org/plugins/woo-product-slider/ – limitation on filter (only able to filter category or tag, or attribute. Can’t filter with “AND” like original woocommerce product short code does)
2. https://wordpress.org/plugins/woocommerce-products-slider/ – this is kind of close, however the layout wasn’t as good and nice as generatepress, and Google Page Speed drops after I use this plugin.
3. My concern will be the use of plugin. If possible i wish to achieve the product horizontal scroll without plugin due to performance concer.As Such,
I would like to kindly ask if is it possible to achieve the product horizontal scroll in GPP using some sort of CSS hack? this is the closest info I foundLooking forward for your response.
Thank you.
Regards,
MelvinNovember 2, 2020 at 8:19 am #1514784DavidStaffCustomer SupportIt is possible with some CSS – however it can create more issues on a mobile device, as you are changing its tap target in order to scroll. This may lead to the user having to tap the product more than once to get it to open, or in some cases it may not work at all. It can create a very frustrating UI that i would not recommend.
November 4, 2020 at 6:14 am #1517561melvin wangHi David,
Noted. Thanks for your advice. I will just check out plugin instead. Have a nice day 🙂
November 4, 2020 at 6:48 am #1517614DavidStaffCustomer SupportYou’re welcome
November 13, 2020 at 1:07 am #1529411melvin wangHi David,
Thanks for your recommendation, I’ve found the plugin [WCPS] that’s very close to my needs. Here’s my test. I would like to see for your help, which is making a horizontal bar like below
Remark: The horizontal bar [grey short to the left] at first will appear at the bottom even without scroll. – So user can know that this is scrollable 🙂
Can you guide me what CSS shall I insert to get the same horizontal bar effect?
TQ
Regards,
MelvinNovember 13, 2020 at 4:59 am #1529617DavidStaffCustomer SupportThat would be something you would need to ask the plugin developer.
But if you can link me to where i can see the Product carousel i’ll take a look to see if there is a simple ‘fix’November 13, 2020 at 5:12 am #1529632melvin wangHi David,
Thanks for your reply
Here’s the link https://cool.relaxbee.com/3d2n-langkawi-island-hopping-package/#wcps
See if there’s a simple fix
Thanks
Melvin
November 13, 2020 at 7:38 am #1530038DavidStaffCustomer SupportUnfortunately there isn’t a simple fix.
I did find this issue on the OwCarousel github:https://github.com/OwlCarousel2/OwlCarousel2/issues/1240
Seems people have asked for it. But nothing yet implemented.
The plugin developer may have some insight on the last users comment on that Git. Alternatively they may be able to enable the Dot Navigation that Owl does support.
November 16, 2020 at 9:53 pm #1534136melvin wangHi David,
Thanks for your kind support.
I enabled the dot navigation. It just looked so wrong haha.
Anyway I will try to figure out other ways.
Thanks for the support
Have a nice day David.
Regards,
MelvinNovember 17, 2020 at 2:31 am #1534346DavidStaffCustomer SupportYou’re welcome
-
AuthorPosts
- You must be logged in to reply to this topic.