Na czym to polega w sklepie
Trigger Click - All Elements z filtrem Click Element matches CSS selector pozwala precyzyjnie wskazać przyciski po klasie, ID lub atrybucie, np. button.add-to-cart lub [data-action="buy"].
Przykład ze sklepu internetowego
Przycisk „Dodaj do koszyka” na karcie produktu ma stabilną klasę i data-sku:
Trigger: Click - All Elements
Fire when: Click Element matches CSS selector
button.add-to-cart, [data-action="add-to-cart"]
// Zmienna Custom JavaScript - SKU z atrybutu klikniętego elementu:
function() {
var el = {{Click Element}};
return el ? el.getAttribute('data-sku') : undefined;
}
GA4 Event: add_to_cart
items = [{ item_id: {{JS - click_sku}}, quantity: 1 }]Co zrobić po stronie biznesu
- Preferuj data-* zamiast klas stylów - redesign CSS nie psuje pomiaru.
- Jeden selektor na trigger - dla wielu CTA rozważ Lookup Table lub osobne triggery.
- Testuj w Preview klikając mobile i desktop - inny DOM może wymagać dwóch selektorów.
W skrócie
selektor CSS to szybki sposób na tagowanie przycisków bez angażowania devów przy każdym nowym banerze - o ile selektory są stabilne.