HubSpot-lomakkeen määrittäminen ja muotoilu ulkoisella sivustolla

Kun olet luonut lomakkeen HubSpotissa, voit lisätä sen HubSpotin sivuille tai sivuille, jotka olet luonut HubSpotin ulkopuolella. Lomakkeita voidaan jakaa ulkoisella, muulla kuin HubSpotin isännöimättömällä sivustolla joko

• Upottamalla lomakkeen koodi olemassa olevaan sivuun.
• Luomalla erillisen lomakesivun, johon voit linkittää.

Kummallakin menetelmällä HubSpotin lomaketyökalussa lomakkeeseen tehdyt muutokset heijastuvat automaattisesti ulkoisen sivustosi live-lomakkeeseen. Kun olet lisännyt lomakkeen, voitmuotoilla upotetun HubSpot-lomakkeen ulkoisilla sivuillasi lomakeditorissa tai ulkoisen tyylitaulukkosi CSS:llä.

Jos työskentelet WordPressin kanssa, opettele, miten lisätä lomake WordPress-virkaan tai -sivuun.

Lisää lomakkeen upotuskoodi

• Siirry HubSpot-tililläsi kohtaan Markkinointi > Liidien kaappaus > Lomakkeet.
• Vie hiiren kursori lomakkeen päälle ja valitse Toiminnot > Jaa.
• Jos haluat lisätä lomakkeen lähettäneet yhteyshenkilöt Salesforce-kampanjaan, napsauta valintaikkunassa Lisää yhteyshenkilöt Salesforce-kampanjaan -pudotusvalikkoa ja valitse kampanja. Jos yhdistät lomakkeeseen Salesforce-kampanjan, lomakkeen upotuskoodi muuttuu. Tällöin sinun on lisättävä upotuskoodi uudelleen ulkoiseen sivustoosi.
• Napsauta Copy (Kopioi).
• Liitä upotuskoodi ulkoisen sivusi HTML-moduuliin. Jotta voit seurata lomakkeesi analytiikkaa, HubSpot-seurantakoodisi on asennettava ulkoiselle sivulle, johon sijoitat HubSpot-lomakkeen.

Luo itsenäinen lomakesivu

Voit myös jakaa lomakkeesi Jaa-linkin kautta. Jaa-linkissä lomake näkyy erillisellä sivulla omalla URL-osoitteellaan. Tätä jakolinkkiä ei voi piilottaa tai tehdä yksityiseksi. Kuka tahansa, jolla on jakolinkki, voi käyttää lomaketta.

• Siirry HubSpot-tililläsi kohtaan Markkinointi > Liidien kaappaus > Lomakkeet.
• Vie hiiren kursori lomakkeen päälle ja valitse Toiminnot > Jaa.
• Napsauta valintaikkunassa Jaa-linkki-välilehteä .
• Kopioi lomakkeen sivun URL-osoite leikepöydälle valitsemalla Kopioi.
• Avaa selaimessa uusi ikkuna tai välilehti ja liitä lomakesivun URL-osoite osoitepalkkiin ladataksesi sen. Voit myös jakaa lomakesivun URL-osoitteen suoraan muille, jotta he pääsevät käyttämään lomaketta.
  
  

Muotoile upotettu lomake lomakeeditorissa

Kun muotoilet upotetun lomakkeesi HubSpotin lomakeditorilla, voit joko käyttää teemaa tai soveltaa omaa mukautettua tyyliäsi.

Huomaa: Lomake-editorissa asetettuja teemoja ja tyylejä sovelletaan vain upotettuihin lomakkeisiin tai itsenäisiin lomakesivuihin. HubSpot-sivujen lomakkeita voi tyylitellä vain sisältöeditorinlomakemoduulin tyyliasetuksilla.

Muotoile lomakkeesi teemalla

Jos haluat tyylitellä lomakkeesi kirjoittamatta mitään mukautettua koodia, voit soveltaa esiasetettuja teemoja upotettuun lomakkeeseen tai erilliseen lomakesivuun. Nämä teemat lisäävät lomakkeillesi lisää mukautusvaihtoehtoja kaikkien globaalien lomaketyyliasetusten lisäksi.

Lomakkeen tyylittely teemalla:

• Siirry HubSpot-tililläsi kohtaan Markkinointi > Liidien kaappaus > Lomakkeet.
• Vie hiiren kursori lomakkeen päälle ja valitse Muokkaa.
• Napsauta lomakeeditorissatyyli- ja esikatseluvälilehteä.
• Jos muokkaat vanhaa lomaketta, poista vasemmanpuoleisessa ruudussaPitäkää vanha teema-valintaruudun valinta. Tämä poistaa tähän lomakkeeseen sovelletun entisen HubSpotin oletusmuotoilun. Lomakkeeseen lisäämäsi mukautettu CSS tai JavaScript ei enää toimi. Tämä valintaruutu ei koske tilillesi luotuja uusia lomakkeita.
• Valitse teema.
• Napsauta oikeassa yläkulmassaJulkaise taiPäivitä.

Käytä mukautettua tyyliä

Jossinulla on Marketing Hub Starter-,Professional- tai Enterprise-tilaus HubSpot-tilisi yhteydessä, voit myös tyylitellä upotettuja lomakkeita tarkemmalla tasolla.

Voit käyttää mukautettua tyyliä:

• Siirry HubSpot-tililläsi kohtaan Markkinointi > Liidien kaappaus > Lomakkeet.
• Vie hiiren kursori lomakkeen päälle ja valitse Muokkaa.
• Napsauta lomakeeditorissaTyyli ja esikatselu-välilehteä.
• Napsauta vasemmassa ruudussaTyyli-osiota. Täällä voit määrittää lomakekentän leveyden, kirjasinperheen, fonttikoot, fonttivärit ja lomakepainikkeen. Nämä tyylit määritetään lomakekohtaisesti, ja ne ohittavat lomakkeen yleiset tyyliasetukset.
  
• Kun olet mukauttanut lomakkeen,napsauta oikeassa yläkulmassaJulkaise taiPäivitä.
  
  

Sisällytetyn lomakkeen tyylittely ulkoisessa tyylitaulussa olevalla CSS:llä

Jos sinulla on Marketing Hub- tai CMS Hub Professional- tai Enterprise-tilaus HubSpot-tilisi yhteydessä, voit upottaa lomakkeesi raakana HTML-lomakkeena ja tyylitellä tämän upotetun lomakkeen CSS:llä ulkoisessa tyylitaulussa.

Tyylitelläksesi upotetun lomakkeen CSS:llä:

• Siirry HubSpot-tililläsi kohtaan Markkinointi > Liidien kaappaus > Lomakkeet.
• Vie hiiren kursori lomakkeen päälle ja valitse Muokkaa.
• Napsauta lomakkeen editorissatyyli- ja esikatseluvälilehteä.
• NapsautaSet as raw HTMLform -kytkintä päälle. Lomake renderöityy ulkoisella sivulla raakana HTML-elementtinä eikä iframe-kehyksen sisällä, ja kaikki lomakkeeseen sovelletut HubSpotin oletusmuotoilut poistetaan.
• Napsauta oikeassa yläkulmassa Julkaise tai Päivitä .
• Lisää lomakkeen upotuskoodi ulkoiselle sivullesi. Jos olet jo upottanut lomakkeen, sinun onkorvattava nykyinen upotuskoodi tällä uudella, tyylittelemättömällä versiolla. Kun olet upottanut lomakkeen:
  
  • Voit muotoilla lomakkeen ulkoisessa tyylitaulussa CSS:llä.
  • Voit myösmuokata lomakkeen upotuskoodia tehdessäsi muita lomakkeen mukautuksia. KoskaHubSpot-lomakkeet on rakennettu JavaScriptillä, ei HTML:llä,lomakkeen upotuskoodinmukauttaminenvaatii JavaScriptin kanssa työskentelyyn perehtyneen kehittäjän apua.