Tutoriels

Comment intégrer une photo 360 sur WordPress

Vous souhaitez intégrer le meilleur lecteur de photo 360 sur WordPress ? En quelques étapes, apprenez à intégrer n’importe quelle photo ou image 360 ​​sur votre site web.


Etape 1 : Téléchargez vos images 360°

Commencez par Téléchargez votre/vos image(s) sur panoraven :

Si vous souhaitez intégrer plus d’une image dans un seul lecteur (mode galerie), vous pouvez en télécharger plusieurs d’un seul coup. Si vous préférez obtenir une seule image par lecteur, téléchargez les photos une par une. Pour information, vous pouvez aussi les glisser-déposer.


Etape 2 : Copiez le code d’intégration fourni

Une fois le téléchargement terminé, vous aurez accès au lecteur 360°. Au-dessus du lecteur figure une série de boutons. Le bouton “code d’intégration” permet de copier le code directement dans le presse-papier. Cliquez simplement dessus.

Copier le code d’intégration en cliquant simplement sur ce bouton

Etape 3 : Créez le bon bloc WordPress

Ça y est, vous êtes sur WordPress et plus précisément sur le tableau de bord d’édition d’un article (ou d’une page). Appuyez sur le bouton + en bas à droite pour créer un nouveau bloc. C’est dans ce bloc que sera intégré le lecteur 360 degrés.

Click the "plus" button
Commencez par créer un nouveau bloc depuis la console d’édition

WordPress va alors vous demander quel type de bloc vous souhaitez créer. Le bloc qui nous intéresse s’intitule “Custom HTML”et se trouve dans le groupe “Widget”. Pour le trouver plus rapidement, vous pouvez alternativement taper “HTML” dans la barre de recherche. Cliquez ensuite pour créer le bloc en question.

Cliquez sur le type de bloc “Custom HTML”

Vous devriez alors voir apparaître le bloc dans l’écran d’édition, c’est un champ de texte à remplir avec l’instruction “Write HTML” en filigrane, comme le montre l’image ci-dessous.

Custom HTML block created
Le bloc Custom HTML est maintenant créé

Étape 4 : Intégrez votre photo 360° sur WordPress!

C’est dans ce bloc que vous allez copier le code d’intégration de l’image. Vous avez dû le récupérer à l’étape 2. L’image ci-dessous montre à quoi doit ressembler le code en question :

Paste the embed code in the block
Copiez le code d’intégration (Etape 2) dans le bloc

Vous pouvez taper sur “Preview” (bouton à côté de HTML) pour voir ce que donnera le code une fois l’article publié.

360 photo wordpress
Le lecteur 360 est intégré sur votre site!

Et voilà, vous venez d’intégrer sur wordpress, une photo 360° via le plus rapide et le plus élégant de tous les lecteurs 360° 🙂


Tuto flash: photo 360 sur wordpress

Comment intégrer une photo 360 sur WordPress

  1. Téléchargez vos images

    Téléchargez votre/vos image(s) sur Panoraven. Vous n’avez pas besoin de créer de compte. Une fois le téléchargement terminé vous allez accéder au lecteur 360°.

  2. Copier le code d’intégration fourni

    Cliquez sur ce bouton pour copier le code dans votre presse papier

  3. Allez sur votre site WordPress en mode édition d’article

    Cliquez sur le bouton “+” en bas à droite puis tapez HTML dans la barre de recherche pour trouver le bloc


  4. Coller le code dans le bloc

    Le bloc autorise le collage d’une chaîne de caractère, collez donc le code dans le bloc. Vous pouvez ensuite cliquer sur “Preview” pour visualiser ce que donnera l’intégration une fois votre article publié.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *