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ä.

Sisällön upottaminen upotuskoodin avulla

Päivitetty viimeksi: lokakuuta 1, 2024

Saatavilla minkä tahansa seuraavan Tilauksen kanssa, paitsi jos toisin mainitaan:

Content Hub   Professional , Enterprise

Sisällön upottamistoiminnon avulla voit luoda HubSpotissa sisällön osioita ja upottaa ne sitten verkkosivustollesi. Voit lisätä sisällön upottamisen ulkoiselle verkkosivulle joko WordPressin Gutenberg-editorin sisällön upottamisen lisäosan avulla tai kopioimalla upotuskoodin suoraan HubSpotissa.

Alla on lisätietoja sisällön upotuskoodin kopioimisesta sekä parhaita käytäntöjä sivusi Cumulative Layout Shift (CLS) -pistemäärän ylläpitämiseksi.

Huomaa: upotettua sisältöä ei ladata iframe-kehyksen kautta, vaan se syötetään JavaScriptin kautta. Hakukoneet osaavat käyttää JavaScriptiä ja havaitsevat upotetun sisällön, joten iframen aiheuttamat SEO-haasteet vältetään.

Kopioi upotuskoodi

Voit kopioida upotuskoodin sisällön upotusosioon:

  • Siirry HubSpot-tililläsi kohtaan Sisältö > Upotukset.
  • Vie hiiren kursori upotetun sisällön päälle, napsauta Lisää ja valitse Hae upotuskoodi.

    content-embed-copy-code
  • Kopioi upotuskoodi valitsemalla valintaikkunassa Kopioi.

Voit sitten liittää upotuskoodin ulkoiseen sisältöön tarpeen mukaan. Kun liität upotuskoodia, pidä seuraavat asiat mielessä:

  • Sisällön upotus saa muotoilunsa sivulta, johon se on upotettu, ei HubSpotista. Jos haluat säätää upotetun sisällön ulkoasua, sinun on päivitettävä sivun CSS-ominaisuudet. Jos käytät WordPressiä, opettele lisäämään mukautettua CSS:ää.
  • Sisällön upotuskoodi ei sisällä HubSpot-seurantakoodia. Sinun on asennettava seurantakoodi erikseen ulkoisille sivuille, jotta voit hyödyntää HubSpotin ominaisuuksia, kuten liikenneanalytiikkaa ja yksityisiä suostumusbannereita.
  • Kun haluat upottaa sisältöä upotuskoodin avulla, HubSpot lisää sisällön upotuksen oletusarvoisen hs-sites -verkkotunnuksen alatunnisteen kautta. Tämä auttaa säilyttämään verkkotunnuskohtaiset alatunnisteesi. Kaikki hs-sites -alasvetoon sisältyvä sisältö lisätään kuitenkin ulkoiselle sivulle yhdessä sisällön upotuksen kanssa. Esimerkiksi jos sinulla on tekijänoikeuslauseke hs-sites -verkkotunnuksen alatunnisteessa, tekijänoikeus näkyy ulkoisella sivulla upotetun sisällön kanssa. Lue, miten verkkotunnuskohtaisissa alatunnisteissa olevaa sisältöä muokataan.

    hs-sites-footer-html

Sisällön upottamisen parhaiden käytäntöjen ymmärtäminen

Riippuen siitä, miten käytät upotuskoodia, on mahdollista, että sisältö vaikuttaa sivusi CLS-pisteytykseen (Cumulative Layout Shift), joka mittaa, kuinka paljon sivusi sisältö liikkuu kävijän näkymäikkunassa latauksen aikana. CLS-pisteytykseen vaikuttaa kaksi tekijää:

Jos sisällön upottamisen jälkeen CLS-pistemäärääsi vaikuttaa negatiivisesti, tutustu alla oleviin parhaita käytäntöjä koskeviin osioihin mahdollisten ratkaisujen löytämiseksi.

Upota taiton alapuolelle

Sisältö olisi mahdollisuuksien mukaan upotettava sivun taiton alapuolelle. Tämä johtuu siitä, että CLS-pistemäärä koskee taiton yläpuolella olevaa sisältöä, koska kävijä yleensä näkee sen sivun ensimmäisen latauksen yhteydessä. Sisällön upottaminen taiton alapuolelle vähentää sisällön upottamisen aiheuttamaa alkuperäistä asettelun muutosta, mikä parantaa käyttäjäkokemusta ja lieventää negatiivista CLS-pistemäärää.

content-embed-layout-shift

Muuta upotusskriptin sijaintia

Sisällön upotuskoodi sisältää oletusarvoisesti upotusskriptin (rivi 2 alla).

<div id="hs-embed-61405464936-1wgzc8">
 <script type="text/javascript" src="[EMBED SCRIPT SRC]">
 </script>

 <script>
 hbspt.content.create({...});
 </script>
</div>

Kun upotat sisältöä ulkoiselle sivulle, on suositeltavaa siirtää upotusskripti sivun <head> sivulle eikä upotusskriptin luomisskriptin viereen.

Aseta vähimmäiskorkeus

Sisällön upotussäiliön korkeus vaikuttaa siihen, kuinka paljon sitä ympäröivä sisältö siirtyy latauksen aikana. Säiliön korkeus riippuu mukana olevista moduuleista ja sisällöstä - mitä enemmän sisältöä upotuksessa on, sitä enemmän sivu siirtyy.

Tästä syystä, jos upotat sisältösi yläpuolelle, on suositeltavaa asettaa upotuksen vähimmäiskorkeus sisällyttämällä upotussäiliön kääreeseen rivissä oleva min-height CSS-sääntö.

Jos upotat sisältöä ulkoiseen CMS-järjestelmään, ulkoisen sivun editorissa voi olla ulkoasuvaihtoehtoja upotuskorkeuden päivittämiseksi. Muussa tapauksessa voit lisätä tämän muotoilun manuaalisesti upotetun sisällön ylätasolle <div>, kuten alla näkyy.

<div id="hs-embed-61405464936-1wgzc8" style="min-height: 500px;">
 <script type="text/javascript" src="[EMBED SCRIPT SRC]"></script>
 <script>
 hbspt.content.create({...});
 </script>
</div>

Huomaa: jos muokkaat upotetun sisällön sivukohtaisesti, sinun on ehkä päivitettävä vähimmäiskorkeussääntöä kullakin sivulla, jotta sisältö näkyy oikein.

Minimikorkeuden löydät tarkastelemalla sivua, johon sisältö on upotettu. HubSpot-sivujen osalta voit käyttää sivun esikatseluominaisuutta vähimmäiskorkeuden löytämiseksi ennen sivun julkaisemista. Lisätietoja sisällön esikatselusta WordPressissä.

Kun tarkastelet sivua, johon on upotettu sisältöä:

  • Napsauta sisältöä upotettuna hiiren kakkospainikkeella ja valitse Tarkasta.
  • Vie hiiren kursori tarkastuspaneelissa upotetun sisällön ylätason <div> päälle.
  • Voit tarkastella laskettua korkeutta siten, että jotkin selaimet näyttävät säiliön korkeuden leijuttaessa, tai voit napsauttaa Computed-välilehteä kehittäjätyökalujen laatikossa ja etsiä height-attribuutin.

content-embed-calculated-height

Oliko tästä artikkelista apua?
Tätä lomaketta käytetään vain dokumentaation palautteeseen. Lue, miten saat apua HubSpotin kanssa.