Comment intégrer des flux de médias sociaux dans les sites Figma ?

Oui ! Figma a un nouveau web builder appelé Sites Figma, et vous pouvez désormais concevoir et publier un site web dans un environnement sans code.

You can create responsive, visually polished landing pages, portfolios, or internal projects – all powered by your Figma designs. But what if you want to make your pages more dynamic with real-time preuve sociale?

Now you can embed any EmbedSocial widget – an Flux Instagram, a Curseur Google Reviews, or a TikTok mentions gallery – directly into your Figma Site.

Pour information : Vous pouvez intégrer automatiquement un Widget Instagram avec un agrégateur de médias sociauxLe site Web de l'entreprise est un outil de travail qui permet de donner vie à votre site Web grâce à un contenu frais.

Qu'est-ce qu'un site Figma ?

Figma Sites est un outil de publication léger qui vous permet de transformer n'importe quel dessin Figma en une page web vivante et partageable sans avoir recours à des développeurs.

---

Il s'agit d'un moyen d'expédier des microsites, des campagnes ou des présentations à l'aide de votre système de conception existant. Et maintenant, grâce à la prise en charge de l'intégration, vous pouvez améliorer vos pages avec des widgets en direct d'EmbedSocial.

Etapes pour intégrer des widgets Instagram ou Google reviews dans les sites Figma

Seulement iframe sont pris en charge dans les sites Figma. Cela signifie que vous devez utiliser le code option d'intégration d'une iframe à partir de votre widget EmbedSocial. Voici comment procéder, étape par étape :

Étape 1 : Copier le code Iframe du widget

1. Accédez à votre compte EmbedSocial ou créer un nouveau compte si vous êtes un nouvel utilisateur.
2. Aller à WidgetsCréez un nouveau widget ou sélectionnez le widget que vous souhaitez intégrer (Flux Instagram, Google Reviews, TikTok, etc.).
3. Dans l'éditeur, dans le panneau de configuration de gauche, cliquez sur le bouton Embed' (Intégrer) et cliquez sur
4. Copier le iframe (assurez-vous de faire pas utiliser la version JavaScript)

Étape 2 : Ajouter le bloc HTML dans les sites Figma

Suis les étapes suivantes pour coller ton code à l'intérieur de ton site Figma :

1. Ouvrez votre Site Figma projet.
2. A partir de la panneau de gaucheCliquez sur le bouton ➕ pour ajouter un nouveau bloc.
3. Sélectionner Emblèmes dans les options du bloc.
4. Choisissez ensuite l'option URL ou HTML bloc. Vous devrez ajuster le bloc à l'endroit où vous souhaitez intégrer le code.
   
5. You will see a new HTML panel on the right, where you will need to paste your iframe code.
   

Étape 3 : Ajuster la position et publier

• Après l'intégration, vous pouvez ajuster le block’s position, largeuret hauteur.
• Votre widget s'affichera en direct dans la mise en page du site Figma, ce qui vous permettra de prévisualiser et de styliser le reste de votre contenu en conséquence.
• Cliquez sur Publier pour voir les changements en direct.

Here is a live Figma site with an embedded Instagram widget by EmbedSocial – le voir à l'œuvre.

Pour commencer

You’ll now have a fully functional EmbedSocial widget inside your Figma Site – whether it shows Instagram UGC, témoignages de clientsUn widget expédiable ou des avis Google en temps réel. C'est un moyen simple de transformer votre design statique en une expérience vivante alimentée par un contenu authentique.