Uwaga: Tłumaczenie tego artykułu jest podane wyłącznie dla wygody. Tłumaczenie jest tworzone automatycznie za pomocą oprogramowania tłumaczącego i mogło nie zostać sprawdzone. W związku z tym, angielska wersja tego artykułu powinna być uważana za wersję obowiązującą, zawierającą najnowsze informacje. Możesz uzyskać do niej dostęp tutaj.

Tworzenie zdarzeń klikniętego elementu

Data ostatniej aktualizacji: stycznia 20, 2023

Dostępne z każdą z następujących podpisów, z wyjątkiem miejsc, w których zaznaczono:

Marketing Hub Enterprise

Zdarzenie klikniętego elementu śledzi, kiedy anonimowy odwiedzający lub kontakt HubSpot kliknie określony element w Twojej witrynie. Na przykład, śledzenie kliknięcia linku CTA bezpłatnej wersji demonstracyjnej lub linku do pobrania pliku PDF. Zdarzenia klikniętych elementów można tworzyć i śledzić tylko na stronach, które mają zainstalowany kod śledzenia HubSpot.

Uwaga:

Instrukcje zawarte w tym artykule dotyczą nowego narzędzia niestandardowych zdarzeń behawioralnych, które zastępuje poprzednie narzędzie zdarzeń behawioralnych. Wszelkie zdarzenia utworzone w starszym narzędziu będą nadal działać, a użytkownik może nadal zarządzać tymi zdarzeniami i analizować je w starszym narzędziu.
Starszych zdarzeń nie można migrować do nowego narzędzia zdarzeń. Zamiast tego zaleca się odtworzenie starszych zdarzeń w nowym narzędziu, ponieważ nowe zdarzenia niestandardowe zapewniają większą elastyczność w zakresie właściwości zdarzeń. Na przykład, w starszych zdarzeniach trzeba było utworzyć wiele zdarzeń, aby śledzić oddzielne kampanie, ale teraz jedno niestandardowe zdarzenie behawioralne może śledzić wiele kampanii.

Zdarzenia elementów klikniętych można tworzyć na dwa sposoby:

Zainstaluj i użyj rozszerzenia Chrome zdarzenia dla prostych klikniętych zdarzeń, takich jak hiperłącza i obrazy.
Ręcznie utwórz zdarzenie za pomocą ID, klasy lub selektora jQuery dla bardziej złożonych treści, takich jak CTA.

Po utworzeniu zdarzeń dowiedz się, jak analizować zdarzenia w narzędziach analitycznych i raportowych. Możesz również tworzyć zdarzenia odwiedzonych adresów URL orazzdarzenia niestandardowe.

Tworzenie zdarzeń klikniętego elementu za pomocą rozszerzenia Chrome

Zainstaluj rozszerzenie Chrome dotyczące zdarzeń

Na koncie HubSpot kliknij settings ikonę ustawień w górnym pasku nawigacyjnym.
W menu lewego paska bocznego przejdź do Śledzenie i analiza >Kod śledzenia.
Kliknij przycisk . Zainstaluj rozszerzenie chrome event.
Kliknij przyciskPobierz.
Zostaniesz przekierowany do rozszerzenia HubSpot Analytics w sklepie internetowym Google Chrome. W prawym górnym rogu kliknij przyciskDodaj do Chrome.

W oknie dialogowym kliknijDodaj rozszerzenie.
Po zainstalowaniu rozszerzenia pojawi się ono na pasku narzędzi przeglądarki Chrome w postaci pomarańczowej ikony zębatki.

Tworzenie wydarzenia za pomocą rozszerzenia wydarzenia Chrome

Przejdź do strony internetowej z zainstalowanym kodem śledzenia HubSpot.
Na pasku narzędzi przeglądarki Chrome kliknijzębatkę ikona koła łańcuchowego.
W oknie dialogowym zaznacz opcjęKliknięty element.
Kliknij przyciskDalej. Następnie będziesz mógł wybrać element na stronie, który chcesz śledzić.
Kliknijelementna stronie,dla którego chcesz utworzyć zdarzenie elementu klikniętego.W poniższym przykładzie zdarzenie elementu klikniętego będzie śledzić kliknięcia w link kluczowych aspektów.

W oknie dialogowym zostanie automatycznie wygenerowanyselektorCSS elementu. Wprowadźnazwęzdarzenia, a następnie kliknij przycisk Utwórzzdarzenie.

Uwaga.: w zależności od złożoności znaczników HTML i CSS witryny rozszerzenie zdarzenia Chrome może nie być w stanie wykryć unikatowego selektora CSS dla elementu. W takim przypadku należy ręcznie utworzyć zdarzenie lub zamiast tego dodać unikalny znacznik id do elementu.

Po pomyślnym utworzeniu zdarzenia zostanie wyświetlony komunikat z potwierdzeniem. Kliknij przyciskWyświetl zdarzenie w HubSpot, aby wyświetlić nowe zdarzenie klikniętego elementu w pulpicie nawigacyjnym zdarzeń.

Następnie HubSpot rozpocznie śledzenie tego elementu. Dowiedz się, jak analizować zdarzenie w HubSpot.

Ręcznie utwórz zdarzenie, używając identyfikatora, klasy lub selektora jQuery

Kliknij przycisk Niestandardowe zachowanie Zdarzenia.
W prawym górnym rogu kliknij przyciskUtwórz zdarzenie.
W prawym panelu wprowadź nazwę zdarzenia, a następnie wybierz opcję Kliknięty element.
Kliknij przyciskDalej.
Wybierz, w jaki sposób chcesz zidentyfikować kliknięty element na stronie. Dowiedz się więcej o tym, jak znaleźć identyfikatory na stronie internetowej.
- IdentyfikatorHTML: wpisz identyfikator elementu, który chcesz śledzić. Na przykład, jeśli kliknięty element jest ustawiony jako <button id="log-in">, wpiszeszlog-in.
- Klasa HTML: wpisz klasę elementu, który chcesz śledzić. Na przykład, jeśli twój kliknięty element jest ustawiony jako <button class="bigCTA">, wprowadziłbyś bigCTA.
- Selektor jQuery: wpisz selektor jQuery elementu, który chcesz śledzić
  .
KliknijNext.
Domyślnie kliknięty element będzie śledzony na wszystkich stronach z zainstalowanym kodem śledzenia HubSpot. Aby śledzić kliknięcia elementów tylko na określonej stronie, wybierz opcję Określona strona, a następnie wprowadź adres URL strony.

Kliknij przycisk Zapisz.

Po utworzeniu zdarzenia HubSpot rozpocznie śledzenie elementu. Dowiedz się, jak analizować zdarzenie w HubSpot.

Zrozumienie i pobieranie selektorów elementów

Element można zidentyfikować na podstawie jego identyfikatora HTML, klasy HTML lub za pomocą selektora jQuery.

ID

Aby znaleźć i użyć identyfikatora elementu:

Kliknij prawym przyciskiem myszy stronę z elementem, do którego zmierzasz, i wybierzopcjęWyświetl źródło stronylubInspect.
Kliknij element. Powinieneś być w stanie zobaczyć atrybut ID w linii kodu (np. id="unique-element-name").
Skopiuj wartość ID i wklej ją (np. w tym przypadku unique-element-name) do pola HTML IDbez cudzysłowów. Na przykład, dla elementu, który zawiera id= "get-started-marketing-hub", w polu wpisujemyget-started-marketing-hub.

Klasa

Zdarzenie kliknięcia elementu może zidentyfikować element na podstawie jego atrybutu class.

Proszę zwrócić uwagę:

gdy wiele elementów na stronie ma tę samą klasę, tylko pierwszy element na stronie będzie się liczył do realizacji zdarzeń. Dlatego też, powinieneś używać klasy jako identyfikatora tylko wtedy, gdy żaden inny element na stronie nie współdzieli tej klasy. Jeśli element nie posiada unikalnej klasy, zalecane jest użycie ID zamiast niej.
Jeśli nie jesteś w stanie zaktualizować kodu źródłowego elementu, aby dodać unikalną klasę lub ID, zaleca się użycie rozszerzenia Chrome do skonfigurowania zdarzenia, ponieważ HubSpot przydzieli bardziej szczegółowy identyfikator.

Aby znaleźć klasę elementu i użyć jej dla zdarzenia:

Kliknij prawym przyciskiem myszy stronę z elementem, na który się kierujesz, i wybierzopcjęWyświetl źródło stronylubInspect.
Kliknij na element. Powinieneś być w stanie zobaczyć atrybut klasy w linii kodu (np. class="unique-element-name").
Skopiuj wartość klasy i wklej ją do pola Klasa HTML bez cudzysłowów. Na przykład, dla elementu, który zawiera w polu.
- Kiedy element posiada wiele klas, możesz użyć dowolnej z nich jako elementu docelowego. Na przykład, jeśli element zawiera class="cta--primary cta--medium homepage-sales", możesz wpisać cta--primary, cta--medium lub homepage-sales w polu Klasa HTML. Upewnij się jednak, że żaden inny element nie współdzieli tej klasy.
- Przy łączeniu wielu klas, użyj następującego formatu:class1.class2.class3.

html-class-selector-single0

Selektor jQuery

Możesz również użyć pełnych selektorów jQuery do kierowania elementów. Jest to przydatne, jeśli element, na który się kierujemy nie ma ID lub klasy, lub musimy być bardziej szczegółowi.

Na przykład, chcesz utworzyć zdarzenie klikniętego elementu za pomocą selektora jQuery dla następującego elementu:

<a id="get-started-marketing-hub" class="cta--primary" href="https://www.hubspot.com/products/marketing/get-started" aria-label="Get started with Marketing Hub">Zacznij</a>.

Zamiast używać identyfikatora elementu lub klasy, można użyć selektora jQuery, aby kierować właściwość href elementu, wpisując następujące dane do pola selektorajQuery:

[href='https://www.hubspot.com/products/marketing/get-started']

jquery-selector-field-with-value

Dowiedz się więcej oobsługiwanych selektorach.

Czy ten artykuł okazał się pomocny? Tak Nie

Niniejszy formularz służy wyłącznie do przekazywania opinii dotyczących dokumentacji. Dowiedz się, jak uzyskać pomoc dotyczącą HubSpot.