Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
    Posts
  • January 3, 2014 at 3:22 pm #205009
    hellovlad_

    Hi,
    I know many people have already asked about this and I tried to find the solution by looking through previous questions/answers, but still can’t figure it out.
    How can I make the Google Map widget responsive and full bleed page?
    As recommended, I put the widget inside the Color Section with this code inside the Section ID: #fullwidthmap .container {
    width: 100% !important;
    } and still it’s not displaying it full width. Should I paste inside the widget itself?

    Can you please advise?
    thanks!

    January 3, 2014 at 6:25 pm #205077
    Devin

    Hi hellovlad_!

    That should work as long as you aren’t using the boxed layout. If you are then the container of the site doesn’t expand to full width and so the map can’t expand to the edges of the screen.

    Best regards,
    Devin

    January 3, 2014 at 7:03 pm #205096
    hellovlad_

    Thanks for the reply!
    I’m not understanding where the boxed layout is chosen and how to make sure I’m not using one.
    I’m only placing a Color Section and inside of it a Google Map widget.
    Please these links for the screenshots:

    https://dl.dropboxusercontent.com/u/13377083/contact_inside_the_setting.png
    https://dl.dropboxusercontent.com/u/13377083/Preview_contact.png

    Do you see what I’m doing wrong?
    thank you again,

    January 3, 2014 at 7:43 pm #205109
    Yigit

    Hey!

    Do you mind creating a temporary admin login and posting it here privately so we can take a look?

    Regards,
    Yigit

    January 3, 2014 at 7:55 pm #205113
    hellovlad_
    This reply has been marked as private.
    January 3, 2014 at 7:58 pm #205115
    Yigit

    Hey!

    You forgot to post the link to your website :/

    Cheers!
    Yigit

    January 3, 2014 at 7:59 pm #205119
    hellovlad_
    This reply has been marked as private.
    January 3, 2014 at 8:04 pm #205121
    Yigit

    Hi!

    Changes are done. Please review your website. You can find the custom CSS code i added in Quick CSS section in Enfold theme options under Styling tab.

    Cheers!
    Yigit

    January 3, 2014 at 8:08 pm #205123
    hellovlad_
    This reply has been marked as private.
    January 3, 2014 at 8:15 pm #205124
    Yigit

    Hey!

    I have just checked your website on my iphone and marker is not getting cut off. Please see screenshots below
    Portrait mode http://i.imgur.com/0MpI7V2.png
    Landscape mode http://i.imgur.com/F26iSWj.png
    Best regards,
    Yigit

    January 3, 2014 at 8:45 pm #205136
    hellovlad_
    This reply has been marked as private.
    January 3, 2014 at 8:53 pm #205138
    Yigit

    Hi!

    You can find following code in Quick CSS section and adjust the height as needed

    .content .avia_google_maps_container {
height: 300px;
}

    Best regards,
    Yigit

    January 4, 2014 at 12:59 am #205212
    hellovlad_
    This reply has been marked as private.
    January 4, 2014 at 3:11 am #205230
    Yigit

    Hey!

    Please replace that code with following one and it should work just fine 

    @media only screen and (min-width: 767px) { 
#g-maps .widget { padding: 0px; }}

    Regards,
    Yigit

    January 15, 2014 at 6:09 am #209865
    jj_skywalker
    This reply has been marked as private.
    January 15, 2014 at 7:52 am #209896
    Ismael

    Hey!

    First, go to Appearance > Widgets then create a custom widget area using the “Enfold Custom Widget Area”. After that insert the Enfold Google Maps Widget on the custom widget area that you created. Go to the contact page then insert the Widget Area element. Select the new custom widget area.

    Cheers!
    Ismael

    January 15, 2014 at 9:19 am #209927
    jj_skywalker
    This reply has been marked as private.
    January 15, 2014 at 9:31 am #209937
    Dude

    Hey!

    Great, glad Ismael could help you :)

    Cheers!
    Peter

    January 15, 2014 at 9:36 am #209939
    jj_skywalker
    This reply has been marked as private.
  • Author
    Posts
Viewing 19 posts - 1 through 19 (of 19 total)
  • The topic ‘Google Map Fulll Width on Contact Page’ is closed to new replies.