Javascript är avstängt eller blockerat i din webbläsare. Detta kan leda till att vissa delar av vår webbplats inte fungerar som de ska. Sätt på javascript för optimal funktionalitet och utseende.

Webbläsaren som du använder stöds inte av denna webbplats. Alla versioner av Internet Explorer stöds inte längre, av oss eller Microsoft (läs mer här: * https://www.microsoft.com/en-us/microsoft-365/windows/end-of-ie-support).

Var god och använd en modern webbläsare för att ta del av denna webbplats, som t.ex. nyaste versioner av Edge, Chrome, Firefox eller Safari osv.

Dela ditt innehåll i sociala medier

Då du delar innehåll från Drupal i sociala medier så visas ofta logotypen för Lunds universitet i delningen som standard. Men det är möjligt att ändra så att en annan bild hämtas in.

Sociala medier använder sig av så kallade open graph-taggar för att avgöra hur de ska visa innehåll som delas på deras plattformar. För att det ska fungera behöver du gå igenom följande steg:

  1. Ladda upp den bild du vill använda i Drupal.
  2. Ta reda på adressen till själva bilden (url:en).
  3. Lägg in denna url i open graph-taggen "Image URL" hörande till din artikel, undersida etc.
  4. Försäkra dig om att ändringen slagit igenom med hjälp av tjänsten Open Graph.
  5. Dela artikeln på valfria sociala medier. Nu ska bilden komma med.
  6. Om du delat artikeln sedan tidigare och vill uppdatera bilden i delningen kan du använda exempelvis Facebook Sharing Debugger eller Twitter Card Vaildator.

Ladda upp bilden till Drupal

Bilden måste först laddas upp i Drupal. Om du redan försökt att dela en färdig artikel eller bild och upptäckt att bara universitetets logotyp kommer med i delningen, så finns ju redan bilden på plats.

I annat fall går du till Content > Files and Media > Add files and media och klickar därefter på Image.

Följ därefter de vanliga stegen som du använder för att ladda upp bilder i Drupal.

Det här kan också vara ett alternativ om du har en särskild bild som du vill använda just för delningen i sociala medier, men som inte finns med i själva artikeln.

Tänk på att bilden måste vara i korrekt storlek för det sociala medium som du vill dela till. För Facebook gäller minst 1200x727 px.

Kolla bildens adress

Skärmklipp som visar hur användaren högerklickar på en bild och väljer Copy Image Location
Högerklicka på bilden och välj "Copy Image Location" (eller motsvarande).

Url:en till en enskild bild på din webbplats hittar du genom att högerklicka på bilden i din webbläsare och därefter välja "Copy Image Location" (eller motsvarande beroende på webbläsare).

Om bilden inte finns publicerad så hämtar du rätt url för bilden genom att gå till Content > Files and media > List all media. Klicka på filnamnet så att du får upp bilden. Därefter högerklickar du på bilden i din webbläsare och väljer "Copy Image Location" (eller motsvarande beroende på webbläsare).

Det ska bli en länk i stil med: https://www.lu.se/drimage/1920/0/24852/33597363-people-are-sick-ami-acu…

Testa gärna att ange bildens url i din webbläsare för att försäkra dig om att den verkligen leder till den bild du tänkt.

Uppdatera open graph-taggar

Inställningarna för open graph-taggarna hittar du i administrationsgränssnittet under fliken "Meta tags" i spalten till höger i redigeringsläget för exempelvis en artikel eller sida.

Skärmklipp som visar inställningarna för Open Graph-taggar
Inställningarna för Open Graph-taggarna hittar du i högerspalten i redigeringsläget.

 

Metataggarna är uppdelade i tre flikar: Basic tags, Advanced tags och Open graph. Öpnna Open graph.

Det är fältet benämnt "Image URL" som avgör vilka bilder som visas på plattformarna. Försäkra dig om att du verkligen är under Open graph.

Skärmklipp som visar fältet Image URL
Det är innehållet i fältet Image URL som avgörs vad som delas i sociala medier.

Då du skapar till exempel en ny sida eller artikel så läggs url:en http://www.lu.se/sites/www.lu.se/files/lu-logo-280x280px.png in där automatiskt. Du är fri att ändra denna.

Klistra in url:en som du kopierade i förra steget i fältet "Image URL". Spara.

Twitter

För att bilder ska visas på Twitter så behöver du istället fylla i bildens URL i fältet "Image" (som du också hittar under "Open Graph"-inställningarna)

Granska open graph-taggar

Efter att du sparat kan det som vanligt ta en stund innan ändringen slår igenom. Med hjälp av tjänsten Open Graph kan du skriva in url:en till webbsidan som du planerar att dela i sociala medier, och där se vilka open graph-taggar som är aktuella.

Använd den för att se att http://www.lu.se/sites/www.lu.se/files/lu-logo-280x280px.png bytts ut till bilden du angett.

Skärmklipp från opengraph.xyz som används för att kolla Open Graph-taggarna
Försäkra dig om att dina ändringar slagit igenom i Open Graph-taggarna.

Open Graph är ett smidigare alternativ till att manuellt gå in och granska sidans källkod. Du som är van vid detta förfaringssätt kan förstås göra det, men tänk på att det är hur koden ser ut för en extern besökare som avgör vad till exempel Facebook och Twitter "ser", så du måste vara utloggad ur Drupal (eller smidigare genom att öppna sidan/artikeln i ett privat webbläsarfönster).

Se vidare under Uppdatera delning om det dröjer oskäligt lång tid innan og:imageurl uppdateras.

Dela artikeln med bild

Dela artikeln på exempelvis Facebook eller Twitter på vanligt sätt.

Nu ska uppdateringarna från Open graph-taggarna hänga med enligt vad du kunde se i Open Graph Check.

Uppdatera delning

Facebook och Twitter har också egna verktyg där du kan kontrollera hur deras plattformar tolkar informationen som du har skrivit in:

Facebook Sharing Debugger

Twitter Card Validator

Du kan använda dessa för att se till att respektive tjänst läser om informationen från din artikel och tar med den nya bild-url:en som du angett i Open graph-taggarna.

 

Låt Facebook ta del av dina nya open graph-taggar genom att klicka på Scrape again i Facebook sharing debugger
Låt Facebook ta del av dina nya open graph-taggar genom att klicka på Scrape again i Facebook sharing debugger
Låt Facebook ta del av dina nya open graph-taggar genom att klicka på Scrape again i Facebook sharing debugger

I Facebook Sharing Debugger skriver du in adressen till artikeln du planerar att dela och klickar på Debug. Du kan därefter få Facebook att uppdatera delningen genom att klicka på Scrape again. Där visas också när den senaste uppdateringen gjordes.

 

Med Twitter Card Validator kan du se hur Twitter uppfattar dina open graph-taggar.
Med Twitter Card Validator kan du se hur Twitter uppfattar dina open graph-taggar.
Med Twitter Card Validator kan du se hur Twitter uppfattar dina open graph-taggar.

I Twitter Card Validator skriver du in adressen till artikeln och klickar på Preview card för att se hur Twitter uppfattar din delning.

Vill du gå tillbaka till webbsidan och ändra igen i open graph-taggarna så kan det ta längre tid för cachen och ändringarna att slå igenom.

 

Support

Vid frågor, vänligen kontakta servicedesk [at] lu [dot] se

Ange alltid webbplatsens eller sidans URL som ärendet gäller.

Visas "Webbläsaren som du använder stöds inte..." i ditt delade innehåll?

Bild av felmeddelande på Facebook.

Det kan bero på att text i "description" inte har kunnat hittas på sidan, t.ex. för att sidan saknar text i de fält där beskrivningen normalt sätt hämtas från.

För att lösa detta, kan du lägga till en text i "description" manuellt. Gå in i Edit-läget på din sida. I högra menyn, gå till Meta tags > Open Graph. I fältet "Description" anger du den text du vill ska visas tillsammans med din sida i sociala medier. Tryck på Save.