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

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

• Lomakekoodin upottaminen olemassa olevaan sivuun.
• Luomalla itsenäinen lomakesivu, johon voit linkittää.

Kummallakin menetelmällä HubSpotin lomaketyökalussa lomakkeeseen tehdyt muutokset heijastuvat automaattisesti ulkoisen sivustosi live-lomakkeeseen. Kun olet lisännyt lomakkeen, voittyylitellä upotetun HubSpot-lomakkeen ulkoisilla sivuillasi lomake-editorissa tai CSS:llä ulkoisessa tyylitaulussa.

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ä lomakkeen sivun URL-osoite osoiteriville, jotta se latautuu. 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 lomakkeen HubSpot-lomakeeditorilla, 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 tai Pä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 ruudussa Tyyli-osiota . Täällä voit määrittää lomakekentän leveyden, kirjasinperheen, fonttikoot, kirjasinvärit ja lomakepainikkeen. Nämä tyylit määritetään lomakekohtaisesti, ja ne ohittavat lomakkeen yleiset tyyliasetukset.
  
• Kun olet mukauttanut lomakkeen, napsauta oikeassa yläkulmassaJulkaise tai Päivitä.
  
  

Muotoile upotettu lomake CSS:llä ulkoisessa tyylitaulussa.

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 lomakeeditorissatyyli- ja esikatseluvälilehteä .
• NapsautaSet as raw HTML form -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 on korvattava nykyinen upotuskoodi tällä uudella, muokkaamattomalla versiolla. Lomakkeen upottamisen jälkeen:
  
  • Voit muotoilla lomakkeen ulkoisessa tyylitaulussa CSS:llä.
  • Voit myös muokata lomakkeen upotuskoodia , jotta voit tehdä lisää lomakkeen mukautuksia. Koska HubSpot-lomakkeet on rakennettu JavaScriptillä, ei HTML:llä,lomakkeen upotuskoodin muokkaaminenvaatii JavaScriptin kanssa työskentelyyn perehtyneen kehittäjän apua.