外部リンク先をページ内に埋め込む
旧タイトル: URLプレビュー機能
/ymtszw/ymtszw.icon Atsushi.icon tkgshn.icon
Raw URLを以下のように行の唯一の要素として貼ったとき、自動でハイパーリンクが有効になるだけでなく、リンク先のOGPメタデータを読み取って、存在していればリンクの下にブロックでプレビュー表示する、という機能があるとうれしいです。 リンクタイトルは以下のように自分で明示指定したい場合もあると思うので、その場合もリンクが行の唯一の要素であるならプレビューが有効になるといいかもしれません。
リンク集、ブックマークのようなページを作るとき便利だと思います。
何らかの文法でオプトアウトできるとベターかもしれません。
[& https://ogp.me/] とか
既存のページに存在するリンクが一斉にプレビューを表示し始めると見た目がガラッと変わるケースが出てくるので、オプトイン方式で導入するほうがいいかもしれません。
[& https://ogp.me/]とかで表示されるオプトイン方式に賛成です(記号は適当に選ぶとして) nekketsuuu.icon
リンク文字列が設定できなくなってしまいますが、OGPを表示するのであれば不要ではと思っています。YouTubeの動画埋め込みにリンク文字列設定しませんし。
[&リンク文字列 https://ogp.me]みたいな記法を用意するのはアリかもですが、ちょっと記法が重いのと、互換性をそれなりに破壊しそうなので自分は消極的です。
文中にこのようにリンクが含まれている場合は、複数存在するケースも踏まえると、ごちゃごちゃするのでプレビューを出さないほうが良さそうです。 Scrapboxのページ間リンクも同じように扱ってもいいかもしれません
わかります。twitterとか地図とかも埋め込みたいですshokai.icon
サトポッポ.iconページ下のLinksに一覧のように外部リンクも関連リンクとして表示されると良いなぁ、とか思いました
この機能、非常に欲しい。。。 Atsushi.icon yujif.iconサトポッポ.iconshao.iconxenopot.iconhanamura.icontkskkd.iconhama.iconnekketsuuu.iconompugao.iconRMQ.icon/icons/+1.icon/icons/+1.iconyosider.iconyuta0801.icontakker.iconerniogi.icontkgshn.iconwogikaze.iconmoriken.iconinajob.icon
nekketsuuu.icon
Scrapbox上での編集しやすさとトレードオフになるでしょうか?
YouTubeの動画埋め込みは(僕には)分かりやすいのですが、同じ様にOGPも分かりやすい……となるのではないでしょうか。 トレードオフになりますね。特にテキストはテキストとしてscrapboxに引用した方が、リンク記法を付けたりしやすいshokai.icon
URLを渡したら対象のOGPを取得して画像を返すようなものを作ると画像として埋め込めそうyuta0801.icon
画像を書くのが少し手間だけど、popup menuに追加すれば割と簡単に対応できそう
/ci7lus/ci7lus.iconさんが作成されていましたtakker.icon
https://ricapitolare.vercel.app/svg?url=https://ogp.me/#.svg https://ogp.me/
/emoji/clap.iconyosider.icon
画像を生成するのは面倒ですが、IMGタグはSVGも受け取れるのでSVGもありかなと思いました。/tech-notes/TakashiSasaki.icon
SVGの中には<text>が書けるので文字列としてコピペにも便利
SVGの中には<a>が書けるのでクリッカブルでもある
みなさんがこれは良いと思うカード表示を教えて下さいshokai.icon
カード型のOGP埋め込みは、どのwebサービスでも、どのカードでも、どれもこれも読みづらいと感じている
良いと思うスタイルの例が知りたい
懸念はテキスト中心のコンテンツの埋め込みとOGPだけで、それ以外の埋め込みはUI上の懸念はなさそう?takker.icon
テキスト中心コンテンツ(例:twitter、google document)は、ブラケティングしたくなるので、単純にiframeで埋め込むだけではいけない
テキスト以外の埋め込みなら、編集する余地がないので問題なさそう
実際、vimeo, youtube, google map, 動画, 音声, spotify, audiofmと次々と実装されている
埋め込みについては oEmbedという仕様もあるので、OGPだけではなくてこちらも考慮した方がよさそうですmoriken.icon oEmbedは難しいという話がありましたmtane0412.icon