Si vous souhaitez organiser le contenu d’autres personnes sur les réseaux sociaux ou simplement faire en sorte que votre propre contenu visuel sur les réseaux sociaux travaille plus fort pour votre stratégie de contenu globale, vous devez savoir comment intégrer du code HTML sur votre blog ou votre site Web.
Mais attendez une seconde… avant d’entrer dans le vif du sujet, qu’est-ce que ça veut dire « intégrer » ? Et qu’est-ce que le HTML ? Si vous ne savez pas coder, ne vous inquiétez pas, l’intégration de contenu externe est extrêmement simple. Prenons une seconde pour analyser les bases.
Que veut dire Intégrer ?
L’intégration signifie l’intégration de contenu externe sur un autre site Web ou une autre page. Vous intégrez quelque chose lorsque vous placez un bloc de code, appelé code d’intégration, dans l’éditeur HTML d’un autre site Web. Lorsque vous appuyez sur “Enregistrer” ou “Publier”, le média s’affiche sur la page publiée.
Le contenu intégré est référencé en HTML. HTML est l’un des langages les plus basiques utilisés sur le Web pour la conception et la conception de pages Web.
Vous voyez souvent ce code lorsque vous êtes à l’arrière de votre article de blog. C’est ici que vous ajouterez votre code d’intégration.
La plupart des sites Web sociaux et multimédias ont la possibilité de générer un code d’intégration directement sur chaque publication individuelle. Voici un exemple de code d’intégration pour une vidéo HubSpot sur YouTube :
Et voici le résultat intégré.
Voulez-vous faire la même chose dans vos articles et pages de blog ? Voyons comment vous pouvez générer un code d’intégration pour les meilleurs sites sociaux.
Ci-dessous, nous couvrons ces étapes plus en détail pour chaque plate-forme. En général, vous voudrez :
- Générez le code d’intégration.
- Accédez à votre système de gestion de contenu et collez le code d’intégration dans votre visionneuse HTML.
- Finalisé ! Vous avez intégré du contenu sur votre site Web ou votre blog.
Nous allons plonger dans chaque étape.
1. Générez le code d’intégration.
Avant d’intégrer du contenu externe, vous devez d’abord générer un code d’intégration pour la publication ou la page que vous souhaitez intégrer sur votre site Web.
Nous verrons comment vous pouvez le faire sur la plupart des principaux réseaux sociaux et de contenu.
Intégrer un Facebook Courrier
Pour intégrer un Facebook publier, procédez comme suit :
- Aller vers Facebook dans votre navigateur de bureau et accédez à la publication que vous souhaitez intégrer.
- Cliquez sur les trois points dans le coin supérieur droit de la publication.
- Dans le menu déroulant, cliquez sur Intégrer.
- Une fenêtre pop-up apparaîtra, où vous avez la possibilité d’inclure la publication complète et d’accéder aux paramètres avancés. Pour les débutants, nous recommandons de laisser les options telles quelles et de cliquer simplement Copier le code.
- Finalisé ! Vous avez votre code d’intégration.
Intégrer une publication Instagram
Vous souhaitez insérer une publication Instagram ? Le processus est similaire à Facebook’s. Veuillez noter que vous ne pouvez insérer des messages que depuis la version de bureau et non depuis l’application mobile.
- Cliquez sur les trois points dans le coin supérieur droit de la publication.
- Une fenêtre pop-up apparaîtra avec diverses options. Cliquer Intégrer, l’avant-dernière option.
- Une fenêtre pop-up apparaîtra avec votre code d’intégration. Vous avez la possibilité d’inclure ou d’exclure le titre.
- Une fois que vous avez fini de personnaliser vos options, cliquez sur Copiez le code inséré.
- Complet! Vous avez votre code d’intégration Instagram.
Intégrer une vidéo YouTube
Les vidéos YouTube peuvent faire passer vos articles de blog au niveau supérieur, et la meilleure partie est que vous pouvez intégrer gratuitement votre richesse de contenu dans vos articles de blog.
Pour ce faire, suivez les étapes ci-dessous :
- Accédez à la vidéo que vous souhaitez intégrer sur votre site Web.
- Sous la vidéo, à côté de l’endroit où se trouvent les likes, cliquez sur Partager.
- Une fenêtre pop-up apparaîtra avec diverses options, y compris la possibilité de partager la publication avec d’autres réseaux sociaux. Cliquer Intégrer.
- YouTube créera un code d’intégration que vous pourrez personnaliser. Vous pouvez démarrer la vidéo à un moment donné ou masquer les commandes du lecteur.
- Après avoir choisi vos options, cliquez sur Copie dans le coin inférieur droit de la fenêtre contextuelle.
- Complet! Votre vidéo YouTube est prête à être intégrée.
Insérer un tweet
En incorporant un Tweet sur votre site Web ou vos pages de blog, vous pouvez stimuler l’engagement pour votre Twitter profil sans dépendre de votre Twitter suiveurs. Les visiteurs du site Web peuvent interagir avec votre Twitter contenu aussi.
Pour intégrer un Twitter publier, procédez comme suit :
- Dans un navigateur de bureau, accédez à la publication que vous souhaitez intégrer.
- Cliquez sur les trois points dans le coin supérieur droit de la publication.
- Un menu déroulant apparaîtra. Cliquer Insérer un tweet.
- Twitter Il vous mènera à une page externe sur publish.twitter.com, où vous pourrez personnaliser davantage l’apparence du Tweet avant de l’intégrer sur votre site. Par exemple, vous pouvez le mettre en mode sombre et changer la langue d’affichage du Tweet.
- Une fois que vous l’avez personnalisé, cliquez sur Mettre à jour.
- Cliquer Copier le code.
- Finalisé ! Le Tweet est prêt à être intégré à votre site.
Il existe une autre façon de générer un code d’intégration pour Twitter. Allez sur publish.twitter.com et insérez l’URL de la publication que vous souhaitez intégrer. Twitter Ensuite, il générera le code d’intégration et vous pourrez le personnaliser en utilisant le même processus que la dernière méthode.
Intégrer un Pinterest Courrier
Intégrer un Pinterest la publication peut conduire les utilisateurs du site Web à votre Pinterest profil et vous aider à développer votre Pinterest Suivant. Pour commencer, procédez comme suit :
- Aller vers Pinterest poste que vous souhaitez intégrer.
- Cliquez sur les trois points à côté de l’image (ou sous l’image, si vous utilisez le site Web mobile).
- Dans le menu déroulant, cliquez sur Obtenir le code d’intégration PIN.
- Une fenêtre pop-up apparaîtra avec le code d’intégration. Vous avez la possibilité de créer une broche intégrée petite, moyenne, grande ou très grande.
- Une fois que vous avez personnalisé la taille, mettez le code en surbrillance et cliquez sur Commande + C ou CTRL + C.
- Finalisé ! Votre épingle est prête à être insérée.
Insérer une présentation SlideShare
Bien que les présentations SlideShare ne soient pas si populaires de nos jours, elles peuvent toujours être un outil multimédia utile pour pimenter les articles et les pages de blog. Voici comment intégrer une présentation SlideShare :
- Accédez à la présentation SlideShare que vous souhaitez intégrer.
- Cliquer Partager sous la présentation.
- Dans la même fenêtre où apparaît la présentation, vous verrez la possibilité de la partager via les réseaux sociaux. Le code d’intégration sera en dessous.
- Choisissez la taille de la fenêtre d’insertion et la diapositive où vous souhaitez que la présentation commence.
- Mettez en surbrillance le code d’intégration et cliquez sur Commande + C ou CTRL + C.
- Prêt! Vous pouvez désormais intégrer la présentation SlideShare sur une page Web ou une publication.
Intégrer une page Web externe
Vous ne voulez pas insérer une publication sociale mais une page web ? Vous pouvez intégrer une page Web externe à l’aide de la iframe Balise HTML.
Tous les codes d’intégration, y compris ceux des sites sociaux, utilisent des balises iframe. Voici à quoi ils ressemblent :
Vous pouvez utiliser ces mêmes balises pour intégrer une page Web externe. C’est comme ça:
- Accédez à la page Web que vous souhaitez intégrer à votre site.
- Ouvrez l’application Bloc-notes sur votre ordinateur. Collez-y le code suivant :
- Revenez à la page Web et copiez l’URL.
- Collez l’URL complète à l’endroit indiqué dans votre code iframe. N’oubliez pas d’inclure au début de votre URL et de mettre le lien entre guillemets. Voici à quoi devrait ressembler votre code :
- Modifiez la largeur et la hauteur du cadre si vous le souhaitez.
- Copiez toute la ligne de code. Ensuite, la page Web est prête à être intégrée à votre site Web.
2. Accédez à votre système de gestion de contenu et collez le code d’intégration dans votre visionneuse HTML.
Bien que chaque CMS soit différent, vous pouvez probablement trouver la visionneuse HTML avec des étapes similaires. Nous verrons comment vous pouvez le faire sur le CMS Hub et WordPress.
Centre CMS
Dans CMS Hub, vous n’avez pas réellement besoin d’ajouter votre contenu intégré à l’aide de l’éditeur HTML (bien que vous ayez la possibilité de le faire). C’est comme ça:
- Dans votre tableau de bord HubSpot, accédez à Commercialisation > Site Web > Blog. Si vous prévoyez d’ajouter le code à une page de site Web, accédez à Commercialisation > Site Web > Pages du site Web.
- Recherchez la publication ou la page à laquelle vous souhaitez ajouter le code d’intégration. Survolez-le et cliquez Éditer.
- Cliquez sur le module où vous souhaitez ajouter le code d’intégration. Une barre d’options apparaîtra près du haut de l’écran. Sur le côté droit, cliquez Insérer.
- Choisir Intégrer dans le menu déroulant.
- Une fenêtre contextuelle apparaîtra. Collez le code iframe dans la barre de texte.
- Cliquer Insérer.
- Finalisé ! Vous pouvez modifier la largeur et la hauteur du contenu intégré pour le personnaliser davantage.
Pour accéder à l’éditeur HTML, suivez les étapes 1 à 3 ci-dessus. Dans la barre d’options supérieure, cliquez sur Avancée > Code source. Vous pouvez ensuite coller votre code d’intégration manuellement. Gardez à l’esprit que le résultat final est le même.
WordPress
Pour coller un code d’intégration sur votre site WordPress, suivez les étapes ci-dessous :
- Accédez à votre espace d’administration et rendez-vous sur Pages ou Publications.
- Cliquez sur le titre de la publication à laquelle vous souhaitez ajouter le code d’intégration. Cette action vous mènera à l’éditeur de publication.
- Clique sur le Texte dans le coin supérieur droit de l’éditeur de texte.
- Collez votre code d’intégration à l’endroit où vous souhaitez que le module apparaisse.
3. Fini ! Vous avez intégré du contenu sur votre site Web ou votre blog.
Une fois la page rechargée, votre publication sociale intégrée apparaîtra.
Ajoutez du contenu intégré pour augmenter l’engagement des utilisateurs
En incorporant du contenu externe sur vos pages et publications, vous pouvez augmenter l’engagement sur votre site Web et amener les visiteurs de votre site à interagir avec le contenu que vous publiez sur les réseaux sociaux. La meilleure partie est que c’est facile à faire – générez simplement le code d’intégration, collez-le dans votre éditeur HTML et observez l’augmentation de l’engagement des utilisateurs.
