Napsautettu elementti -tapahtuma seuraa, kun nimetön kävijä tai HubSpot-yhteyshenkilö napsauttaa tiettyä elementtiä verkkosivustollasi. Seuraa esimerkiksi, kun ilmaisen demon CTA- tai PDF-latauslinkkiä napsautetaan. Napsautettu elementti -tapahtumia voidaan luoda ja seurata vain sivuilla, joille on asennettu HubSpot-seurantakoodi.
Huom:
- Tämän artikkelin ohjeet koskevat uutta mukautettua käyttäytymistapahtumatyökalua, joka korvaa aiemman käyttäytymistapahtumatyökalun. Kaikki vanhalla työkalulla luodut tapahtumat toimivat edelleen, ja voit edelleen hallita ja analysoida näitä tapahtumia vanhalla työkalulla.
- Vanhoja tapahtumia ei voi siirtää uuteen tapahtumatyökaluun. Sen sijaan on suositeltavaa luoda vanhat tapahtumat uudelleen uudessa työkalussa, sillä uudet mukautetut tapahtumat tarjoavat enemmän joustavuutta tapahtuman ominaisuuksien suhteen. Esimerkiksi vanhoilla tapahtumilla sinun täytyi luoda useita tapahtumia erillisten kampanjoiden seuraamiseksi, mutta nyt yksi mukautettu käyttäytymistapahtuma voi seurata useita kampanjoita.
Napsautetun elementin tapahtumia voidaan luoda kahdella tavalla:
Kun olet luonut tapahtumat, opettele analysoimaan tapahtumia analytiikka- ja raportointityökaluissa. Voit myös luoda vierailtu URL-osoite -tapahtumia jamukautettuja tapahtumia.
Luo klikatun elementin tapahtumia Chrome-laajennuksella
Asenna tapahtuma Chrome-laajennus
- Siirry vasemman sivupalkin valikossa kohtaan Seuranta ja analytiikka >Seurantakoodi.
- Napsauta . Asenna tapahtuman Chrome-laajennus.
- NapsautaLataa.
- Sinut ohjataan HubSpot Analytics -laajennukseen Google Chrome -verkkokaupassa. Napsauta oikeassa yläkulmassaLisää Chromeen.
- Napsauta valintaikkunassaLisää laajennus.
- Kun laajennus on asennettu, se näkyy Chrome-selaimesi työkalupalkissa oranssina hammasratas-kuvakkeena.
Tapahtuman luominen tapahtuman Chrome-laajennuksella
- Siirry verkkosivulle, johon on asennettu HubSpot-seurantakoodisi.
- Napsauta Chrome-selaimen työkalupalkissa -kiekkoa . ketjukuvake.
- Valitse valintaikkunassaClicked element.
- NapsautaSeuraava. Tämän jälkeen voit valita sivulla olevan elementin, jota haluat seurata.
- Napsauta sivulla olevaaelementtiä, jolle haluat luoda clicked element -tapahtuman. Alla olevassa esimerkissä clicked element -tapahtuma seuraa key aspects-linkkiä klikkauksia.
- ElementinCSS-valitsinluodaan valintaikkunassa automaattisesti. Annatapahtumallenimija napsauta sitten Luo tapahtuma.
Huomaa: Sivustosi HTML- ja CSS-merkintöjen monimutkaisuudesta riippuen Chrome-tapahtumalaajennus ei ehkä pysty tunnistamaan elementin yksilöllistä CSS-valitsinta. Tässä tapauksessa sinun on luotava tapahtuma manuaalisesti tai lisättävä elementtiin sen sijaan yksilöllinen id-tunniste.
- Kun tapahtuma on luotu onnistuneesti, näkyviin tulee vahvistusviesti. NapsautaNäytä tapahtuma HubSpotissa nähdäksesi uuden napsautetun elementin tapahtuman tapahtumien kojelaudassa.
HubSpot alkaa tämän jälkeen seurata elementtiä. Lue, miten tapahtumaa analysoidaan HubSpotissa.
Luo tapahtuma manuaalisesti käyttämällä ID:tä, luokkaa tai jQuery-valitsinta.
- Napsauta Custom Behavioral Tapahtumat.
- Napsauta oikeassa yläkulmassaLuo tapahtuma.
- Kirjoita tapahtumalle nimi oikeassa paneelissa, valitse sitten Clicked element.
- NapsautaSeuraava.
- Valitse, miten haluat tunnistaa napsautetun elementin sivulla. Lue lisää siitä, miten tunnisteita etsitään verkkosivuston sivulta.
- HTML-tunnus: Kirjoita sen elementin tunnus, jota haluat seurata. Jos napsautettu elementtisi on esimerkiksi asetettu <button id="log-in">, kirjoitat esimerkiksilog-in.
- HTML Class: Syötä sen elementin luokka, jota haluat seurata. Jos esimerkiksi napsautettu elementti on määritetty <button class="bigCTA">, kirjoita bigCTA.
- jQuery-selektori: Kirjoita sen elementin jQuery-selektori , jota haluat seurata
.
- NapsautaSeuraava.
- Oletusarvoisesti napsautettua elementtiä seurataan kaikilla sivuilla, joihin on asennettu HubSpot-seurantakoodi. Jos haluat seurata elementin napsautuksia vain tietyllä sivulla, valitse Specific page (tietty sivu) ja anna sitten sivun URL-osoite.
Tapahtuman luomisen jälkeen HubSpot alkaa seurata elementtiä. Lue, miten tapahtumaa analysoidaan HubSpotissa.
Elementtivalitsimien ymmärtäminen ja hakeminen
Voit tunnistaa elementin sen HTML-tunnuksen, HTML-luokan tai jQuery-valitsimen avulla.
ID
Elementin ID:n etsiminen ja käyttäminen:
- Napsauta hiiren kakkospainikkeella sivua, jolla on kohteena oleva elementti, ja valitseNäytä sivun lähdetaiTarkista.
- Napsauta elementtiä. Sinun pitäisi nähdä ID-attribuutti koodirivillä (esim. id="uniikki elementin nimi").
- Kopioi ID-arvo ja liitä se (esim. tässä tapauksessa unique-element-name) HTML ID-kenttään ilman lainausmerkkejä. Jos esimerkiksi elementissä on
id="get-started-marketing-hub", kenttään kirjoitetaanget-started-marketing-hub.
Luokka
Napsautetun elementin tapahtuma voi tunnistaa elementin sen class-attribuutin avulla.
Huom:
- Kun useilla sivulla olevilla elementeillä on sama luokka, vain sivun ensimmäinen elementti lasketaan tapahtuman loppuunsaattamiseen. Siksi luokkaa kannattaa käyttää tunnisteena vain silloin, kun mikään muu elementti sivulla ei jaa kyseistä luokkaa. Jos elementillä ei ole yksilöllistä luokkaa, on suositeltavaa käyttää sen sijaan ID:tä.
- Jos et pysty päivittämään elementin lähdekoodia lisäämällä siihen yksilöllisen luokan tai ID:n, on suositeltavaa käyttää tapahtuman määrittämiseen Chrome-laajennusta, sillä HubSpot määrittää tarkemman tunnisteen.
Voit etsiä elementin luokan ja käyttää sitä tapahtumassa:
- Napsauta hiiren kakkospainikkeella sivua, jossa on kohteena oleva elementti, ja valitseNäytä sivun lähdetaiTarkasta.
- Napsauta elementtiä. Sinun pitäisi nähdä luokka-attribuutti koodirivillä (esim. class="unique-element-name").
- Kopioi luokan arvo ja liitä se HTML Class -kenttään ilman lainausmerkkejä. Esimerkiksi elementille, joka sisältää kenttään.
- Kun elementillä on useita luokkia, voit käyttää mitä tahansa sen luokkia kohteena. Jos esimerkiksi elementti sisältää
class="cta--primary cta--medium homepage-sales", voit kirjoittaa HTML Class -kenttään cta--primary, cta--medium tai homepage-sales. Varmista kuitenkin, että mikään muu elementti ei jaa tätä luokkaa.
- Kun yhdistät useita luokkia, käytä seuraavaa muotoa:
class1.class2.class3.
jQuery-valitsin
Voit myös käyttää täydellisiä jQuery-valitsimia elementtien kohdistamiseen. Tämä on hyödyllistä, jos kohdistettavalla elementillä ei ole tunnusta tai luokkaa tai jos haluat olla tarkempi.
Haluat esimerkiksi luoda clicked-elementtitapahtuman käyttämällä jQuery-valitsinta seuraavalle elementille:
<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">Get started</a>.
Elementin ID:n tai luokan käyttämisen sijaan voit käyttää jQuery-selektoria kohdistamaan elementin href-ominaisuutta kirjoittamallajQuery-selektorikenttäänseuraavan tekstin:
[href='https://www.hubspot.com/products/marketing/get-started']
Lisätietojatuetuista valintalaitteista.