Umieszczanie dynamicznej treści na landing page

Ostatnia aktualizacja: 15.03.2019

Istnieje możliwość przechwycenia parametrów przekazywanych w adresie landing page’a  (parametry GET) i wyświetlenia ich na stronie. Użyjmy poniższego przykładu:

https://www.landpage.co/dynamic-text-replacement?name=Buy%20Landingi%20now%20and%20start%20getting%20leads%20like%20a%20pro

Parametry GET w URL rozpoczynają się po znaku „?”, w tym przypadku jest to „name”.

Załóżmy, że chcemy utworzyć mailing do naszej listy kontaktów i naszym celem jest, by rozsyłane maile zawierały linki do naszego landing page. To dobra okazja, żeby spersonalizować przekaz do odbiorców mailingu, np. poprzez dodanie imienia adresata na landingu.

1. Aby to zrobić, przejdź do Dashboard’a swojego landing page’a i utwórz nowy skrypt, wklejając poniższy kod do zakładki Kody JavaScript na rekomendowanej pozycji Body na dole na Stronie głównej.

<script>
(function(){
    'use strict';
    var urlVars = getUrlVars();
    var findDynamicPhrases = new RegExp('\%(.*?)\%', 'g');
    var findPercent = new RegExp('%', 'g');
    var sections = $('.widget-text');
    function escapeOutput(toOutput){
    	return toOutput.replace(/\&/g, '&')
        .replace(/\</g, '<')
        .replace(/\>/g, '>')
        .replace(/\"/g, '"')
        .replace(/\'/g, '&#x27')
        .replace(/\//g, '&#x2F');
		}

    function convertPhrase(string) {
        string = string.replace(findPercent, '').split('||');
        var dynamic = string[0];
        var fallback = string[1];
        var result = fallback;
        if ($.isEmptyObject(urlVars)) {
            return result;
        }
        $.each(urlVars, function (key, value) {
            if (value === '') {
                return false;
            }
            var findKey = new RegExp('{{'+key+'}}', 'g');
            if (dynamic.match(findKey)) {
                result = dynamic.replace(findKey, decodeURIComponent(value));
                return false;
            }
        });
        return escapeOutput(result);
    }

    sections.html(function(i, old){
        return old.replace(findDynamicPhrases, convertPhrase);
    });
})();
</script>
Umieszczanie dynamicznej treści

2. Następnie wejdź do edytora landing page’a i dodaj odpowiedni tekst w porządanym miejscu, zgodnie z poniższym wzorem:

%Cześć {{name}},||Cześć!%

Treść zdania można dowolnie zmienić – ważne, aby całe zdanie znalazło się pomiędzy znakami „%”.

W podwójnym nawiasie klamrowym podajemy nazwę parametru, który ma zostać przekazany jako dynamiczna treść.

Po dwóch znakach „|” umieszczamy alternatywny tekst, jeśli z jakiegoś powodu szukany przez nas parametr GET nie znajdzie się w linku.

Czy ten artykuł był dla Ciebie pomocny?

Nadal potrzebujesz pomocy?

Skontaktuj się z naszym supportem. Chętnie pomożemy.
Wyślij nam wiadomość
Ta strona używa plików cookies w celach analitycznych. Polityka prywatności.