ITエンジニア/デザイナ向けにオープンソースを毎日紹介

最近、Webサイトのサムネイル表示を目にすることがよくあります。SlackでURLを投稿した場合、ソーシャルメディア、キュレーションサイトなど様々なケースで使われます。次に問題になるのがその見せ方です。

サムネイルの画像を使ったり、サマリーの文字列をどう表示するかによってクリックされる可能性が変わってくるでしょう。そこで使ってみたいのがmicrolink.jsです。

microlink.jsの使い方

標準的な並べ方。リストで、サムネイルも同じ大きさです。

ちょっと角丸。

もっと角丸。

幅は自由に変更できます。

高さも変更できます。

画像の差し替えも可能です。

サムネイルを大きくしたパターン。

こちらも幅を変更できます。

カスタムイメージ。

microlink.jsを使うと印象強いWebサイトのプレビューが簡単に作れます。幅や高さなども自由に変更できるので、様々な場面で利用できるでしょう。ブログやメディアサイトなどで使ってみると良さそうです。

microlink.jsはJavaScript製のオープンソース・ソフトウェア(MIT)です。

microlink.js, Convert your links into beautiful previews.

Storybook

microlinkhq/microlinkjs: Convert your links into beautiful previews

MOONGIFTプレミアムに登録して運営をサポートしてください!月額500円の他、半年(3,000円)、年間パック(6,000円)もあります。企業向けに3アカウント以上で請求書払いも可能です(年間一括のみ)。従業員の方向けのサービスにいかがですか? プレミアムユーザのログインはこちらから

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2