Ajouter un fichier via un Iframe

Vous pouvez ajouter un fichier sur la plateforme à partir d'un éditeur de texte. L'une des solutions est de permettre aux utilisateurs d'accéder au fichier via un lien de téléchargement. L'autre solution, qui est l'objet de cet article, est d'ajouter le fichier via un Iframe. L'Iframe vous permet d'afficher le contenu de votre fichier (ou d'un contenu en ligne, comme un Calaméo) directement sur la plateforme, comme dans l'exemple ci-dessous : 

L'utilisateur voit le contenu du fichier sur la plateforme et peut le télécharger en plaçant son curseur sur le document pour faire apparaître le logo de téléchargement ou en faisant un clic-droit ( attention : cela dépend du navigateur de l'utilisateur). 

Pour cela, le fichier doit être au format PDF

Sur le nouvel éditeur de texte (articles, événements, étapes de votre projet...), tout peut se faire depuis l'éditeur grâce au bouton d'ajout de fichier : 

Une fois le fichier ajouté, le bouton "Mode wysiwyg" vous permet de retrouver le lien de votre fichier .pdf. 

Il suffit alors d'ajouter le code suivant pour que votre PDF s'affiche dans un iframe et soit donc consultable directement dans la page :

<p style="text-align:center;">
    <iframe src=" https://lien-de-votre-document.pdf" height="500px" width="500px" style="max-width:100%;"><br></iframe>
    <br>
</p>

En revenant sur la vue éditeur (en recliquant sur le bouton "Mode wysiwyg", vous verrez votre iframe et pourrez changer sa taille en modifiant directement le bord de l'iframe (en étirant ou réduisant la taille comme vous le feriez avec une image).


Pour les autres espaces de la plateforme contenant un éditeur sans ajout de fichier, voici la manipulation à effectuer (uniquement pour les administrateurs) :

1. Ajoutez votre fichier sur le serveur de la plateforme

Vous pouvez passer cette partie et aller directement au point 3 si vous souhaitez afficher du contenu qui est déjà en ligne (Calaméo par exemple) et pour lequel vous avez déjà une URL.

Allez dans le menu Contenus > Media.

Cliquez sur Ajouter un média en haut à droite.

Cliquez sur  Sélectionner pour choisir le fichier que vous souhaitez afficher sur la plateforme.


2. Récupérez l'URL de votre fichier

Votre fichier sera alors ajouté à la liste des médias. Cliquez sur le bouton bleu sur la droite, dans la colonne Lien, pour copier l'URL du fichier. 

3. Ajoutez l'iframe

Dans l'éditeur de texte, cliquez sur l'icône en forme de planète : 


Capture-d---cran-2020-06-26--10-09-05.png
Dans le champ URL, collez l'URL référence que vous avez copiée. Les champs Dimensions vous permettent d'indiquer la hauteur et la largeur du document.

Capture-d---cran-2020-06-26--10-10-36.png

Votre PDF s'affichera dans votre éditeur de texte sous la forme d'un encadré avec "IFRAME". 

Enregistrez la page. Le fichier s'affichera bien sur le front.

Cet article vous a-t-il été utile ? Merci pour votre réponse ! Il semble y avoir un problème avec l'enregistrement de votre réponse. Nous vous invitons à réessayer plus tard.

Vous ne trouvez pas ce que vous cherchez ? Contactez-nous ! Contactez-nous !