Viewing 28 posts - 1 through 28 (of 28 total)
  • Author
    Posts
  • #171384

    Hi,

    how could I “setup” the Google Maps Plugin in true Fullwidth?
    I use the Fullwidth Site Layout, but the Plugin in Boxed. So
    the 100% width doesn’t really work out. What can I do?

    Also I like to deactivate the Mouse Wheel interaction. How?
    Currently it changes the Zoom-Level, while I scroll the site.
    This could be a complicated task for a low-level user :)

    Greez Jens

    #172120

    Hi Jens!

    Which google maps plugin are you using? If you use the http://www.wpgmaps.com/ plugin you can deactivate it on the options page ( Maps > Settings and check the “Disable Mouse Dragging”). If you’re using the default widget you need to modify the theme code: http://www.kriesi.at/support/topic/full-width-google-maps/#post-135567

    To add a fullwidth map to your website you need to stretch a section element to 100%. Use the section id or class (see: http://www.kriesi.at/support/topic/add-a-anker-shortcode-template-to-avia-layout-builder/ ) to stretch the section with css code – i.e. use following css code

    
    .mycustomsection{
    width: 100%;
    }
    

    Then add a texblock element into the section and paste your shortcode into the texblock editor field.

    Regards,
    Peter

    #179157

    Hi guys,

    I tried the previous trick with WP Google Maps but it doesn’t make it.

    Could i have a bit of a help ?

    http://zebre.zebre-studio.fr/contact/

    Thanks a lot,

    Cheers,

    #180323

    Hi!

    You need to target that #map and then the container inside of it as well:

    #map .container {
        width: 100%;
        padding: 0;
        margin: 0;
    }
    #top #main #map.avia-section .template-page {
        padding: 0;
    }

    Best regards,
    Devin

    #180328

    Allright Devin, it worked great with the enfold map widget. I gave up with WP Google Map.

    I still have a little padding-bottom underneath the map. Any idea?

    Awesome support guys, love my this Enfold theme.

    Cheers,

    #180926

    Then this will do it:

    #avia_google_maps-2 {
    padding: 0;
    }
    #183410

    Hi Devin,

    I tried the code you sent but it didn’t worked.

    http://zebre.zebre-studio.fr

    Please check it,

    Thanks,

    Fabien

    #183601

    Hey!

    Please use this:

    #avia_google_maps-2.widget {
    padding-bottom: 0 !important;
    }

    Cheers!
    Ismael

    #214906
    This reply has been marked as private.
    #214942

    Hey!

    Add this on Quick CSS:

    #fullwidthmap .container {
    width: 100%;
    }

    I’m sorry but I don’t understand questions 2 and 3 clearly. Let me ask Dude.

    Cheers!
    Ismael

    #214976

    Hi!
    Thanks for answer, but I already tried to add “#fullwidthmap .container { width: 100%; }” to Quick CSS without any change. It always looks the same.
    Any other idea?
    Bye Thomas

    #215025

    Hey!

    Wenn du das “Klassen” Feld verwendest, musst du auch den CSS Code abwandeln – versuche

    
    .fullwidthmap .container { width: 100% !important; }
    

    Best regards,
    Peter

    #215043

    Hi!
    Leider keine Änderung. Kann ich Dir Zugangsdaten schicken, damit Du es dir anschaust?
    Vielen Dank,
    lg Thomas

    #215044

    Hey!

    Ja, bitte poste die Zugangsdaten als private reply und ich sehe mir die Sache an.

    Best regards,
    Peter

    #215050
    This reply has been marked as private.
    #215058

    Hey!

    1) Ich habe das Problem gefunden. Du hast php code (add_theme_support() Funktion) in das Quick CSS Feld eingefügt. Dieser Code ist natürlich nicht css valide (sondern muss in die functions.php Datei) und hat daher auch den fullwidth Map Code beeinflusst. In das “benutzerdefinierte CSS Klasse” Feld bitte auch keinen CSS Code einfügen sondern nur CSS Klassen. Die kann man dann mittels CSS Code in der Child Theme style.css oder mittels Code im Quick CSS Feld ansprechen. Mehr zu css Klassen: http://www.css-lernen.net/css-klassen.php

    2) Ihr könnt probieren eine fullwidth Sektion zu erstellen (verwendet wieder die Sektion und gebt ihr die ID “fullwidthmap”) und dann zieht ein 2/3 Spalten Element und ein 1/3 Spalten Element hinein. In das 2/3 Element gebt dann die Slideshow und in das 1/3 Element könnt ihr zB eine Widget Area geben. Das Ergebnis wird dann sicher nicht so gut aussehen wie hier http://www.turracherhoehe.at/ , aber ein Versuch ist es wert.

    Cheers!
    Peter

    #228712
    This reply has been marked as private.
    #228862

    Hey!

    Please add this on your custom.css or Quick CSS:

    .page-id-487 #main .container {
    width: 100%;
    }
    
    .page-id-487 #main .container .template-page.content.twelve.alpha.units {
    width: 100%;
    }

    Best regards,
    Ismael

    #228873
    This reply has been marked as private.
    #229664

    Hi!

    What that user did was put the widget area inside of a color section. The color section is called “map” without quotes in the developers field when editing the color section. This allows you to then set its width with css.

    For example:

    #map .container {
        width: 100%;
        padding: 0;
        margin: 0;
    }
    #top #main #map.avia-section .template-page {
        padding: 0;
    }

    Regards,
    Devin

    #234978

    Thanks. I did this and it worked well. However, how do I control the height of the map. I added the height to the #map container…it changed the height of the container but the map widget stayed the same height. Thanks.

    #237078

    Hi guys. Do you think you can please answer my question some time soon? I would really appreciate it. Thank.

    #237079

    Hi!

    Please update Enfold to the latest version 2.6.1 ( http://www.kriesi.at/documentation/enfold/updating-your-theme-files/ )
    new Google Maps Element was added as you can see here http://www.kriesi.at/themes/enfold/pages/contact/

    Regards,
    Yigit

    #272593
    This reply has been marked as private.
    #272617

    Hi @CharlieBarey ,

    That is what happens when you use any full width element on a page. Instead of using the fullwidth map element, add a widget area into your layout and then add the map widget to that widget area from the WordPress widgets manager.

    Cheers!
    Devin

    #272668

    Ok, i understand. But i need to set more than one points over the map, and i cant with the map of WordPress widgets manage.
    Is there a way?

    #272806

    Hi!

    Actually there is a much easier solution. just add a 1/1 column to your page and put the maps widget inside. it will no longer stretch across the fullwidth but only take up the space beside your sidebar :)

    Best regards,
    Kriesi

    #273028

    Hi Kriesi! Thanks for that! http://guasunchos.com/
    However, I would love to use the full width map in the future, it is really the best choice in terms of design. I think that would be a very nice feature to improve! I know you can do it! :)

Viewing 28 posts - 1 through 28 (of 28 total)

The topic ‘Google Maps in true Fullwidth and without Mouse Wheel interaction’ is closed to new replies.