Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #27843

    Hello!

    I’m looking to have a full width Google Maps on a page. I saw on https://kriesi.at/support/topic/enfold-feature-requests that you have ‘Fullscreen Google Maps Element’ as ‘requested and accepted’ and I also have been searching the forum to see if there were more explainations. I found several:

    (1) https://kriesi.at/support/topic/responsive-google-map-in-slider#post-125226

    (2) https://kriesi.at/support/topic/google-maps-in-full-width-slider

    (3) https://kriesi.at/support/topic/googlemaps-with-predefined-height

    I went with (1) and set width to 2560 so on big screens it’s also full width, but on smaller screens, the center of map just goes out. I guess this is the responsive issue you where talking on the topic?

    <iframe width="2560" height="450" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Madrid,+Spain&aq=0&oq=madrid&sll=37.0625,-95.677068&sspn=59.249168,135.263672&ie=UTF8&hq=&hnear=Madrid,+Community+of+Madrid,+Spain&t=m&ll=40.416633,-3.703766&spn=0.23525,1.373291&z=11&iwloc=A&output=embed"></iframe>

    As for option (2) and (3), I see people are going with other options but I didn’t quite catch it…

    On a theme I bought previously, in the contact, you have a fulll width map http://themeforest.net/item/coworker-responsive-multipurpose-template/full_screen_preview/3981356. It works with on a template page basis (not slider); it doesn’t resize dynamically but the pin on the map is always in the center, whatever the screen size.

    Will you include soon a similar feature? Or is there a way to force pin to the center of the screen?

    Thank you in advance!

    Anne-Sophie

    #135565

    Hi,

    In order for us to help you, please include a URL to the particular page where you are experiencing this problem. Since each page can be created in a number of different ways , and due to many updates, it is simply not possible to provide you with a meaningful solution without first seeing the page with the live code. A screen capture will not help. What you can do is hide the url to your site by using the http://www.goo.gl url shortner.

    Thanks,

    Nick

    #135566

    Hello Nick,

    I updated everything and now map appears centered on loading, whatever is the page size. However, there is still a problem: on a tablet or mobile device, the map occupies everything, big as on screen so you don’t see what there is inside and don’t let you go down to see the rest of the content. The map I’m using is https://mapsengine.google.com/map/viewer?mid=zqjb8f_-IVc8.klDEB4_pP8xw but on an iPhone screen, you only the top left border.

    The website is currently under construction but I can provide you a subscriber access by mail if you wish.

    Thank you,

    Anne-Sophie

    #135567

    In wp-contentthemesenfoldframeworkphpclass-framework-widgets.php replace

    var myOptions = {
    zoom:".$zoom.",
    mapTypeControl:true,
    mapTypeId:google.maps.MapTypeId.".$type.",
    mapTypeControlOptions:{style:google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    navigationControl:true,
    navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL},
    center:latlng
    };

    with

    var myOptions = {
    zoom:".$zoom.",
    mapTypeControl:true,
    mapTypeId:google.maps.MapTypeId.".$type.",
    mapTypeControlOptions:{style:google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    navigationControl:true,
    navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL},
    center:latlng,
    draggable: false
    };

    this code mod will deactivate the google map scroll function and the user interaction (touch/input event) will affect the website and not the map area.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Full width Google Maps’ is closed to new replies.