Guide för Beginnare om hur du lägger till Twitter Cards i WordPress

Genom att förbättra din WordPress site med Twitter Cards kan du avsevärt förbättra din närvaro i sociala medier och engagemanget hos användarna. Twitter Cards tillhandahåller images och descriptions som visas på X (tidigare Twitter) när någon delar ditt content.

På WPBeginner använder vi den här funktionen för att kontrollera utseendet på våra tweets och öka interaktionen med användarna. Att använda Twitter Cards (eller X Cards) ser också till att vi får kredit för vårt content.

I den här artikeln visar vi dig hur du addar Twitter Cards i WordPress, så att your tweets sticker ut.

Varför använda Twitter Cards i WordPress?

Twitter Cards allow you to add a title, summary, image, and video or audio file to your tweet. På så sätt är det mer troligt att du får fler clicks och retweets.

Du kan se ett live-exempel genom att gå till vår WPBeginner page på X.

Den största fördelen med att ha Twitter Cards är att de ökar antalet personer som följer dina X-konton genom tillskrivning av content. Ofta tweetar folk dina links utan att ge dig rätt kredit.

Säg till exempel att @syedbalkhi retweetar ett post från @wpbeginner utan attribution, och andra retweetar @syedbalkhi. Då är användare som gillar dessa retweets mer benägna att följa @syedbalkhi än @wpbeginner.

Ofta gör content curates detta för att hålla tweetlängderna korta och säkerställa retweets av sina egna tweets.

Med Twitter Cards är detta problem löst eftersom du får kredit till din WordPress website från varje tweet som nämner din artikel.

Nu när du har lärt känna fördelarna med Twitter Cards ska vi ta en titt på hur du implementerar dem i WordPress. Vi kommer att täcka två metoder och visa dig hur du testar och bekräftar dina Twitter Cards:

Metod 1: Använda AIOSEO Plugin för att lägga till Twitter Cards (rekommenderas)

Det enklaste sättet att add to Twitter Cards till din website är att använda All in One SEO (AIOSEO) plugin för WordPress. Det är det bästa pluginet för sökmotorsoptimering för WordPress och används av över 3 miljoner websites.

Först måste du installera och aktivera pluginet AIOSEO. För mer details, följ vår Step-by-Step tutorial om hur du installerar ett WordPress plugin.

Du kan använda den gratis versionen av AIOSEO eftersom den erbjuder en utvald funktion för att ställa in Twitter Cards på din WordPress website.

När pluginet är aktivt går du till ditt WordPress admin area och navigerar till All in One SEO ” Social Networks. Klicka sedan på tabben ”X (Twitter)” och se till att alternativet ”Aktivera X-kort” är aktiverat.

När du har aktiverat Twitter Cards kan du ändra deras appearance med hjälp av olika inställningar.

AIOSEO låter dig välja standardkorttyp för ditt content. Pluginet kommer att ställa in ”Sammanfattning” som standardkorttyp, som visar titeln, sammanfattningen och thumbnail-bilden för ditt innehåll.

Men du kan ändra det till ”Summary with Large Image” från rullgardinsmenyn, och Twitter kommer att visa din tweet med en stor image.

Efter det måste du välja Standard Post Image Source. Det är den image du vill visa på dina Twitter Cards.

Det finns olika alternativ att välja mellan med hjälp av rullgardinsmenyn. You can for instance upload or select a standard image that will appear in the X (Twitter) Card or select the featured image, attached image, the first image in the content, and more.

Next, add to a Standard Post X Image, which will be used as a backup in case your content does not have an image.

Till exempel, om din bildkälla för inlägg är en featured image, men inlägget saknar en featured image, kommer X att använda standardbilden istället.

Notis: AIOSEO erbjuder fler alternativ för att visa ytterligare data som post författare och den tid det skulle ta att läsa en artikel.

Det finns också ett alternativ för att ställa in standardkällan för Term Image Source, men du behöver AIOSEO Pro eller en högre licens för att använda den här funktionen.

Nu, om du rullar ner, kommer du att se inställningarna för home page för Twitter. Tillägget kommer att visa en preview av hur din home page kommer att se ut på ett Twitter Card.

Under denna section kan you ändra Card Type och add to en Home Page Image.

Detta liknar de steg vi visade tidigare, men skillnaden är att dessa inställningar gäller för din home page.

Därefter anger du en Home Page Rubrik och Description som kommer att visas på Twitter Card.

När detta är gjort, clickar du på knappen ”Save Changes”.

Notis: AIOSEO låter dig också ändra inställningarna för X (Twitter) Card för enskilda poster och pages.

För att göra det, edit någon blogginlägg eller page och rulla sedan ner till AIOSEO Settings i content editor. Klicka nu på tabben ”Social” och select ”X (Twitter)”.

Tillägget visar en preview av ditt posts X Card och ger dig alternativet att använda data från Facebook tabs. Det låter dig också editera X-titeln och description.

Du kan skriva en new titel och description eller använda smarta taggar. Om du till exempel använder taggen ”+ Post Rubrik” ovanför fältet Twitter Rubrik, kommer AIOSEO automatiskt att använda titeln på ditt post i Twitter Card.

Därefter rullar du ner och väljer Image Source för ditt Twitter Card. Använd rullgardinsmenyn för att välja den image du vill visa för ditt inlägg, gillar en utvald image, attachment image, första image i content, och så vidare.

Slutligen kan du välja Twitter Card Type från rullgardinsmenyn. Som standard kommer AIOSEO att ställa in den på ”Summary”, men du kan ändra den till ”Summary with Large Image”.

Därefter uppdaterar eller publicerar du ditt blogginlägg. Du har nu utan problem addat Twitter Cards till din WordPress website.

Metod 2: Lägga till Twitter Cards i WordPress (kodmetod)

Denna metod kräver att kod läggs till i filerna för ditt tema eller barntema. Öppna bara header.php-filen eller använd det gratis pluginet WPCode för att add to denna custom-kod precis före taggen </head>:

<?php
#twitter cards hack
if(is_single() || is_page()) {
  $twitter_url    = get_permalink();
 $twitter_title  = get_the_title();
 $twitter_desc   = get_the_excerpt();
   $twitter_thumbs = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), full );
    $twitter_thumb  = $twitter_thumbs[0];
      if(!$twitter_thumb) {
      $twitter_thumb = 'http://www.gravatar.com/avatar/8eb9ee80d39f13cbbad56da88ef3a6ee?rating=PG&size=75';
    }
  $twitter_name   = str_replace('@', '', get_the_author_meta('twitter'));
?>
<meta name="twitter:card" value="summary" />
<meta name="twitter:url" value="<?php echo $twitter_url; ?>" />
<meta name="twitter:title" value="<?php echo $twitter_title; ?>" />
<meta name="twitter:description" value="<?php echo $twitter_desc; ?>" />
<meta name="twitter:image" value="<?php echo $twitter_thumb; ?>" />
<meta name="twitter:site" value="@libdemvoice" />
<?
  if($twitter_name) {
?>
<meta name="twitter:creator" value="@<?php echo $twitter_name; ?>" />
<?
  }
}
?>

Du kan ändra värdet för ”twitter:card” på rad 14 till ”summary_large_image” om du vill visa ett summary-kort med en stor image.

Om du inte vet hur man arbetar med PHP eller om du runar på issues med metod 2, vänligen använd metod 1.

Testa och bekräfta dina Twitter Cards

Innan links från din WordPress site börjar visa Twitter Cards, måste du först kontrollera det i Twitter Card Validator.

Bara heada över till Card Validator page på Twitter utvecklarnas website. Enter URL:en till ett post från din WordPress site och click på knappen ”Preview card”.

Card Validator visar inte längre en preview av tweeten, men den visar en logging om Twitter-kortet hämtar utan problem eller ej.

Expertguider om hur du använder Twitter med WordPress

Nu när du vet hur du addar Twitter Cards till WordPress kanske du gillar att se några andra guider relaterade till att använda Twitter med WordPress.

• Så här tweetar du automatiskt när du publicerar ett nytt post i WordPress
• Så här lägger du till Twitters delnings- och retweetknapp i WordPress
• Så här embedar du faktiska tweets i blogginlägg i WordPress
• Hur man fixar trasiga Twitter Cards Images i WordPress
• Hur man visar författarens Twitter och Facebook på sidan Profil
• Bästa Twitter tillägg för WordPress (Jämförelse)
• Så här displayed du senaste tweets i WordPress (steg för steg)
• Så här addar du dina social media feeds till WordPress (steg för steg)

Vi hoppas att den här artikeln hjälpte dig att add to Twitter Cards till WordPress. Du kanske också vill se vår guide om hur du skapar en landing page med WordPress och vårt expertval av de WordPress tillägg som du måste ha för att utveckla din website.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.