header source
my icon
esplo.net
ぷるぷるした直方体
Cover Image for OG Card Generator - Card-style Link Generation App for Static Sites

OG Card Generator - Card-style Link Generation App for Static Sites

だいたい2分で読めます

Introduction Video

https://www.youtube.com/watch?v=k6avQD1RerY

Overview

On platforms like Hatena Blog and Medium, when you insert a link to an external page, it's displayed in a card format, which looks quite stylish.

For static sites, it's difficult to create typical card-style links that use OGP from external sites, as content needs to be finalized at build time.
Therefore, I created an app that outputs a card-style link in HTML/CSS format when given the URL of the target page, addressing this issue.

In essence, it's this ↓:

og card
OG Card

Note that I used AngularDart for this project.
Details are described in this article.

https://www.esplo.net/posts/2018/10/angular-dart-for-small-app/

How to Use

As the Demo site is currently not available, please check the GitHub code if needed.

https://github.com/esplo/og-card-generator

It is currently archived.

Share