Twitter kortit Bloggeriin - Toimi näin

Kirjoittelin kauan aikaa sitten siitä, että lisäsin Twitter-feedin tämän blogin ulkoasuun. En tiedä, olenko huono sosiaalisen median käyttäjä, vai onko markkinointiosaamisessani aukkoja, mutta vasta nyt tajusin blogini puutteen Twitter-korttien osalta. Siis minkä Twitter-kortin? Mikä se on ja miksi se on tärkeä? Kun blogissasi on tämä ominaisuus, niin twiitatessa blogin artikkeleita Twitter näyttää artikkelista mahdollisen kuvan, otsikon ja lyhyen pätkän tekstiä twiitin yhteenvedossa. Ehkä selkeämmin sanottuna twiitti on paljon näkyvämpi ja myyvämpi. Tylsän tekstin sijaan näet siis paljon enemmän ja seuraajasi todennäköisesti tykkäävät ja jakavat tuotostasi enemmän. Tässä on siis pelkästään voitettavaa blogin markkinoinnissa ja näkyvyydessä.

Yllä oleva kuva on twiittini artikkeliin Fiksuruoka-palvelusta. Alla saman ja hivenen päivitetyn artikkelin puffausta vähän eri tekstillä. Kumpi osuu omaan silmääsi herkemmin? Mitään twiitissä muuttamatta se voikin näyttää siis paljon paremmalta, kuten alla.

Twitter-kortti on visuaalisempi ja silmiinpistävämpi, kuin ylempänä oleva pelkkä tylsä tekstimassa.

Tämä hienompi ja laajennetumpi twiitti on siis Twitter-kortti. Se syntyy automaattisesti kuvineen ja otsikoineen, kun vain jaat artikkelin. Esimerkiksi tämän jutun lopussa voit painaa vain Twitter-painiketta. Ominaisuuden saa helposti toimimaan, kunhan olet liittänyt blogiisi lyhyen koodinpätkän. Seuraava kikka toimii niille, ketkä käyttävät alustanaan bloggeria. Jopa aloitteleva bloggari onnistuu tässä toimenpiteessä, vaikka ei mitään HTML-kielestä ymmärtäisikään. Aikaa menee noin kaksi minuuttia.

Näin saat Twitter-kortin toimimaan

Mene blogissasi kohtaan Teema -> Muokkaa HTML koodia. Klikkaa html koodiboksin sisään ja hae: <b:includable id='post' var='post'> Itselläni tuo löytyy noin koodiriviltä 1429. Liitä heti äskeisen koodipätkän perään alla näkyvä koodi:

<meta content='summary_large_image' name='twitter:card'/>
<meta content='@nimesi' name='twitter:site'/>
<meta content='@nimesi' name='twitter:creator'/>
<meta content='www.sivustosi.fi' name='twitter:domain'/>
<meta expr:content='data:post.firstImageUrl' name='twitter:image:src'/>
<meta expr:content='data:post.title' name='twitter:title'/>
<b:if cond='data:blog.metaDescription'>
 <meta expr:content='data:blog.metaDescription' name='twitter:description'/>
<b:else/>
 <meta expr:content='data:post.snippet' name='twitter:description'/>
</b:if>
<meta expr:content='data:post.sharePostUrl' name='twitter:url'/>


Jotta Twitter -kortti toimisi oikein, niin vaihda @nimesi -kohtaan oma twitter tunnuksesi. Huomaa, että se esiintyy tuossa kaksi kertaa. Esimerkiksi omani on @Downshiftaaja. Muista myös vaihtaa www.sivustosi.fi -kohtaan oman sivustosi osoite. Esimerkiksi omani on http://downshiftaaminen.blogspot.fi.

Kun koodi on liitetty sivustollesi ja muutokset tehty, niin tallenna teema. Jotta muutokset on varmasti tehty oikein, niin testaa tuotoksesi tällä: Twitter Card Validator. Lopputuloksena pitäisi olla jotain alla olevan näköistä.

Validaattorissa kaikki kunnossa. Jos et saa esikatselukuvaa ja lokiin ilmestyy card error, niin suosittelen muutoksia.

Nyt on blogisi kuosissa ja ainakin twiitit paremmalla tolalla, kuin monella muulla. Voisin lyödä vetoa, että Twitterin analytiikasta huomaa vähän ajan päästä selvän muutoksen toiminta-asteesta. Tykkäyksiä ja vaikkapa jakoja tulee siis enemmän. Siitä voi vaikka Rikas Erakka, Osinkokuningas ja moni muu Bloggeria käyttävä ottaa tämän vinkin haltuun.