Return to previous page

Customization on product page and category page.

This topic has 7 replies, 2 voices, and was last updated 5 years, 1 months ago ago by Olga Barlow

Thinktech

Participant

March 14, 2019 at 11:01

1.how to enable sale label icon on product page.
2.http://saibabamachines.com.cp-45.webhostbox.net/product/2sp-v420t-cnc-vtl new label is going out of an only in product page.
3.http://saibabamachines.com.cp-45.webhostbox.net/ the below newsletter text-field and button should be in one line.
4.how to arrange the category and products page
5.how to add diffent background image for breadcrumb for individual product and category page.

#210902 Copied Theme version: 4.5.2 WooCommerce version: 4.5.2

6 Answers
Olga Barlow

Support staff

March 14, 2019 at 11:44
Hello,

1. Theme Options > Shop > Enable “Sale” icon > On.
2. Find the following code in your custom CSS
```
.product-images {
    padding: 0;
}
```
and replace by
```
.single-product .product-images {
    padding: 0;
    overflow: hidden;
}
```
3) Add the following code to custom CSS
```
.mc4wp-form p {
    display: flex;
}
.mc4wp-form input[type="email"] {
    margin: 0;
}
```
4) Category page inherits the shop page layout and styles. You can find all the options available for the shop page in the Theme options > Shop & Products Page layout and also Appearance > Customize > WooCommerce.
5) Unfortunately, our theme does not have options to upload individual breadcrumbs image for the products and categories. Only for the simple pages ( http://prntscr.com/mxqhm9 )

Regards
#210908 Copied
Thinktech

Participant

March 14, 2019 at 13:40

1.Theme Options > Shop > Enable “Sale” icon > On.[How to Mark product as sale is not available in product page(in theme options >shop> i have enabled the sale icon)]
2.In quick view of product category page new label is not proper.
3.Category page inherits the shop page layout and styles. You can find all the options available for the shop page in the Theme options > Shop & Products Page layout and also Appearance > Customize > WooCommerce.(still not able to arrange the product pagesin custom)
4.Zoom effect of window is too big on this page http://saibabamachines.com.cp-45.webhostbox.net/product/2sp-v420t-cnc-vtl/

Please contact administrator
for this information.

#210917 Copied
Olga Barlow

Support staff

March 14, 2019 at 14:58
Hello,

1) Did you create any sale product? http://prntscr.com/mxtf9y
2) Improve the previous code
```
.quick-view-popup .product-content .row {
    padding: 0 15px;
}
.single-product .product-images, .quick-view-popup .product-images {
    overflow: hidden;
    padding: 0px;
}
```
3. What exactly are you trying to implement? Maybe theme or WooCommerce plugin do not have options to implement things you want. In this case, it could be done by additional customization or using third-party plugin. Could you describe in more details or provide the screenshot for better understanding.
4. Zoom window displays the source image. So, to have the zoom effect upload product image bigger than product image block, for example, the product image block is 746×640 http://prntscr.com/mxtma8 then your image should be 900px width at least to have zoom effect. If your images are smaller then we would recommend to disable the zoom effect in Theme Options > Single product > Zoom > Disable.

Regards
#210923 Copied
Olga Barlow

Support staff

March 14, 2019 at 15:08

P.S. Don’t forget to increase the default image size in Appearance > Customizer > WooCommerce > Product Images > Single product image to 746px and regenerate thumbnails after that.

Regards

#210924 Copied

Thinktech

Participant

March 15, 2019 at 07:59

1)No(i did but i dont want the add to cart section to be appeared).
2.Same code required for sale icon also.
3.want to arrange manually the product pages to be appeared in home page and product page.(for eg my last project page http://saibabamachines.com.cp-45.webhostbox.net/product/2sp-v420t-cnc-vtl/)
4.remove the send enquiry link of add-to-wishlist on product category (on home page and product page)
https://www.ithink.co/clients/saibaba/sen-enquiry.jpg
5.forms on product page and cateogry going out from sidebar
http://saibabamachines.com.cp-45.webhostbox.net/product/2sp-v420t-cnc-vtl/

#210952 Copied
Olga Barlow

Support staff

March 15, 2019 at 11:13
Hello,

1. If you don’t want to have the add to cart and cart widget then go to Theme Options > Shop > Just Catalog > on. And feel free to add prices.

2. Inspect

3. Replace all the previous code by the code below
```
.type-label-1 .new, .type-label-2 .sale {
    margin-top: 0;
    padding: 10px 0;
}
.type-label-1, .type-label-2 {
    transform: rotate(320deg);
    border-radius: 0;
    width: 140px;
    height: auto;
	
}
.content-product .type-label-1, 
.product-images .label-product .type-label-1,
.content-product .type-label-2, 
.product-images .label-product .type-label-2 {
    left: -30px;
    top: 15px;
    right: auto;
}
.gallery_vertical .label-product {
    float: left;
}
.quick-view-popup .product-content .row {
    padding: 0 15px;
}
.single-product .product-images, .quick-view-popup .product-images {
    overflow: hidden;
    padding: 0px;
}
.type-label-2 .sale {
    border:none
}
```
4. If you don’t want to have the Add to wishlist buttons then go to Plugins > Disable YITH Wishlist plugin.
5. Add the following code to custom CSS
```
.wpcf7-textarea, .wpcf7-form label {
    max-width: 100%;
}
```
Regards
#210970 Copied
Viewing 7 results - 1 through 7 (of 7 total)