Gadget de partage

Le widget « Partager cette page » n'est plus pris en charge. Vous ne devez pas l'utiliser sur Canada.ca. La plupart des navigateurs disposent désormais d'outils de partage intégrés, donc le widget n'est plus nécessaire. Pour toute question, écrivez-nous à dsd.ceo-bec.dsn@servicecanada.gc.ca.

Partager une page

Visualiser le code 
<div class="wb-share" data-wb-share='{"pnlId": "pnl1"}'></div>

Partager une vidéo

Visualiser le code 
<div class="wb-share" data-wb-share='{"type": "video", "title": "Titre de la vidéo", "url": "https://video.url", "pnlId": "pnl2"}'></div>

Partager un fichier audio

Visualiser le code 
<div class="wb-share" data-wb-share='{"type": "audio", "title": "Titre du fichier audio", "url": "https://audio.url", "pnlId": "pnl8"}'></div>

Partager un type personnalisé

Visualiser le code 
<div class="wb-share" data-wb-share='{"custType": " ce commentaire", "title": "Titre du commentaire", "url": "https://commentaire.url", "pnlId": "pnl3"}'></div>

Ajouter des liens additionnels

Deuxième lien :
Visualiser le code 
<div class="wb-share" data-wb-share='{"pnlId": "pnl4"}'></div>
<div class="text-right">
	<strong>Deuxième lien :/strong>
	<div class="wb-share link-only text-right" data-wb-share='{"pnlId": "pnl4"}'></div>
</div>

Filtrer les sites affichés

Visualiser le code 
<div class="wb-share" data-wb-share='{"filter": ["email", "facebook", "linkedin", "twitter"], "pnlId": "pnl5"}'></div>

Ajouter du CSS personnalisé au lien de partage

Visualiser le code 
<div class="wb-share" data-wb-share='{"pnlId": "pnl6", "lnkClass": "btn btn-default"}'></div>

Ajouter un site au panneau de partage

Visualiser le code

HTML

<div class="wb-share" data-wb-share='{"pnlId": "pnl7", "sites": {"Site démo": {"name": "Site démo", "url": "https://www.example.org/?to=&subject={t}&body={u}%0A{d}"}}}'></div>

SCSS

.wb-share {
	.demosite {
		&:before {
			background: url("demosite.png") no-repeat;
		}
	}
}

Avec X au lieu de Twitter

Visualiser le code 
<div class="wb-share" data-wb-share='{"filter": ["email", "facebook", "linkedin", "x"], "pnlId": "pnl5a"}'></div>

Lorsque X et Twitter sont définis

Lorsque X et Twitter sont tous deux configurés, seul X sera affiché.

Visualiser le code 
<div class="wb-share" data-wb-share='{"filter": ["email", "facebook", "linkedin", "twitter", "x"], "pnlId": "pnl5b"}'></div>
Date de modification :