Siirry sisältöön
Huomaa: Tämän artikkelin käännös on tarkoitettu vain tiedoksi. Käännös on luotu automaattisesti käännösohjelmiston avulla, eikä sitä ole välttämättä tarkistettu. Näin ollen tämän artikkelin englanninkielistä versiota on pidettävä hallitsevana versiona, joka sisältää uusimmat tiedot. Voit tutustua siihen täällä.
Design Manager

Rakenna mukautettu koodattu malli

Päivitetty viimeksi: marraskuuta 22, 2021

Tämä koskee seuraavia:

Markkinointi Hub Professional, Enterprise
Sisällön hallintajärjestelmä Hub Starter, Professional, Enterprise
Vanhentunut Marketing Hub Basic-versio

Suunnittelijat voivat rakentaa verkkosivu-, aloitussivu- ja blogimalleja tyhjästä HTML:n avulla. On myös mahdollista kloonaamalla HubSpot-mallin ulkoasu HTML-muotoon ja muokata sitä koodatuksi malliksi.

Huomaa:
  • CMS Hub Starter -tileillä ei voi käyttää mukautettuja koodattuja malleja laskeutumissivuilla .
  • Marketing Hub Professional- ja Enterprise-tileillä voidaan luoda myös mukautettuja koodattuja sähköpostimalleja.

Tämä artikkeli sisältää tietoa siitä, miten luoda ja korjata vikoja mukautettujen koodattujen mallien osalta, sekä mitä HubL:ää tarvitaan malleissasi. Jos koodin kanssa työskentely ei tunnu mukavalta, käytä jotakin HubSpot-tililläsi olevaa valmista mallia tai tutustu osoitteessa mallien markkinapaikka osoitteeseen osta valmiita malleja.

Huomaa: mukautetusti koodattu malli ei ole oletusarvoisesti responsiivinen. Tee yhteistyötä ammattimaisen suunnittelijan kanssa varmistaaksesi, että mallineesi on responsiivinen eri näyttökokoja varten.

Luo uusi HTML & HUBL-tiedosto

  • Siirry HubSpot-tililläsi kohtaan Markkinointi > Tiedostot ja mallipohjat > Suunnittelutyökalut.
  • Luo vasemmassa sivupalkissa uusi tiedosto valitsemallaTiedosto>Uusi tiedosto.Sinun on ehkä napsautettavakansiota kansion kuvake laajentaaksesi hakemistoa.
  • Napsauta valintaikkunassaMitä haluat rakentaa tänään?-pudotusvalikkoa ja valitse sittenHTML & HUBL.
design-manager-html-hubl
  • NapsautaSeuraava
  • Kirjoita uuden tiedoston tiedot:
    • ValitseTemplatetaiTemplate Partial. Mallin osa on malli, jota voidaan käyttää muiden mallien sisällä.
    • Valitse pudotusvalikosta koodaamasi mallin tyyppi (sivu, blogi tai sähköposti).
    • Anna tiedostollesi nimi.
    • Jos haluat päivittää tiedoston sijainnin, valitseTiedoston sijainti-osiossaMuutaja valitse kansio, johon haluat lisätä tiedoston.
  • NapsautaLuo.
  • Kirjoita sivun tai sähköpostimallin HTML-koodi.
  • Jos haluat esikatsella, miten HubL renderöi, napsauta Näytä tulostus -kytkintä. Oikealle avautuu paneeli, jossa on renderöity esikatselu.


    design-manager-show-output
  • Napsauta oikeassa yläkulmassa Preview (Esikatselu ), jotta voit esikatsella, miten mallisi näkyy ja toimii sisältöeditorissa. Tämä esikatselu synkronoituu editorin kanssa ja päivittyy automaattisesti työskentelyn aikana.
  • Napsauta oikeassa yläkulmassaJulkaise muutokset
Kaikki koodissasi olevat virheet näkyvät virheilmoituksessa, kun yrität julkaista muutoksia. Koodieditorin alareunassa oleva virhekonsoli näyttää virheen tai varoituksen yksityiskohdat sekä ehdotuksia siitä, miten voit korjata nämä virheet ja varoitukset.

error-console

Lisätietoja mukautetusta suunnittelusta saatHubSpot designer -dokumentaatiosta. Siellä onlisädokumentaatiota koodatuista moduulivaihtoehdoista, kuten suodatintunnisteista ja kuvakkeista.

Lisää tarvittavat HubL-tunnisteet

Näet virheilmoituksen, jos koodistasi puuttuu jokin vaadittu HubL-tunniste, jos yrität julkaista tiedoston.

Web-sivusto-, aloitussivu- ja blogimallit vaativat seuraavat tunnisteet:

  • {{standard_footer_includes}}
  • {{standard_header_includes}}
Sähköpostimallit vaativat seuraavat tunnisteet ollakseen CAN-SPAM-yhteensopivia. Ne voidaan lisätä kahdella tavalla:
  • Sisällytä tämä token, joka vetää unsubscribe CAN-SPAM -osion: {{unsubscribe_section}}. Lisää sitten nämä tokenit yksitellen:
    • {{site_settings.company_street_address_1}}
    • {{site_settings.company_city}}
    • {{site_settings.company_state}}
    • {{site_settings.company_zip}}
    • Tällä menetelmällä et voi muotoilla tekstin ja linkkien kieltä ja tyyliä.

  • Käytä näitä merkkejä yksitellen.:
    • {{site_settings.company_name}}
    • {{unsubscribe_link}} tai {{unsubscribe_link_all}} (sisällytä vähintään yksi)
    • {{unsubscribe_anchor}}
    • {{site_settings.company_name}}
    • {{site_settings.company_street_address_1}}
    • {{site_settings.company_city}}{{site_settings.company_state}}
    • {{site_settings.company_zip}}
    • Käyttämällä merkkejä yksitellen voit joustavasti lisätä sanamuotoja merkkien ja linkkien ympärille ja muotoilla ne haluamallasi tyylillä ja kielellä.

Kloonaa HTML:ksi

Sen lisäksi, että voit luoda mallin tyhjästä, voit myös kloonata jonkin HubSpotin mallin HTML-muotoon. Kloonaamalla mallin HTML:ksi saat käyttöösi mallin HTML-sisällön.

Voit luoda koodatun version olemassa olevasta mallista:

  • Siirry HubSpot-tililläsi kohtaan Markkinointi > Tiedostot ja mallipohjat > Suunnittelutyökalut.
  • Napsautatoimintoja>Kloonaa HTML:ksi hakemistossa. HTML-tiedosto luodaan samaan kansioon kuin alkuperäinen tiedosto. Sen tiedostonimi vastaa alkuperäisen mallin nimeä, johon on liitettykopio.
design-manager-clone-to-html