I did not find anywhere Custom off-canvas sidebar elementor tutorial

Hello,

Navigate to Theme Settings > Product Archive > Sidebar > Enable the option “Off canvas sidebar for desktop”.

If you are using custom layout for archive pages, Navigate to Layouts > Edit Layout with Elementor and add the off canvas columns button in the layout. You should have 2 columns and one of them should have the “Column role for off-canvas layout” option.

Best Regards.

Hello,

Sorry to hear about the inconvenience. Kindly, please share your Site WP-ADMIN Login details in the Private Content field so that we can check this concern on your Site and help you out accordingly.

Best Regards.

Hello,

Sorry to say I am unable to log in or visit your site. Please clear the site/server caches.
https://ibb.co/WVnQbMn

Best Regards.

Hello,

You have chosen the layout condition “Product Categories” that is why it is working only on the categories page. Try to create the layout and set the condition of “All products archives”. It will work on both shop and category pages.

You need to edit the layout with elementor and edit the sidebar widget and in the advanced tab set the sidebar padding.
https://ibb.co/Bq8hzdK

Best Regards.

Hi there cam You share video
Thank You

That’s why I ask If You can share public in other field (public) to learn other members if it’s possible

Hello,

Navigate to Theme Settings > Performance > Preloader > Enable the option “Prelader” and check how it works.

Best Regards.

Hello,

It is due to your slow site speed. I have checked your site speed and it is too low.
https://ibb.co/JzmvTt2

it’s possible that your website’s performance is affected by the content you have added. For instance, the use of too many plugins, large unoptimized images, or other resources can slow down your website.

We recommend that you remove any unnecessary plugins and install a JS & CSS optimization plugin such as WP Rocket. Our guide on how to optimize your website using our themes can be found here: https://xtemos.com/wordpress-performance-optimization-the-ultimate-guide-in-2021/.

Best Regards.

Hello,

Yes, we understand your issue, but it is not actually a bug. As seen in the screenshot https://monosnap.com/file/KW9AgKxZtEy5nCjLzsf4tppDYt8KXm, two identical images are loaded but with different sizes. This is how Srcset works in the browser https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/srcset.

Srcset is an HTML attribute for the img element that allows the browser to choose from multiple versions of an image to display, based on the device’s screen size and resolution. This helps optimize image loading and display for different devices, improving performance and visual quality.
It can be disabled, but only globally for the entire site.

Best Regards.

Hello,

In fact, this feature allows web browsers to choose the best version of an image depending on the screen size, resolution, and other factors. This helps optimize page loading and improve performance on various devices. It is used on many websites, including Amazon, as we can see in the video: https://monosnap.com/file/HH3lUf8xpfjcsL1TIT26LMSjshxpTj, where two identical images with different names and sizes are loaded.

However, if you don’t need this, you can disable it by adding the following custom code to the child theme funtcion.php file.

add_filter('max_srcset_image_width', function () {
	return 1;
});

Best Regards.