Chcesz, żeby użytkownikom wyświetlały się szalone okienka? Chcesz, żeby te okienka wyświetlały się użytkownikom, którzy są na Twojej stronie pierwszy raz? Pop Up dla wszystkich! Zróbmy taki o to Pop Up bez grzebania w kodzie strony.
Jak uruchomić Pop Up z Google Tag Managerem?
Od paru miesięcy szaleje moda na wyskakujące okienka w stylu – „Hej helo! Ja patrzę, że Ty patrzysz. A może tak zapis do newslettera? Dla Ciebie kierowniku wszystko za pół ceny tylko kliknij tu! Tu! TU!”. Żeby pokazywać takie komunikaty musimy mieć użytkownika, czyli jego ciasteczkowy okruszek – cookie i wykonaną akcję – kliknięcie bądź nie w magiczne „TU!”. Teraz, żeby wyświetlić mu komunikat musimy to wszystko połączyć i bach gwałtowny wzrost sprzedaży gwarantowany.
Możemy uruchomić taki komunikat babrząc się w kodzie strony, albo dodać go przez GTM.
Uruchamianie Pop Up przez GTM
Ja uruchomiłam taki komunikat dla SEM by Me w celu informowania użytkowników o tym, że są śledzeni. Komunikat wyświetla się tylko nowym użytkownikom, którzy są identyfikowani właśnie po ich cookies, a wygląda to tak:
W celu wyświetlenia takich informacji nowym użytkownikom należy zalogować się do Google Tag Managera i wybrać Nowy. Następnie z menu po prawej stronie wybieracie Niestandardowy Kod HTML i wpisujecie kod. Tu znajdziecie informacje o podstawowej konfiguracji Tagu w Google Tag Manager.
Cały kod wygląda w następujący sposób:
<link rel=”stylesheet” type=”text/css” href=”//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.css”/> // odwołanie do biblioteki z ciastkami – to wie jakie ciastko jest znane a jakie nie znane
<script src=”//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.js”></script>
<script>
window.addEventListener(„load”, function(){
window.cookieconsent.initialise({
„palette”: {
„popup”: { // ostylowanie szarego tła i tekstu
„background”: „#ebebeb”,
„text”: „#3c3c3c”
},
„button”: { // ostylowanie przycisku
„background”: „#8e9090”,
„text”: „#ffffff”
}
},
„theme”: „edgeless”,
„content”: {
„message”: „Ta strona wykorzystuje pliki cookie. Jeżeli wyrażasz zgodę na zapisywanie informacji zawartej w cookies kliknij na OK; w prawym rogu tej informacji. Jeśli nie wyrażasz zgody, ustawienia dotyczące plików cookies możesz zmienić w swojej przeglądarce.”, // tekst wiadomości wyświetlanej użytkownikom
„dismiss”: „OK”, // zgoda na to, żeby zbierać ciastka
„link”: „Dowiedz się więcej”, // miejsce, w którym znajduje się link
„href”: „http://sembyme.pl/sembyme/polityka-prywatnosci/” // link przekierowujący użytkownika do innej podstrony
}
})});
</script>
W przypadku tej konfiguracji komunikat Pop Up pojawia się użytkownikom po tym jak załadowane zostaną element DOM. A tak prościej jak strona wygląda tak jak wyglądać powinna, a nie w trakcie ładowania elementów np. obrazów.
Do konfiguracji prostych Pop Upów i Web Pushy nie potrzebujemy rzeszy ludzi. Wystarczy tak na prawdę wiedzieć gdzie szukać informacji i mniej więcej ogarniać swoją stronę.
Ja korzystam najczęściej z tych dwóch bibliotek getbootstrap.com i cdnjs.com . Są ok, mają dobre rozwiązania i wciąż się rozwijają.