My own Layouts – single product and product archive

Hallo

SINGLE PRODUCT:
I created my own single product layout and I have the following problems:

1. doesn’t show page title
Despite the setting:
Theme settings -> Page title -> Centered and Large
Theme settings -> Product archive -> Page Title -> Shop title = ON
In the layout edition, I don’t have the “Page setting (custom metabox from theme)” option (which are in the edit normal page), so I can’t set/check anything there.

2. Displaying Brands on product page does not work (despite the setting in Theme settings -> Shop -> Brands -> Show brand on the single product page = YES, Position = “Aligned on the right of the product title”).
Alternatively, please let me know how to insert the Brand yourself so that it is displayed in the same position as yours (I know how to insert the product name below/above it)

3. how to change the typography (font size, colour etc.) of “product meta” (i.e. SKU, category). In elementor is only possible to edit the Label, not the value

4. Gallery – main image
Even though according to the guidelines the image should be 600x800px (and this is the file size), it is displayed stretched to a height of 900px

5. Gallery – enlargement
Some files are deformed when displayed at magnification (attached “img_gallery_org.png” and “img_gallery_zoom.png”)

6. I confirm the issue described in https://xtemos.com/forums/topic/cant-selected-variations-on-products-major-issue/

PRODUCT ARCHIVE:
I have created my own “product archive” layout and I have a question: how to format the typography in SKU values and prices (normal, old) displayed in the product list?

Greetings
Szymon

Attachments:

You must be logged in to view attached files.

Hi szymon-0481,

Thanks for reaching to us and appreciate your patience.

Please send me temporary wp-admin info (wp-admin URL, username, password) to Private Content area, I will check the settings.

Regards,

Hallo

Access data in a private message.

Greetings
Szymon Kurek

Hi szymon-0481,

I appreciate your patience.

Please change account role to admin, this will allow me to thoroughly investigate and address your concerns in a more efficient.

Regards,

Hallo

Account role is admin.

Greetings
Szymon

Hi szymon-0481,

SINGLE PRODUCT:

1, 2. I can see the title, brand are showing up on my end https://prnt.sc/_xEdQ_ZvC49s https://prnt.sc/HxC_5h5eLSu7

3. In case you want to change the price of sticky add to cart only, then go to Theme Settings > Typography > Advanced. In this area, you can use Custom Selector and assign elements like screenshot https://prnt.sc/RgH8NrRKWWn9

.single-product .product_meta .meta-label, .single-product .product_meta .sku

Please refer to our documentation https://xtemos.com/docs-topic/advanced-typography-settings/

4. Main product thumbnail is showing width and height as you wanted https://prnt.sc/3uGmH6a5Zggo

5. Gallery images looked shape. Please double check. https://prnt.sc/KD6MGM4jbvHp

6. In that topic, issue has been resolved. Do you need further helps?

PRODUCT ARCHIVE:

Please navigate to Appearance > Customize > WooCommerce > Product Catalog and set to display products https://prnt.sc/0XLwyH7VPhZV

Regards,

Hallo

1.2 . ok, that’s how it works

3. ok, I understand. Is there a selector list somewhere (or where to get it) (for single product and product list) ?

4. It may depend on the screen resolution, but in my case, on Full HD (1920x1080px), an image of 600x800px displays 685x913px (screen attached “image600x800”)

5. Unfortunately, in my case (and in your screen too) the image is deformed (screen “gallery_deform” is attached).

Greetings
Szymon

Attachments:

You must be logged in to view attached files.

Hi szymon-0481,

3. The classes I provided that is Single Product, for product list, you can use below classes:

.wd-product .product-element-bottom .wd-product-sku .wd-label

4. Our theme doesn’t control product images size. It is controlled by WooCommerce plugin. You can configure it in Appearance -> Customize -> WooCommerce -> Product images. And then regenerate all thumbnails through the plugin https://wordpress.org/plugins/regenerate-thumbnails/

5. You need to click zoom icon to show it in full size.

Regards,

Hi

3. Are these all classes for single product and product list? If there are any others, please send me the full list (or where I can find them)

4. I have prepared the images in appropriate sizes (600x800px), which can also be seen in the screenshots attached earlier.

5. Unfortunately, clicking enlargements, full screen, etc. does not change anything. You can see in the previously attached screenshot that from 800x800px (the original image was 600x800px) made 384x831px, which means he completely deformed the image.

Greetings
Szymon Kurek

Hi szymon-0481,

3. These work for Product list and Single product. If you have knowledge of coding, you can use Inspect element of Chrome to find the class. https://developer.chrome.com/docs/devtools/overview

4. Please add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

.single-product .woocommerce-product-gallery img {
    width: auto;
}

5. Could you, please, record video for better understanding?

Regards,

Hi

3,4 – OK

5. I don’t think a video will help here, I marked the problematic dimensions on the screenshot. There is clearly deformation. It seems to me that the problem occurs when the image has a transparent background.

Greetings
Szymon

Attachments:

You must be logged in to view attached files.

Hi szymon-0481,

I’ve passed this topic to one of our developers, and I will let you know once get an answer.

Regards,

Hi

Has anything been resolved with this deformation in the gallery? Because the problem still occurs, e.g.

https://kute.kurek.pl/elementy-kute-koszyk-kuty-stalowy-12-130×60-mm-12×12-mm/
https://schmiede.stahlco.de/korb-kunstschmiede-zwirbel-14-130×65-mm-14×14-mm/

Greetings
Szymon

Hi szymon-0481,

The provided links are not available, please double check.

Regards,

Hi

Something changes the “x” symbol in link in the messages to an incorrect one.
Change the “x” symbol in the links to the one entered manually (in the browser bar)

Greetings
Szymon

Hi szymon-0481,

I see you enabled Custom size for thumbnails in Appearance > WooCommerce > Product Images. Please switch to Uncropped or 1:1 instead. https://ibb.co/gMLRVCw

Navigate to Theme Settings -> Single product -> Gallery and enable the Main carousel auto height option here – https://prnt.sc/lB2BHaJqbwIQ

Clear the cache and recheck the issue.

Regards,

Hi

Unfortunately the solution did not help.

Regards
Szymon

Hi szymon-0481,

Basically the product images are controlled by WooCommerce and the WoodMart theme doesn’t influence this and I provided you all possible solutions to fix that.

Thanks for understanding.

Regards,

Hi

Ok, then please close this topic. I will look for a solution myself.

Regards
Szymon

[Author]

Posts