Return to previous page

Problems with the header banner (block) when navigating through sidebar categories

This topic has 16 replies, 2 voices, and was last updated 11 months ago ago by Rose Tyler

armatactica

Participant

October 25, 2023 at 09:19

Problems with the header banner (block) when navigating through sidebar categories

Hello, good morning:

I have set up a banner using a static block in the header of each category I currently have.

When I access the page directly, it looks perfect:
https://armatactica.com/outdoor/
https://armatactica.com/outdoor/comunicaciones/
https://armatactica.com/outdoor/comunicaciones/walkie-talkies/

But when I navigate through the sidebar categories (meaning, if I am on “Outdoor” and click on the subcategory in the sidebar “Comunicaciones”), the banner appears with all the default settings, not configured as I have set in the block.

How can I solve this issue?

Thank you very much in advance.

Please, contact administrator
for this information.

#371444 Copied Theme version: 9.2.2

15 Answers

Rose Tyler

Support staff

October 25, 2023 at 16:05

Hello, Armatactica,

Thank you for contacting us and for using XStore.

It looks like the issue is caused by styles that Elementor loads for static block that loaded with Ajax. Would you be so kind to contact Elementor Pro support to find out if they have any tips to fix it?
You are able to contact them because you are the owner of the Elementor Pro license, we don’t have access to their support system, unfortunately. Also, explain that you use shortcode to display Elementor block in the product category description. And if you load the product category with Ajax from the shop page that styles are wrong. They will be able to check this while inspecting your site. Ask them if they have any suggestions to get a fix if the block is loaded using Ajax on the page.

Kind Regards,
8theme team

#371513 Copied

armatactica

Participant

October 27, 2023 at 10:35

Hello, good morning:

Thank you very much for your response! I have already written to Elementor to see if they can help me resolve the issue. I was about to remove it because, aside from looking bad, it’s quite a hassle, but aesthetically it looks much better, and that’s what I want.

I have two other issues, but if you prefer, I can open two new topics. Please let me know:

1- I have the Cookie renewal set for every 24 hours, but nonetheless, especially on mobile format, the Cookies Notice appears on absolutely every page, which is quite inconvenient. How can I solve this?
2- Finally, I’ve decided to install WP Rocket to improve the page’s performance, but I’m afraid to tinker with it too much because in my previous “Arma Táctica” project, it messed up the page despite following all the optimization steps you recommend. Still, my performance is at 25, and considering my previous pages, with a score of 25, Google won’t index it.

Can you help me with these two issues?

Thank you very much in advance.

#371750 Copied

Rose Tyler

Support staff

October 27, 2023 at 12:41

Hello, Armatactica,

Please open up new threads for new questions, next time – https://www.8theme.com/forums/xstore-wordpress-support-forum/

1/ It looks like the problem is caused by caching of some sort. Please check this topic – https://www.8theme.com/topic/age-verification-popup-not-able-to-disable/#post-362034
etheme_cookies
– should be added to Reject Cookies in your cache plugin settings.

2/ “my performance is at 25” – please provide the URL of the tester where you get this.

Kind Regards,
8theme team

#371765 Copied

armatactica

Participant

October 27, 2023 at 16:45

PageSpeed Insights: https://pagespeed.web.dev/analysis/https-armatactica-com/r2l0m9ieru?form_factor=mobile

Meanwhile, I will try to fix the issue with the Cookies. Thank you very much!

#371812 Copied

Rose Tyler

Support staff

October 29, 2023 at 10:25

Hello, Armatactica,

We appreciate your prompt response.

https://prnt.sc/K_s2nYgqNPco: – Eliminate render-blocking resources – you may try solutions described here https://onlinemediamasters.com/eliminate-render-blocking-resources-wordpress/ ; – about “Serve images in next-gen formats” you can find info online, for example – https://gtmetrix.com/serve-images-in-next-gen-formats.html#:~:text=Next%2Dgen%20image%20formats%20offer,lossy%20compression%2C%20and%20animated%20images. https://gtmetrix.com/efficiently-encode-images.html ; – Reduce unused CSS – https://www.wpbeginner.com/wp-tutorials/how-to-remove-unused-css-in-wordpress-the-right-way/ ; Reduce unused JavaScript – https://web.dev/unused-javascript/?utm_source=lighthouse&utm_medium=lr (disable unrequired plugins).
Properly size images – optimize images, for example – https://prnt.sc/DOfL2lcsKHlS https://tinypng.com/ ;

We can see a few optimize/cache plugins (Speed Optimizer and WP Rocket) on your site, please note that the options of such plugins may conflict with each other. Try to test how it works when only one is activated, and contact support of the plugin to ask about the best configuration of settings.

We hope this information is helpful.

Kind Regards,
8theme team

#371903 Copied

armatactica

Participant

October 30, 2023 at 08:27

Good morning,

I’ve been setting everything up, and I’ve managed to achieve a 60 for mobile performance and a 90 for desktop performance on PageSpeed Insights, so I’m quite happy with that. If I make more changes to the page, I could potentially improve it further. Additionally, I’ve optimized the images using Imagify.

One important thing that people should know, in case it’s read by users of the WooZone and Imagify plugins, is that if you change the Imagify settings to “Display images on the site in WebP format,” the image tag changes. As a result, variable products won’t load when selecting a variation. At least, I haven’t been able to solve it, so I’m mentioning it here in case someone needs it.

I have one last question, and with this, I’ll close the topic for now: How can I set a maximum height for the images in the single product? They look bad on desktop, although not so much on mobile.

Thank you very much for all the solutions you provide.

Best regards!

#371977 Copied

Rose Tyler

Support staff

October 30, 2023 at 16:23

Hello, Armatactica,

Thank you for your response.

Theme Options > WooCommerce > Single Product Builder > change width of section that contains gallery – https://prnt.sc/b7OXv6TQKp4B

Kind Regards,
8theme team

#372037 Copied

armatactica

Participant

December 4, 2023 at 10:17

Hello, good morning:

It is impossible for me to change it. It only gives me the option to change the width.

Thank you very much in advance.

#375573 Copied

Rose Tyler

Support staff

December 4, 2023 at 10:39

Hello, Armatactica,

Thank you for getting in touch with us.

Please provide URL of a single product page and temporary wp-admin access. Describe the desired result in more detail.

Thank you for your cooperation and we look forward to hearing from you soon.

Kind Regards,
8theme team

#375575 Copied

armatactica

Participant

December 4, 2023 at 10:44

Hello Rose,

An example is this product: https://armatactica.com/walkie-talkies/walkie-talkie-kenwood-tk-3701de/ (it looks very bad)
And another one could be this: https://armatactica.com/botas-militares/botas-bates-gx-8-gore-tex-con-cremallera-lateral/

I would like it to be a square image, with a maximum size, for example, of 600×600 pixels.
And to know how to change it, just in case 600×600 turns out to be too large or too small.

Thank you very much.

Please contact administrator
for this information.

#375576 Copied

Rose Tyler

Support staff

December 4, 2023 at 10:58

Hello, Armatactica,

We appreciate your prompt response.

Please read this article – https://www.8theme.com/documentation/xstore/woocommerce/product-images/

Private Content

Kind Regards,
8theme team

Please contact administrator
for this information.

#375580 Copied

armatactica

Participant

December 14, 2023 at 19:26

Hello again!

I have been trying to figure out why WooZone imports images from Amazon with a maximum width or height of 500px, but I can’t seem to find the answer. Due to this, the images appear with very low quality. I only manage to solve it by uploading the main product image myself, but the imported ones still look terrible. Could you help me? Do you happen to know why this is? I have deactivated Imagify and others, but it hasn’t made a difference. I understand it might not be your issue, but I wanted to check if you might have any answers by chance.

Regarding the previous message:

I have seen the article and tried to follow it, but it hasn’t helped me at all…
The images appear with a huge height, messing up the page.
I’ll show you an example:
https://armatactica.com/multiherramientas/multiherramienta-gerber-suspension-nxt/
Not the main image, but the ones in the side slider.
I couldn’t solve it with the article you provided because it only determines the width of the image, and I want to set a maximum height. Is it possible to do this with CSS?

Please contact administrator
for this information.

#376713 Copied
Rose Tyler

Support staff

December 15, 2023 at 13:48
Hello, Armatactica,

Thank you for getting in touch with us.

For your convenience, we have provided links to the plugin comments section where you can find relevant discussions – https://prnt.sc/Gfr1SXuKiSLT https://codecanyon.net/item/woocommerce-amazon-affiliates-wordpress-plugin/3057503/comments?term=import+image+size&from_buyers_and_authors_only=0&order_by=relevance

Upon review, we have noted that the image titled “Gerber-Herramienta-0.jpg” has specific dimensions, which you can view here – https://prnt.sc/oXZMKsIPX9S2 , the image block on the single product page has 716px width https://prnt.sc/DgHPEfQ54Wbv , and the height of the image is taken proportionally to the initial image height.
Because of this, we asked you to change the width of section that contains the gallery – https://prnt.sc/b7OXv6TQKp4B

While it is possible to alter the image height using custom CSS, such as the code snippet provided below, this may not yield the optimal result:: https://prnt.sc/MUPRm275sbdc
```
.single-product .swipers-couple-wrapper .swiper-wrapper img {
    max-height: 716px;
}
```
For the best visual presentation of your product images, we recommend utilizing a graphics editor to standardize the size of your images or adjust them to the proportions that best fit your requirements before uploading them to your media gallery.

Should you require further assistance or have any additional questions, please do not hesitate to reach out.

Kind Regards,
8theme team
#376780 Copied
armatactica

Participant

December 17, 2023 at 20:26

Thank you very much for your response and for taking the time to look into the plugin comments. Unfortunately, those comments are quite old, and I do remember that I used to have much better quality before. However, I am currently using Insane Import as you mentioned, and it seems that Amazon no longer allows higher quality. What a shame.

Regarding the CSS, I decided to add width: auto;, and it works for me. The image appears smaller, around 500, but at least it doesn’t look distorted and with awful quality. So, for now, that’s good enough for me.

Thank you so much for everything, as always!

#376939 Copied

Rose Tyler

Support staff

December 18, 2023 at 08:58

Hello, Armatactica,

Thank you for your detailed response. We wish you success in your business endeavors.

Kind Regards,
8theme team

#376972 Copied
Tagged: best woocommerce themes, header banner issues, optimized woocommerce themes, sidebar navigation problems, troubleshooting woocommerce themes, woocommerce theme fixes
Viewing 16 results - 1 through 16 (of 16 total)

The issue related to '‘Problems with the header banner (block) when navigating through sidebar categories’' has been successfully resolved, and the topic is now closed for further responses

Problems with the header banner (block) when navigating through sidebar categories

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection