A few customization questions

Resolved tipsyhues
(@tipsyhues)

1 year, 2 months ago

Hi all, I have a few questions that I hope someone can help me with:

On product pages, how can I disable image zoom? Also, is there a way to change “Description” to read “Details,” and to make that heading font smaller (without changing the sitewide heading font size)?

On the cart page, can the “Shipping” block be hidden? We book services and sell products in-store or for pickup only, so there’s no need for a shipping field.

Theme: Caretaker

The page I need help with: [log in to see the link]

Viewing 13 replies - 1 through 13 (of 13 total)

Afzal (woo-hc)
(@afzalpansuvi)

1 year, 2 months ago
Hi @tipsyhues,

Thank you for contacting WordPress.com support. I understand you are looking to make multiple changes. This can be done by adding custom CSS code to your site. Please use the following CSS code:
```
/*To disable image zoom*/
img.zoomImg {
    display: none !important;
}

/*To change Description text and size*/
div#tab-description > h2 {
    color: white;
}

div#tab-description > h2:after {
    content: "Details";
    color: red;
    position: absolute;
    left: 20px;
    font-size: 25px;
}

/*Hide shipping” block*/
.wp-block-woocommerce-cart-order-summary-shipping-block.wc-block-components-totals-wrapper {
    display: none !important;
}
```
To apply this code to your website, you follow the detailed guide here.

Let us know if there’s anything else we can help you with.
Thread Starter tipsyhues
(@tipsyhues)

1 year, 2 months ago

Thanks @afzalpansuvi

Your solution worked; I just made a couple adjustments to it and was able to change the font and disable image zoom. The shipping block did disappear from the cart, but the option still shows up on the checkout page. I’m guessing there’s a more complex fix to altering the checkout flow.
Afzal (woo-hc)
(@afzalpansuvi)

1 year, 2 months ago
Hi @tipsyhues,

Thanks for getting back to us. Glad to know that the CSS code I prvoided worked. To hide the Shipping section on the checkout page please add the below CSS code:
```
/*Hide shipping section on checkout*/
.wp-block-woocommerce-checkout-order-summary-shipping-block.wc-block-components-totals-wrapper {
    display: none !important;
}
```
Please give it a try and let us know how it goes.
Thread Starter tipsyhues
(@tipsyhues)

1 year, 2 months ago

@afzalpansuvi while it does hide the section, it still shows the option to ship. That could cause confusion if customers are led to believe shipping may be available when seeing that option.

Plugin Support Shameem – a11n
(@shameemreza)

1 year, 2 months ago

Hi @tipsyhues

This is expected behaviour for physical products. However, there’s a simple solution. If you mark the product as virtual, the shipping section and lists will hide automatically. The best part? You won’t need to add any extra code to accomplish this.

I hope this helps! If you have any other questions, feel free to ask.

Thread Starter tipsyhues
(@tipsyhues)

1 year, 2 months ago

@shameemreza I tried that too, but some of my products have variants and the virtual option is not available for products with variants.

Plugin Support Shameem – a11n
(@shameemreza)

1 year, 2 months ago

Hi @tipsyhues

You can mark any variants as virtual and downloadable.

However, in addition to marking it as virtual, you might need to use an additional custom code, as shared here.

I hope this helps! Please try that code snippet and let us know how it goes or if you need further assistance.

Thread Starter tipsyhues
(@tipsyhues)

1 year, 2 months ago

@shameemreza that worked, the shipping option is completely gone, didn’t even need the additional code. Now I just have to ensure that people who visit our site who are not local know that we do not ship, since that removed the pickup option too. I’m thinking I can add a text-block statement on the checkout page with pickup instructions.

Thank you!

Plugin Support Shameem – a11n
(@shameemreza)

1 year, 2 months ago

Hi @tipsyhues

I’m glad to hear that marking your product variants as virtual worked for you!

I’m thinking I can add a text-block statement on the checkout page with pickup instructions.

It’s indeed a great idea. You can include a clear message indicating that you do not offer shipping services and provide detailed pickup instructions.

Additionally, you may also consider including this information on your product pages as well, to ensure that customers are aware of your shipping policies before they reach the checkout stage.

I hope this helps! If you have any other questions, feel free to ask.

Thread Starter tipsyhues
(@tipsyhues)

1 year, 2 months ago

One more question, the solution @afzalpansuvi came up with disabled image hover zoom, but it still shows that magnifying glass on top of the picture. How do I disable image click as well?

See what I mean here: Gift Cards – Tipsy Hues

Thread Starter tipsyhues
(@tipsyhues)

1 year, 2 months ago

Nevermind, I figured it out 🙂

Plugin Support Shameem – a11n
(@shameemreza)

1 year, 2 months ago

Hi @tipsyhues

That’s great to hear! Thanks for letting us know. Should you have further inquiries, kindly create a new topic here.

Meanwhile, if it isn’t too much to ask for – would you mind leaving us a review here?

It only takes a couple of minutes but helps us tremendously. It would mean so much to us and would go a really long way.

Thanks!

Thread Starter tipsyhues
(@tipsyhues)

1 year, 2 months ago

@shameemreza will do, thank you for your help!