Hi
I am trying to adjust the map zoom level and height on the mobile. And If I decrease the height using CSS then the zoom level doesn't change and it still shows content as per desktop zoom level and markers get hidden behind the screen. So I need help to control the zoom level of the map for mobile screens as well.
So Please let me know how I can do this.
Hi,
Thank you for contacting us and I'd be happy to assist.
To suggest the best way forward, I'll need to see exactly how this view is set up in the admin area.
Can you please share temporary admin login details, in reply to this message?
Note: Your next reply will be private and please make a complete backup copy, before sharing the access details.
regards,
Waqar
And Most Importantly, I wanna know, the reason, Why the map is loading too slow. I want to make it load immediately.
Hi,
Thank you for sharing the admin access.
By default, when no "general_zoom" attribute is provided in the "wpv-map-render" shortcode (with "fitbounds" set to "off"), the zoom level of 5 is set.
( ref: https://toolset.com/documentation/user-guides/maps/maps-shortcodes/#wpv-map-render )
To change this zoom level to a different zoomed out value when viewed on smaller screens, you can include the following custom script in the view's "JS editor" section:
( screenshot: hidden link )
jQuery(document).on('js_event_wpv_addon_maps_init_map_completed', function() {
if(jQuery(window).width() <= 649){
var options = {'zoom': 4};
WPViews.view_addon_maps.get_map('home-map').setOptions( options );
}
});
This will set the zoom level to 4, on screens with a width 649 px or lower.
As for the map's speed, it seems to load fine for me, but there is a 404 error in the console for a missing file, which can slow down the overall page loading time.
( missing file: {yourwebsite.com}/wp-content/themes/hello-elementor/js/ekko-lightbox.min.js?ver=1.1 )
I hope this helps and please let me know how it goes.
regards,
Waqar
My issue is resolved now. Thank you!