マンガを埋め込む

開発者向け

oEmbedに対応しているサービスなら、投稿のリンクだけでプレーヤーを表示できます。

oEmbedエンドポイント

urlに投稿のアドレスを入れます。形式はjsonとxmlで、maxwidth・maxheightを指定すると、比率を保ったまま縮小します。投稿ページには、oEmbedディスカバリー用のlinkタグが入っています。

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

レスポンスコード：200 正常 · 404 投稿が存在しないか、GenToonの投稿のアドレスではありません · 401 投稿はありますが、埋め込めません（非公開の投稿やアプリでのみ見られる投稿など） · 501 jsonとxml以外の形式です。

<iframe src="https://www.gentoon.ai/embed/post/9fa0016a-1192-4a72-afa8-d0ffad90c315" width="400" height="644" title="マンガを埋め込む · 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>

プレーヤーのアドレスとパラメーター

https://www.gentoon.ai/embed/post/9fa0016a-1192-4a72-afa8-d0ffad90c315?hl=en&theme=dark&start=2&layout=scroll

hl

表示言語を固定します（例：en、ja）。指定しない場合は、読む人のブラウザの言語に従います。

theme

darkを指定すると、暗い画面で表示されます。

start

N番目のコマから表示します（1から数えます）。

layout

scrollを指定すると、コマを縦につなげて読めます。指定しない場合は、1コマずつめくって読みます。oEmbedの埋め込みコードは、常に1コマずつです。

全画面ボタンは、iframeにallowfullscreenがあるときだけ表示されます（埋め込みコードには入っています）。WordPressはこの属性を削除し、iPhoneのSafariは全画面に対応していないため、そこではボタンが表示されません。字幕（CC）ボタンは、読む人の言語がセリフの言語と違うときだけ表示され、押すと翻訳を1回読み込みます。

高さの通知（postMessage）

プレーヤーは、高さが変わると親ウィンドウに知らせます。下の形式のメッセージを受け取り、iframeの高さを合わせてください。

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

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

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

プレーヤーのレスポンスはCookieを設定せず、noindexが指定されているため、検索エンジンにはインデックスされません。