Paramètres de miniatures Share Post Blogger - Le problème qui se pose souvent lors de la publication de miniatures est la perte des images miniatures ou post-publication lorsque la page du site Web est partagée sur des médias sociaux. En effet, les médias sociaux des navigateurs tels que Twitter et Facebook ne trouvent pas Meta Open Graphs dans le site HTML. le web. Outre le problème de partage de miniatures que les développeurs de sites Web peuvent beaucoup se plaindre, il y a la mise en page (la position) des titres de sites Web jugés inappropriés. Les titres de site trop longs ne sont généralement pas beaux sur la miniature de publication car ils peuvent empêcher le public de se concentrer sur le titre du contenu (article).
Cet article partagera quelques astuces pour ajuster le partage des vignettes d’un site Web à l’aide du graphe méta-open. C’est l’astuce la plus simple pour définir la vignette "paramètres" de la publication afin de la rendre plus intéressante et plus visible sur les médias sociaux (twitter, gplus). et facebook).
Ce qui devrait être fait pour créer une miniature de partage de publication intéressante et importante est, veuillez ajouter la balise méta ci-dessous au site Web html, Positionnez la balise méta entre les balises <head> et </ head>, ce qui est plus approprié pour la placer sous le code de fermeture </ titre>.
<b: if cond = 'data: blog.metaDescription! = "& quot"'>
<meta expr: content = 'data: blog.metaDescription' property = 'og: description' />
<meta expr: content = 'data: blog.metaDescription' name = 'twitter: description' />
<meta expr: content = 'data: blog.metaDescription' itemprop = 'description' />
</ b: si>
<b: si cond = 'data: blog.postImageUrl'>
<meta expr: content = 'data: blog.postImageUrl' property = 'og: image' />
<meta expr: content = 'data: blog.postImageUrl' name = 'twitter: image' />
<meta expr: content = 'data: blog.postImageUrl' itemprop = 'image' />
<b: else /> <b: if cond = 'données: blog.postImageThumbnailUrl'>
<meta expr: content = 'data: blog.postImageThumbnailUrl' property = 'og: image' />
<meta expr: content = 'data: blog.postImageThumbnailUrl' name = 'twitter: image' />
<meta expr: content = 'data: blog.postImageThumbnailUrl' itemprop = 'image' />
</ b: si> </ b: si>
<! - Métadonnées Facebook ->
<meta expr: content = 'data: blog.title' property = 'og: nom_site' />
<meta expr: content = 'data: blog.pageTitle' property = 'og: title' />
<meta content = 'article' property = 'og: type' />
<meta expr: content = 'data: blog.url' property = 'og: url' />
<meta content = '218168578325095' property = 'fb: app_id' />
<meta content = '100002549773049' property = 'fb: admins' />
<! - Métadonnées Twitter ->
<meta content = 'summary_large_image' name = 'twitter: card' />
<meta expr: content = 'data: blog.pageTitle' name = 'twitter: title' />
<meta content = '@ atomu' name = 'twitter: site' />
<meta content = '@ atomu' name = 'twitter: créateur' />
<meta content = '1200' name = 'twitter: image: width' />
<meta content = '800' name = 'twitter: image: height' />
<link href = 'https: //twitter.com/atomu' rel = 'me' />
<! - Balisage d'auteur et d'éditeur Google ->
<link href = 'https: //plus.google.com/+atomu' rel = 'author' />
<link href = 'https: //plus.google.com/+atomu' rel = 'éditeur' />
<! - Balisage Schema.org pour Google+ ->
<meta expr: content = 'data: blog.pageTitle' itemprop = 'name' />
Enregistrez le modèle et affichez les résultats, en indiquant que la "vignette de publication" sera modifiée après la disparition de la mémoire cache du site Web dans le navigateur, généralement 1 x 24 heures ou 2 jours maximum après l'application de la balise META ci-dessus.
Si auparavant le site Web comportait déjà un graphe méta ouvert comme celui mentionné ci-dessus, il n’était pas nécessaire de les remplacer tous. Apportez quelques modifications aux balises META, comme ci-dessous, pour définir les vignettes de publication les plus pertinentes.
Thumbnail Share Post (médias sociaux Twitter)
Rechercher et trouver la ligne de code suivante sur le site Web html
<meta content = 'summary' name = 'twitter: card' />
Puis remplacez le code par;
<meta content = 'summary_large_image' name = 'twitter: card' />
Ensuite, supprimez les propriétés width et height de l’image afin que l’image (miniature de publication) sur les réseaux sociaux Twitter soit plus grande et plus visible.
<meta content = '1200' name = 'twitter: image: width' />
<meta content = '800' name = 'twitter: image: height' />
Thumbnail Share Post (Médias sociaux Facebook)
Rechercher et trouver une ligne de code pour les balises META suivantes sur le site Web HTML;
<meta expr: content = 'data: blog.pageTitle' property = 'og: title' />
Ajoutez ensuite juste en dessous du code de la balise META suivant:
<b: si cond = 'data: blog.pageName'>
<meta expr: content = 'data: blog.pageName' property = 'og: title' />
</ b: si>
Le code de la balise méta sert à indiquer au navigateur de médias sociaux Facebook d'afficher uniquement le titre de la page (titre de l'article) et de masquer le titre du site à partir de la miniature de publication.
Veuillez partager cet article sur plusieurs types de médias sociaux pour voir la miniature de démonstration en direct partager ce message du site. Les paramètres que j'applique sont plus ou moins les mêmes que ceux décrits ci-dessous. Vous pouvez remplacer les balises méta existantes par des balises méta que j'ai partagées ci-dessus.
Remarque: modifiez vos identifiants Facebook, Twitter et Google Plus qui ont été marqués en gras avec votre propre identifiant et votre nom d'utilisateur.
Tout comme "Partager les paramètres de miniatures post Blogger", nous espérons que cela est utile et qu’il peut vous aider à ajuster la taille de l’image et le titre affiché dans le partage des miniatures de votre site Web. N'oubliez pas de vous abonner si cet article aide vraiment.
Tidak ada komentar:
Write komentar