Return to previous page

Off-Canvas Cart and Wishlist Customization

This topic has 6 replies, 3 voices, and was last updated 3 months, 3 weeks ago ago by Luca Rossi

Drishti

Participant

October 9, 2024 at 21:50

Hi,
I would like to request assistance with customizing the off-canvas cart and wishlist features on my website. Here are the specific adjustments I need:

1) Disable Page Scrolling:

When the cart or wishlist opens in the sidebar (please see the attached screenshot), I want to prevent scrolling on the main page. The page should remain fixed until the cart or wishlist is closed.

2) Product Title and Image Customization:

I would like the product headings to be displayed in the Poppins font at 17px size.
Additionally, I want to reduce the gap between the product picture and the product title.
Please add a border-radius of 8px to the product images for a more rounded appearance.

Thank you for your assistance, and please let me know if you require any further information or clarification.

Files is visible for topic creator and
support staff only.

#418053 Copied Theme version: 9.4.2

5 Answers
Luca Rossi

Support staff

October 11, 2024 at 05:51
Dear Drishti,

We hope this message finds you well.

1. Kindly try adding the following custom CSS code by navigating to **XStore > Theme Options > Theme Custom CSS > Global CSS**:

body.etheme-elementor-off-canvas--shown { overflow: hidden !important; }

2. Additionally, to modify the styles of the Products Grid on your homepage, please follow these steps:
– Open your homepage in **Elementor** for editing.
– Inspect the **Products Grid** element.
– Under the **Style** tab, scroll down to the **Title & Image** section, where you can adjust the styles as per your preferences.

For your reference, here are some helpful screenshots:
– [Screenshot 1](https://prnt.sc/sjTS1pye6DGe)
– [Screenshot 2](https://prnt.sc/_KGbS9y9rqaY)

Should you need any further assistance, please don’t hesitate to reach out.

Best regards,
The 8Theme Team
#418228 Copied
Drishti

Participant

October 11, 2024 at 09:55

Thank you for your response, but I believe there’s been a misunderstanding regarding my second request.

I am specifically asking for assistance with customizing the product title and image in the off-canvas cart and wishlist sections, not the homepage products grid. I would like to:

i) Change the product title font to Poppins at 17px.
ii) Reduce the gap between the product image and title.
iii) Add a border-radius of 8px to the product images to give them a rounded appearance.

Could you please provide guidance on how to make these changes within the off-canvas cart and wishlist, rather than the homepage grid?

Looking forward to your assistance.

#418270 Copied
Luca Rossi

Support staff

October 12, 2024 at 15:00
Hi @Drishti,

Could you please add this custom CSS codes under XStore > Theme Options > Theme Custom CSS > Global CSS?

.product_list_widget li .product-title a { font-size: 17px; } .cart-widget-products .product-mini-image { margin-right: 10px; border-radius: 8px !important;!i;!;!;!I; overflow: hidden; }

Hope it helps!
#418399 Copied
Roy Al

Participant

October 28, 2024 at 16:26

I am also having this issue…i have tried the code you provided in this reply section , still the page scrolling issue not resolved….and the minicart is also overlapping with my sticky buy now button

Files is visible for topic creator and
support staff only.

#420739 Copied

Luca Rossi

Support staff

October 29, 2024 at 06:10

Dear @Roy Al,

We kindly request that you create a separate topic and provide the website URL along with the WordPress admin credentials (username and password) so that we can conduct a more detailed review.

Thank you for your cooperation.

Best regards,
8Theme Team

#420800 Copied
Tagged: advanced cart features, customizable wishlist woocommerce, optimized wordpress themes, premium woocommerce templates, user-friendly wordpress templates, woocommerce off-canvas cart, wordpress wishlist customization
Viewing 6 results - 1 through 6 (of 6 total)