Skip to main content

Intégrer un webtoon

Intégrez un webtoon GenToon à votre blog ou à votre site, et vos lecteurs pourront faire défiler toutes les cases sur place, sans quitter votre page.

À quoi ça ressemble

Voici le vrai lecteur intégré. Essayez de faire défiler les cases.

Comment intégrer

  1. Dans la publication, appuyez sur « Intégrer »

    Vous le trouverez sous la publication du webtoon, juste à côté du bouton de partage.

  2. Choisissez une taille

    Choisissez entre Petite, Standard et Grande. Si la colonne de votre page est étroite, activez « Code adaptatif ». L’aperçu affiche votre choix immédiatement.

    Dans « Mode de lecture », vous pouvez choisir entre « Case par case » (par défaut) et « Défiler vers le bas ». En défilant vers le bas, la lecture commence toujours à la première case.

  3. Appuyez sur « Copier le code » et collez-le

    Collez-le dans l’éditeur HTML de votre blog ou de votre site, et le tour est joué.

Dans l’appli, appuyez sur le bouton de partage de la publication, puis choisissez « Intégrer » pour copier le code.

Où le coller

WordPress auto-hébergé
Collez simplement le lien de la publication : le lecteur intégré s’affiche tout seul. Utilisez « Copier le lien » dans la fenêtre d’intégration.
Blogs et sites qui acceptent le HTML
Collez le code obtenu avec « Copier le code » dans l’éditeur HTML.
Champs qui n’acceptent qu’une adresse
Si un champ n’accepte qu’une adresse, utilisez l’adresse du lecteur intégré. Elle a la forme de la ligne ci-dessous, et l’identifiant à la fin correspond à la dernière partie de l’adresse de la publication.
https://www.gentoon.ai/embed/post/<id-publication>
Appuyez sur « Copier l’adresse d’intégration » dans la fenêtre d’intégration pour copier cette adresse.

Ailleurs, tout dépend si le site autorise du HTML externe ou une iframe. Si ce n’est pas le cas, partagez le lien avec « Copier le lien ».

Bon à savoir

  • Le lecteur intégré n’utilise aucun cookie et ne demande jamais à personne de se connecter.
  • Si l’auteur supprime la publication ou la rend privée, elle n’est plus visible là où elle a été intégrée.
  • Le texte des boutons du lecteur intégré s’affiche dans la langue de chaque personne qui lit.
  • Dans la fenêtre d’intégration, la section « Résultats des intégrations » permet aux auteurs de voir combien de fois leur webtoon a été lu sur d’autres sites.

Pour les développeurs

Si votre service prend en charge oEmbed, un simple lien vers la publication suffit pour afficher le lecteur intégré.

Endpoint oEmbed

Passez l’adresse de la publication dans le paramètre url. Les formats sont json et xml, et maxwidth et maxheight réduisent le lecteur intégré en gardant ses proportions. Les pages de publication contiennent des balises link de découverte oEmbed.

https://www.gentoon.ai/api/oembed

GET https://www.gentoon.ai/api/oembed?url=https%3A%2F%2Fwww.gentoon.ai%2Fcommunity%2Fposts%2F9fa0016a-1192-4a72-afa8-d0ffad90c315&format=json
GET https://www.gentoon.ai/api/oembed?url=https%3A%2F%2Fwww.gentoon.ai%2Fcommunity%2Fposts%2F9fa0016a-1192-4a72-afa8-d0ffad90c315&format=xml

Codes de réponse : 200 OK · 404 la publication n’existe pas ou l’adresse n’est pas celle d’une publication GenToon · 401 la publication existe mais ne peut pas être intégrée (publications privées ou disponibles uniquement dans l’appli, par exemple) · 501 un format autre que json ou xml.

<iframe src="https://www.gentoon.ai/embed/post/9fa0016a-1192-4a72-afa8-d0ffad90c315" width="400" height="644" title="Intégrer un webtoon · GenToon" frameborder="0" scrolling="no" loading="lazy" allow="clipboard-write; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen style="border:0;max-width:100%"></iframe>

Adresse du lecteur intégré et paramètres

https://www.gentoon.ai/embed/post/9fa0016a-1192-4a72-afa8-d0ffad90c315?hl=en&theme=dark&start=2&layout=scroll
hl
Fixe la langue (par exemple en ou ja). Sans ce paramètre, le lecteur intégré suit la langue du navigateur de la personne qui lit.
theme
Utilisez dark pour un lecteur intégré sombre.
start
Commence à la case N (en comptant à partir de 1).
layout
Utilisez scroll pour lire les cases les unes sous les autres. Sans ce paramètre, on passe les cases une par une. Les codes d’intégration oEmbed affichent toujours une case à la fois.

Le bouton plein écran n’apparaît que si l’iframe contient allowfullscreen (notre code d’intégration l’inclut). WordPress supprime cet attribut et Safari sur iPhone ne prend pas en charge le plein écran, donc le bouton n’y apparaît pas. Le bouton des sous-titres (CC) n’apparaît que si la langue de la personne qui lit diffère de celle des dialogues, et il charge une traduction une seule fois quand on appuie dessus.

Messages de hauteur (postMessage)

Le lecteur intégré prévient la fenêtre parente quand sa hauteur change. Écoutez les messages ci-dessous et redimensionnez l’iframe.

Format par défaut

{"type":"gentoon:embed:resize","postId":"9fa0016a-1192-4a72-afa8-d0ffad90c315","height":644}

Format Embedly et Iframely

JSON.stringify({"src":"https://www.gentoon.ai/embed/post/9fa0016a-1192-4a72-afa8-d0ffad90c315","context":"iframe.resize","height":644,"domains":"all"})

Format WordPress (quand l’adresse se termine par #?secret=)

{"message":"height","value":644,"secret":"<secret>"}

Les réponses du lecteur intégré ne déposent aucun cookie et sont marquées noindex, donc les moteurs de recherche ne les indexent pas.

Questions

Si l’intégration ne fonctionne pas ou si vous souhaitez devenir partenaire, écrivez-nous à service@gentoon.ai.

Retour à l’aide