Qu’est-ce qu’une iframe?

Si nous avons besoin d’intégrer une page externe (ou une autre page sur notre site Web) dans l’une de nos pages de site Web, nous ne pouvons y parvenir qu’en utilisant la technique iframe. En règle générale, iframe est utilisé pour intégrer des vidéos dans des pages (par exemple, des vidéos YouTube). Mais parfois, nous devons intégrer un portail entier en tant qu’iframe. Prenons l’exemple de WHMCS. WHMCS est l’un des logiciels de facturation et de gestion des clients les plus puissants utilisés par de nombreuses sociétés d’hébergement. Bien sûr, si nous gérons une société d’hébergement Web, nous ajouterons le portail WHMCS sous la forme d’un iframe (pour éviter de modifier les fichiers de modèle WHMCS pour qu’ils correspondent à la marque et à la navigation de notre site Web) sur notre site Web. Pour ce faire, nous intégrons l’URL de notre portail WHMCS dans une page de notre site Web.

Comment insérer un iframe

Comment intégrer un site Web dans une autre page avec iframe

Le moyen le plus simple d’ajouter une page en tant qu’iframe est d’utiliser du code HTML

Si vous souhaitez spécifier la hauteur et la largeur de l’iframe:

Si vous souhaitez désactiver la barre de défilement

Remplacez le texte rouge par l’URL de la page que vous souhaitez intégrer

Mais parfois, WordPress n’acceptera pas le code iframe comme indiqué ci-dessus et supprimera automatiquement le code iframe.

Pour éviter ce problème, je répertorie les meilleurs plugins iframe disponibles pour WordPress pour l’intégration de pages et de vidéos

Shortcode iFrame de Flyn San (uniquement pour l’intégration de sites Web)

Comment ajouter une iframe avec ce plugin

Plug-in de code court iFrame

Plug-in iFrame Shortcode 1

iFrame Shortcode est un plugin WordPress pour intégrer des sites Web externes dans des pages, des articles ou même des widgets WordPress. L’intégration d’une URL avec ce plugin est très simple. Vous n’avez pas à assembler le shortcode. Dans l’éditeur de texte WordPress, il existe un bouton d’insertion iframe qui déclenche un assistant contextuel pour personnaliser votre apparence iframe. Vous pouvez facilement coller l’url, la largeur et la hauteur de votre iframe, la barre de défilement, etc. Le shortcode est généré automatiquement et inséré dans la page. Ce shortcode peut également être utilisé dans une zone de widget.

Le plugin iFrame Shortcode est parfait pour ceux qui ne connaissent pas les codes courts car ce plugin générera automatiquement un shortcode.

Noter – Ce plugin ne peut pas être utilisé pour intégrer des vidéos YouTube.

Intégrateur vidéo réactif avancé (intégrez des vidéos et des sites Web)

Comment intégrer des vidéos avec ce plugin

Shortcode direct – – [arve url=”….url-to-embed” autoplay=”yes” maxwidth=”1920″ /]

Intégrateur vidéo réactif amélioré 1

Intégrateur vidéo réactif avancé 2

Ce plugin est parfait pour ceux qui intègrent des vidéos de YouTube, Vimeo, Dailymotion, Facebook, Blip, etc. dans leur site Web WordPress. Avec l’aide de ce plugin, vous pouvez ajouter des vidéos au format réactif. Ce plugin ajoute un bouton Intégrer la vidéo à l’éditeur de texte WordPress et à l’aide duquel l’utilisateur peut facilement intégrer des vidéos à partir de divers services, y compris YouTube.

Ce programme d’intégration de plugin vous permet non seulement d’intégrer des vidéos, mais vous permet également de personnaliser diverses choses liées à cette vidéo, telles que: B. Orientation vidéo, largeur / hauteur, vue miniature, lecture automatique, etc.

Autres plugins

Plugin iFrame de webvitaly

C’est un simple plugin iFrame qui permet à un shortcode d’intégrer des pages externes. Lors de l’activation de ce plugin, vous pouvez ajouter un iframe avec ce shortcode –

[iframe src=”http://www.youtube.com/embed/4qsGTXLnmKs” width=”100%” height=”500″]

Auto iFrame par Greg Ross

Comme les plugins iframe ci-dessus, celui-ci offre une intégration facile d’iFrame dans les pages WordPress à l’aide d’un shortcode hautement personnalisable. Après avoir installé et activé le plugin, insérez le shortcode suivant dans un bloc de texte.
Téléchargez le code auto-iframe
raccourci – l’url exacte que vous souhaitez intégrer

étiqueter – tout identifiant unique si vous avez plus d’un iframe sur une seule page

largeur – Largeur de l’iframe (standard 100%)

la taille = Hauteur de l’iframe (standard 100%)

Mise à l’échelle automatique – Activer ou désactiver le redimensionnement automatique, vrai par défaut

faire défiler – Désactiver le défilement des pages

IFrame étendu

Utilisation du plugin Advanced iFrame

Iframe étendu

Iframe étendu 2

Advanced iFrame est un plugin avancé, mais il ne semble pas facile à utiliser. Ce plugin a beaucoup de fonctionnalités pour personnaliser iFrame, mais la plupart des fonctionnalités sont disponibles dans la version Pro. Un bouton pour insérer des codes courts est ajouté dans l’éditeur de texte WordPress. Cependant, le shortcode ajouté doit être ajusté manuellement.

La version Pro de ce plugin offre des fonctionnalités innovantes telles que: B. afficher une partie d’une page Web dans iframe. Mais je dois dire que vous devriez être plus qu’un WordPress débutant pour utiliser Advanced iFrame. Advanced iFrame Pro est un plug-in iFframe inégalé qui utilise des options étendues pour personnaliser l’apparence de l’iframe.

Noter – La version gratuite de ce plugin ne prend pas en charge l’intégration de vidéos

Astuce – Utilisez le plugin BJ Lazy Load pour permettre le chargement différé de votre contenu iframe. Cela accélérera le chargement du site Web. Si vous activez le chargement différé, le contenu de l’iframe (vidéo ou page) ne se chargera pas tant que la page n’aura pas été déplacée jusqu’à l’iframe. En particulier, si vous avez des vidéos dans des iframes activées pour la lecture automatique, utilisez le chargement différé pour elles.



Source link

Recent Posts