WOODMART WOOCOMMERCE LAYERED NAV Brand image how to disable

Hello,

Please read private content first.

Using WOODMART WOOCOMMERCE LAYERED NAV widget for brand filter. My brand thumbnails are not showing in full width in filters on product categories archive, my images have around 150 px width and max 50 px height. I want you to provide two solutions to pick:
1. How to show full image not cut by the theme. It can be restricted to certain sizes like the normal widget settings so small, medium, large but just how to show image in full not just a fragment of image. I use JPG images if this makes difference.
2. How to hide image of the brand totally.

This solution was NOT working for me as for hiding the image:
body .woodmart-woocommerce-layered-nav .swatches-brands .filter-swatch {
display:none;
}

Best regards,

Attachments:

You must be logged in to view attached files.

Hello,

Please try using the below Custom CSS code and paste it to Dashboard >> Theme Settings >> Custom CSS >> Global CSS section:

.wd-swatches-filter.wd-swatches-brands {
	--wd-swatch-h: 100% !important;
	--wd-swatch-w: 60px;
}

In this CSS, making the height 100% will make the Brands images appear correctly. Also, we have added the width property in this, if you want to use that to change the width you can change the value of it and update it in the above provided Custom CSS. Also, remember to add !important to override the previous default value applied. Right now 60px is the default value for the width in this case which we have shared here.

And if you want to hide the Images for the Brands Filter only, then please try using the following Custom CSS on your Site:

.wd-swatches-filter.wd-swatches-brands li a span img {
    display: none !important;
}

This will only hide the Brand Filters Image. Hope this helps !

Best Regards.

Hello,

First code works like perfect. Thank you. As for second to hide brand, it creates one problem, the icon disappear but it leaves the empty space before the brand name in the filters. So in list view you have an empty space and then the brand name. So it looks like the icon is still occupying the space where the icon was. It does not position itself in the place of the picture, but still leaves space for it. Screen attached.

Best regards,

Attachments:

You must be logged in to view attached files.

Hello,

Regarding hiding the Brand Filter image, please ignore the last sent CSS and try using the following below Custom CSS code and paste it to Dashboard >> Theme Settings >> Custom CSS >> Global CSS section:

.wd-swatches-filter.wd-swatches-brands li a .wd-swatch {
    display: none !important;
}

Hope this helps !

Best Regards.

Hello Aizaz, This one is almost perfect but I have one brand with logo and another without logo, when they are in List view I still see just small gap there. Can we please fix it? Screen attached

Best regards,

Attachments:

You must be logged in to view attached files.

Hello,

You can further try out the following Custom CSS in this regard if this works out for you:

.wd-swatches-filter.wd-swatches-brands li a .wd-filter-lable.layer-term-lable {
    margin-inline-start: 0 !important;
}

The location to paste Custom CSS is the same as told earlier.

If somehow it doesn’t work out for you then you might need to share your Site URL with us if possible (through possible means) so that we can directly see this on your Site and assist you accordingly.

Best Regards.

Hello,

This works perfectly fine. I have one more issue, I’m using in elementor Xthemos template named Video + brands. This is showing brands. Sadly some of them are aligned to the top of the cell instead of centered. Most of them are centered but not all of them. I tied layout setting called Vertical alignment but it did not helped. This is happening when some of the brands are higher than others. Can you please help to fix this as well? Screen attached..

Best regards,

Attachments:

You must be logged in to view attached files.

BTW I just assume this is happening because some of the brands are higher. Not certainly sure:) This is just I suspect to cause the issue.

Hello,

One more issue. Using accessory demo and default pictures on single product page. Please take a look on small pictures what is happening when you make the website smaller in the browser. Images are blurry. How we can fix this?

Best regards,

Attachments:

You must be logged in to view attached files.

Hello,

1- The mentioned Template when we have imported on our Test Site, the Brands are appearing in it: https://snipboard.io/fsMQWv.jpg

So, it would be better to use resized Brand Images here so that you won’t need to use any Custom CSS to modify their sizes. The Brands on our Test Site are with the following Image dimension: 150×83 pixels.

2- Regarding the Image blurry concern, please read out the following Theme documentation guide: https://xtemos.com/docs-topic/image-size-and-content-alignment-in-a-product-grid/

Best Regards

Hello Aizaz,

As for 1. This is the default placeholder for brands so could not make custom images just for that place and it is impossible to put them in the mentioned size as they would look different in other places. Any walk around with CSS?
As for 2. I read it. But this is not working good at your demo even. This is theme error not miniature error. Check at your demo and make the website narrower in the browser and you will receive same error https://woodmart.xtemos.com/accessories/product/iphone-13-case-max-black/ the thubnail should be show in the narrower other way, it is shown to large and in result, blurry.
3. I have third issue. When I add in search question in search window and I place product name, product is not searching and I get website with something like this in screen attachment. For example if I search SONY I do not get any results if I will search SONY I do not see all products from SONY if I will search SONY XPERIA X10 I will get the result, If I will place the SKU I will also get result but not if I will just write SONY I do not get nothing(screen attached) I have questions:
a. how to fix search
b. how and where I can change what is showing in search page results? I see only settings in theme settings General>Search but how I can change content of this page? Do not see the place where the result from screenshot is added.

Best regards,

Attachments:

You must be logged in to view attached files.

As for no search results from previous message I have same issue when I click on product page in Products navigation and click the icon pointed on the screenshot. I go to exact same page as when I start Search(screenshot from previous message)

Attachments:

You must be logged in to view attached files.

Hello,

1- For this we would eventually need to look this up on your Site because on our Test Site, the Brands images seem to be appearing fine in the Section Video + Brands.

Or you can try the following Custom CSS on your Site, if this somehow works out for you:

.elementor-widget-wd_products_brands .brands-widget .brand-item a img {
	width: 15em !important;
	height: 5em !important;
	object-fit: cover !important;
}

Location to paste Custom CSS, go to Dashboard >> Theme Settings >> Custom CSS >> Global CSS section >> paste the CSS.

2- Firstly, just to mention Browser Resizing is not a standard way of checking responsiveness. Please try checking the concern on a standard device and then mention if you face any issue in this regard.

Further, to control the Product Images size WooCommerce provides an option which is available under the Dashboard > Appearance > Customize > WooCommerce > Product Images which you can check out and define size for the Main Product Image as well as the Thumbnails which you are referring for the Demo. So, the size that you define there for the Thumbnail width will be applied to Thumbnail images of the Product Gallery.

3- Regarding the search concern, without looking it up on your Site we can’t exactly say what could be the reason in this regard. So, you might need to share the Site WP-ADMIN Login details so that we can proceed further with checking the issue on your Site and assist you accordingly.

Further, the search works on a Product keyword. This is the Woocommerce feature and our theme can only suggest search by SKU. You can enable the feature in the Theme Settings > Shop > Search by product SKU.

4- The Products per page option right now is available globally to define under the Dashboard > Theme Settings > Product archive > Products grid > Pages > in that you can find the option Products per page to define: https://snipboard.io/J5rnUs.jpg

5- Under the Product Navigation, the center one redirects the User to the Shop page directly: https://snipboard.io/zJFVKQ.jpg

And right now there is no option in Theme Settings available to change that. It requires Customization and this is beyond our limitations and support policy scope. Hope you can understand our limitations.

Best Regards.

Hello,

Thank you.
1. As for brands the CSS not helped as it made the images larger and not proportional but, let\’s leave it for now if you do not have any solution for now, If I will need I will send link.
2. Got it, but If I work in many windows I just make them smaller and this bug occurs that way.
3. I fixed the issue.
4. This is not what I\’m looking for. I will reply below what I need in point one.
5. Understand, no worries. Would be great if for future this would go to the category of the product.

I would need those two things:
1. Screen attached, you will know what I\’m looking for.
2. Stock status is not working for me, any ideas how to fix it? Screen attached.

Best regards,

Attachments:

You must be logged in to view attached files.

Hello,

1- The WooCommerce Result Count is by default displayed none for the Desktop view, so please try using the following Custom CSS on your Site:

.wd-builder-off .woocommerce-result-count {
    display: block !important;
}

Location to paste Custom CSS, go to Dashboard >> Theme Settings >> Custom CSS >> Global CSS section >> paste the CSS.

2- Regarding the Stock Status not working concern, please once try disabling the product attribute lookup table on your Site under the Dashboard > WooCommerce > Settings > Products > Advanced > there you can find the option > try unchecking that and then check back your concern again: https://snipboard.io/IequNJ.jpg

If this still doesn’t work out then once try deactivating all the third party Plugins on your Site remaining the Theme required ones activated. If the issue gets resolved, then reactivate them one by one to see which Plugin is causing the issue.

If somehow the issue still persists, then please take complete Backup of your Site first, then provide us the WP-ADMIN Login details of your Site in the Private Content field along with the permission to completely debug your Site which includes deactivating all the third party Plugins and removal of on-Site Customization changes too, so that we can thoroughly check this issue on your Site and assist you accordingly.

Best Regards.

Hello

1. Thank you. Is it possible to move it like on screenshot?
2. This did not helped but I managed to find solution, I did not had any promotion. Adding one fixed the issue. But for not available products you use in this widget onbackorder but my products are out of stock not on backorder, can this be changed somehow?

Best regards,

Attachments:

You must be logged in to view attached files.

Hello,

1- Although, moving the Result Count like that for the Desktop view isn’t directly possible. The element needs to be free from its parent container by using the absolute position here. So, you can try out this CSS if that works out for you because other than that right now there isn’t a separate solution available:

.wd-builder-off .woocommerce-result-count {
    position: absolute;
    top: 3em;
}

But remember to paste this CSS specifically under the Custom CSS for desktop. Location to paste Custom CSS, go to Dashboard >> Theme Settings >> Custom CSS >> Custom CSS for desktop >> paste the CSS.

2- Sorry to say but right now there is no option in Theme Settings available for that. It requires Customization and this is beyond our limitations and support policy scope. Hope you can understand our limitations.

Best Regards

Hello,

Thank you. I have one more question. How i can translate in full layouts and html blocks? When I try to translate Layouts they do not have all functions and look like the original Layout, sometimes translation look like website without layout at all. Can you explain every step I need to make to translate Layout with WPML?

Best regards,

Hello,

You can check out the following Theme Documentation guides in this regard:

https://xtemos.com/docs-topic/how-to-use-wpml-with-woodmart/
https://xtemos.com/docs-topic/how-to-make-woodmart-multilingual-with-wpml/

Hope this helps !

Best Regards

[Author]

Posts