Fonctionnel

Ajouter un lien "Partager par email" dans Webflow

outils :
Illustration croce

Sommaire

Introduction

Ajouter un bouton "Partager par email" sur un site web offre plusieurs avantages :

  1. Facilite le partage : Le bouton "Partager par email" permet aux utilisateurs de partager facilement le contenu du site avec leurs amis, leur famille ou leurs collègues via leur boîte de réception. Cela peut être utile pour diffuser des informations importantes ou intéressantes.
  2. Élargit la portée : L'email reste un moyen de communication très répandu, même à l'ère des réseaux sociaux. En ajoutant cette option de partage, vous permettez à votre contenu d'atteindre un public plus large qui pourrait ne pas être actif sur les réseaux sociaux.

Voici comment faire !

1. Ajoutez dans votre page un élément servant de déclencheur

Vous pouvez utiliser n'importe quelle élément (Div, Link, etc).

Webflow Tutoriel Email

2. Ajoutez lui l'id "mail"

Webflow Email ID Tutoriel

3. Ajoutez ce custom code

Vous pouvez l'ajouter avant le <body> dans votre page ou ajouter directement un embed dans votre élément.

 <script>
// Fonction pour ouvrir un nouveau mail avec le lien de la page actuelle
function ouvrirNouveauMail() {
// Récupérer l'URL de la page actuelle
var url = window.location.href;`

`// Encodage de l'URL pour le corps du texte du mail
var encodedUrl = encodeURIComponent(url);`

`// Création du lien mailto avec le corps du texte
var mailtoLink = "mailto:?body=" + encodedUrl;`

`// Ouvrir un nouvel onglet avec le lien mailto
window.open(mailtoLink);
}`

`// Ajouter un écouteur d'événement au clic sur la div avec l'id "mail"
var mailDiv = document.getElementById("mail");
mailDiv.addEventListener("click", ouvrirNouveauMail);
</script>

4. Publiez et tester le résultat

Exemple tutoriel Webflow
Ces tutoriels pourraient vous intéresser

Nos tutoriels de la même catégorie

Ajouter un sommaire dans Webflow

Webflow
Finsweet
Fonctionnel

Personnaliser le design des sliders dots dans Webflow

Webflow
Embed
Fonctionnel

Automatiser l’envoi d’un mail aux prospects qui remplissent un formulaire

Webflow
Zapier
Fonctionnel
Voir tous nos tutoriels
Illustration traits
Nous utilisons les meilleurs outils

Votre site est développé avec les meilleurs outils et les meilleurs pratiques

Gemeos ne vous propose pas simplement un site web, mais une expertise sur les meilleurs outils pour vous garantir un retour sur investissement optimal. 

Figma

Pour designer votre site web sur mesure et optimiser son taux de conversion

Webflow

Pour une intégration pixel perfect et optimisée de votre site web

Client-first

Pour une organisation aux petits oignons de votre projet

Wized

Pour ajouter des fonctionnalités avancées à votre projet

Make

Pour automatiser vos fluxs de travail et vous faire gagner un max de temps