Kun luot ja julkaiset sosiaalisen viestin HubSpotissa, vastaava sosiaalinen verkosto yrittää luoda kuvan esikatselun viestistäsi. Sosiaalinen verkosto skannaa postaukseen antamasi linkin perusteella sivusi lähdekoodin metatunnisteet ja tutkii verkkosivustosi robots.txt-tiedoston.
Jos isännöit verkkosivustoasi ulkoisella palveluntarjoajalla, kuten WordPressillä, ja postauksesi esikatselu ei näy odotetulla tavalla, noudata alla olevia ohjeita.
Robots.txt-tiedosto ilmoittaa hakukoneille, miten verkkosivustosi indeksoidaan. Jos et ole lisännyt tai määrittänyt robots.txt-tiedostoasi oikein, sosiaaliset verkostot eivät pysty jäsentämään sivujesi sisältöä. Facebook ja X tarjoavat molemmat user agent -merkkijonot, jotka sinun on lisättävä robots.txt-tiedostoosi:
User-agent: facebookexternalhit
Disallow:
User-agent: Twitterbot
Disallow:
LinkedIn ei tarjoa dokumentaatiota käyttäjäagentti-merkkijonostaan, mutta voit käyttää LinkedInin post inspector -ohjelmaa vahvistaaksesi, voiko LinkedIn indeksoida sivustosi sisällön.
Hakukoneet ja sosiaaliset verkostot analysoivat HTML-kielesi head-osion etsiäkseen metatietoja, joita tarvitaan sivun esikatselun luomiseen. Sinun tulisi sisällyttää Facebookin ja X: n metatiedot ensisijaisten metatunnisteidesi jälkeen:
<!-- Primary Meta Tags -->
<title>Meta Tags — Preview, Edit and Generate</title>
<meta name="title" content="Meta Tags — Preview, Edit and Generate">
<meta name="description" content="With Meta Tags you can edit and experiment with your content then preview how your webpage will look on Google, Facebook, Twitter and more!">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com">
<meta property="og:title" content="Title of your Website Page">
<meta property="og:description" content="Description of your Website Page">
<meta property="og:image" content="https://example.com/image.png">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://example.com/">
<meta property="twitter:title" content="Title of your Website Page">
<meta property="twitter:description" content="Description of your Website Page">
<meta property="twitter:image" content="https://example.com/image.png">Täytä kunkin yllä olevan metatunnisteen sisältöattribuutit sivusi vastaavilla arvoilla. Voit validoida metatunnisteesi Facebookin debugger-työkalulla, X-kortin validointityökalulla ja LinkedInin post inspectorilla.
Jos lisäämäsi linkin esillä oleva kuva ei näy oikein sosiaalisessa esikatselussa (esim. kuva on leikattu pois tai suhde on väärä), sinun on ehkä muokattava kuvaa niin, että sillä on oikeat mitat sosiaaliselle verkostolle, johon julkaiset postauksen, ja julkaise sitten sivu uudelleen. Jos julkaiset Facebookiin, voit lukea lisää heidän dokumentaatiostaan, jossa kerrotaan heidän esillä olevaa kuvaa koskevista vaatimuksistaan.
Seuraavat mitat ovat suositeltavia kunkin verkon esillä olevan kuvan optimointia varten:
Varmista, että kaikki sosiaalisiin viesteihisi sisällyttämäsi media noudattaa kunkin verkon tiedostokoko-ohjeita. Jos HubSpot toteaa, että tiedosto on liian suuri lähetettäväksi tiettyyn verkkoon, näyttöön tulee varoitus. Kunkin sosiaalisen verkoston enimmäistiedostokoot on lueteltu alla:
Upotetut väriprofiilit saattavat vaikuttaa siihen, miten esillä oleva kuva näkyy sosiaalisessa viestissäsi. Eri järjestelmät käsittelevät epätavallisia väriprofiileja eri tavoin, minkä vuoksi värit saattavat näyttää erilaisilta, kun esikatselet kuvaa tiedostonhallinnassa. Voit ajaa kuvan URL-osoitteen ulkoisen työkalun läpi nähdäksesi, käyttääkö se epätavallista väriprofiilia. Tarvittaessa voit poistaa häiritsevän väriprofiilin Photoshopin kaltaisessa kuvankäsittelytyökalussa ja julkaista sitten sivun uudelleen ennen sosiaalisten julkaisujen julkaisemista.
HubSpotin tiedostonhallinta käyttää JPEG- ja PNG-kuviin kuvapakkausta, jotta HubSpotin isännöimän sisällön latausnopeus saadaan optimoitua. Sosiaalisen median verkostot käyttävät myös kuvapakkausta viesteissä, joiden laatu saattaa poiketa HubSpotissa näkyvästä. Tästä syystä on suositeltavaa käyttää suhteellisen korkearesoluutioisia kuvia (suositellussa kuvasuhteessa) kussakin verkossa. Jos kuvasi ei vastaa sosiaalisen verkoston vaatimuksia, HubSpotin sosiaalisen julkaisemisen työkalussa näkyy varoitus, joka auttaa muokkaamaan kuvaa vastaavasti.
Jos linkkien esikatselukuvat eivät vieläkään näy oikein, tutustu vianmääritysoppaaseemme.