Ticket sichern für VueJS-Konferenz 2022
Ergebnis 1 bis 3 von 3

Thema: C 4.13: numero2/contao-storelocator und Oveleon Cookiebar miteinander verbinden

  1. #1
    Contao-Fan Avatar von herr rilke
    Registriert seit
    29.01.2011.
    Ort
    Münster
    Beiträge
    288

    Standard C 4.13: numero2/contao-storelocator und Oveleon Cookiebar miteinander verbinden

    hallo,

    hat jemand von euch schon einmal den numero2/contao-storelocator und Oveleon Cookiebar miteinander verbunden, so dass die google-maps erst nach akzeptieren der cookies geladen werden?

    es gibt einmal eine übersichtskarte, auf der alle händler eingetragen sind, die mit javascript aufgebaut wird und einmal einen iframe, der im template der detailseite geladen wird.

    wäre klasse, wenn mir da jemand aufs pferd helfen könnte.

  2. #2
    Contao-Fan Avatar von JMMB
    Registriert seit
    08.03.2012.
    Beiträge
    253
    User beschenken
    Wunschliste

    Standard

    Hallo,

    zumindest für die Iframes könntest Du die Templates in der Config ergänzen:

    Code:
    contao_cookiebar:
      iframe_types:
        googlemaps: 
          - mod_storelocator_list
          - mod_storelocator_details

  3. #3
    Contao-Fan Avatar von herr rilke
    Registriert seit
    29.01.2011.
    Ort
    Münster
    Beiträge
    288

    Standard

    JMMB,

    super, vielen dank für deine antwort! das funktioniert auf jeden fall für die detail-seite!

    Code:
    contao_cookiebar:
      iframe_types:
        googlemaps: 
          - mod_storelocator_details

    hier noch zum nachlesen, wie's auf der übersichtsseite geht. vielleicht hilft's ja dem ein- oder der anderen.

    1. wir brauchen zunächst einen neuen cookie eintrag vom typ "Benutzerdefiniert (Script)". dessen ID merken wir uns (in meinem bsp. unten ist es die 4)
    2. dann nehmen wir uns die addModule methode in einem javascript-file, das wir in die seite einbinden.


    Code:
    document.addEventListener("DOMContentLoaded", function() {
        cookiebar.addModule(4, PGkarte, {
            selector: '#map-canvas',
            message: 'Wenn Sie möchten, können Sie sich hier eine Google-Maps Karte mit den Standorten anzeigen lassen',
            button: {
                show: true,
                text: 'Ja, bitte!',
            },
        });
    });
    hier führt cookie mit der ID == 4 die funktion "PGkarte" aus, wenn der cookie gesetzt ist, und gibt anderenfalls die meldung aus, die
    wir festlegen können in einem HTML element mit der ID "#map-canvas".

    damit das funktioniert muss das template script_loader_googlemap.html5 angepasst werden:
    PHP-Code:
    <!-- indexer::stop -->
    <?php $this->block('content'); ?>
    <?php $this
    ->endblock(); ?>

    <?php
        
    // die ursprünglich anonymene funktion in $PGkarte gespeichert,
        // damit sie per CookieConsent aufgerufen werden kann.
    ?>

    <script>

       let PGkarte = function(){

            if( typeof window.storeLocatorInitGoogleMap !== "function" ) {

                var script = document.createElement('script');
                script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places&key=<?= $this->mapsKey?>&callback=storeLocatorInitGoogleMap';
                script.async = true;

                window.storeLocatorInitGoogleMap = function() {

                    var e = new Event('storeLocatorGoogleMapLoaded');
                    document.dispatchEvent(e);
                };

                document.head.appendChild(script);
            }

            if( typeof window.google !== "undefined" && typeof window.google.maps !== "undefined" ) {

                var e = new Event('storeLocatorGoogleMapLoaded');
                document.dispatchEvent(e);
            }

        };

        // PGkarte();

    </script>
    <!-- indexer::continue -->

    und im template mod_storelocator_list.html5 muss jetzt die ID '#map-canvas' zu finden sein:

    HTML-Code:
         <div id="map-wrapper">
                <div id="map-canvas"></div>
                <div id="store-js">
                	<?= $this->scriptMap; ?>
                </div>
            </div>
        

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •