Project

General

Profile

Demande #5321

Mettre en place metadonnées html pour image miniature pour réseaux sociaux

Added by Frédéric Couchet over 2 years ago. Updated 9 months ago.

Status:
Fermé
Priority:
Normale
Assignee:
-
Start date:
04/10/2021
Due date:
% Done:

0%

Estimated time:

Description

Pour améliorer la manière d'afficher une page web sur les réseaux sociaux, une possibilité est d'utiliser des metadonnées html pour indiquer notamment l'image que le réseau social doit utiliser comme illustration. Il y a notamment les Twitter Cards pour Twitter et Open Graph pour Facebook, Linkedin et autres réseaux. Et on sait que les messages avec des images sont plus relayer.

Ce serait bien de mettre cela en place pour www.chapril.org.

Le code html à mettre dans la partie header ressemblerait à :

<meta name="twitter:card" content="summary_large_image"/>
<meta name="twitter:site" content="@aprilorg"/>
<meta name="twitter:creator" content="@aprilorg"/>
<meta name="twitter:image:alt" content="Bannière de l'émission"/>
<meta name="twitter:title" content="Chapril : utilisez des services libres et éthiques"/>
<meta name="twitter:image" content="URL_DE_L_IMAGE"/>

<meta property="og:title" content="Chapril : utilisez des services libres et éthiques"/>
<meta property="og:type" content="article"/>
<meta property="og:url" content="https://www.chapril.org"/>
<meta property="og:image" content="URL_DE_L_IMAGE"/>

URL_DE_L_IMAGE doit être une URL complète commençant par https://www.chapril.org

Cette image peut être une copie écran partielle de la page d'accueil (comme sur https://twitter.com/fcouchet/status/1380821487670722561) ou l'image utilisée sur www.april.org qui est https://april.org/files/banniere-chaprilx150.png Ou une autre image.


Related issues

Is duplicate of www.chapril.org - Demande #5108: Configurer une image de microbloging sur le site www.chapril.orgFermé01/08/2021

Actions

History

#1

Updated by Christian P. Momon over 2 years ago

  • Is duplicate of Demande #5108: Configurer une image de microbloging sur le site www.chapril.org added
#2

Updated by Christian P. Momon over 2 years ago

  • Status changed from Nouveau to Résolu

Fait. Voir #5108.

#3

Updated by Christian P. Momon over 2 years ago

  • Assignee set to Christian P. Momon
#4

Updated by Christian P. Momon over 2 years ago

  • Status changed from Résolu to Fermé
#5

Updated by Christian P. Momon over 2 years ago

  • Target version changed from Backlog to Sprint 2021 avril
#6

Updated by Frédéric Couchet over 1 year ago

  • Assignee deleted (Christian P. Momon)
#7

Updated by Frédéric Couchet over 1 year ago

  • Status changed from Fermé to En cours de traitement
  • Target version changed from Sprint 2021 avril to Backlog

Il manque le champ de description de l'image, pour des questions d'accessiblité : https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/markup

twitter:image:alt

A text description of the image conveying the essential nature of an image to users who are visually impaired. Maximum 420 characters.

Used with summary, summary_large_image, player cards

et og:image:alt

#8

Updated by Frédéric Couchet over 1 year ago

Le champ twitter:image:alt est déjà présent.

J'ai ajouté le champ og:image:alt voir https://forge.april.org/Chapril/www.chapril.org-spip/commit/8bb7a1942fdada6dbfd545b6aabb1fb34b3430ca

Puis git pull sur le serveur dans /var/www/www.chapril.org/squelettes/inclure

Je vide le cache Spip en me connectant sur le site et en allant dans maintenance.

Le champ apparaît bien sur www.chapril.org

#9

Updated by Frédéric Couchet over 1 year ago

  • Status changed from En cours de traitement to Fermé
#10

Updated by Pierre-Louis Bonicoli 9 months ago

  • Target version changed from Backlog to Sprint 2022 juillet-août

Also available in: Atom PDF