How not to use `owl-wrapper` for product detail pages

General General Questions
1

I’m trying to create a template for a product detail page that displays all the images in a grid, not an owl-wrapper owlcarousel form. How can I remove the owl-wrapper class automatically? add ? Any guidance and help is appreciated

2

this was bard answer, has a habit of getting things wrong ,but may give you pointers
There are two main ways to achieve a product detail page with a grid layout for images in CS-Cart, removing the owl-carousel functionality:

1. Modifying the Theme Template:

This approach requires editing the theme template file responsible for displaying product images. Here’s a general guideline:

  • Access your CS-Cart admin panel.
  • Navigate to Design > Themes.
  • Choose the theme you’re working with and click Design.
  • Locate the template file responsible for product details. This might be named something like “product_details.tpl” or specific to your theme.

Finding the Code:

Within the template file, search for code sections including “owl-wrapper” or “owlcarousel”. This should lead you to the carousel functionality code.

Removing the Class:

There are two options depending on the code structure:

  • Option 1: If the images are wrapped in a <div> element with the class “owl-wrapper”, you can simply remove the entire <div> section.
  • Option 2: If the class “owl-wrapper” is applied directly to the image container, remove the class attribute or replace it with a class for your grid layout (e.g., “product-image-grid”).

Important Note: Editing theme template files directly can be overwritten during theme updates. Consider creating a child theme to isolate your changes.

2. Using Add-Ons:

Several CS-Cart add-ons offer alternative product image display options:

  • “Configurable Grid View” Add-on: allows customizing the product grid layout.
  • “Images gallery” Add-on by Cart-Power: provides a dedicated image gallery functionality you can style as a grid.

Recommendation:

If you’re comfortable with editing theme files, modifying the template offers more control. However, if you prefer a user-friendly approach and future updates compatibility, consider using an add-on.

Remember to clear your cache after making any changes for them to reflect on your storefront.

3 Likes
3

Thank you for your valuable time, I will try the methods you suggested.

4

I can’t find the owl-wrapper class and the

tag seems to be born from java, but if I delete the cm-preview-wrapper class it gives me a java error

5

really needs a dev that knows CS instead i think Ken

2 Likes
6

Any update on this? The forcing of owl-carousel is really annoying. It’s strange to me that there’s no config option to just turn it off. But it’s breaking my layout badly and aggressively.