Link card (`customblocks.generators.linkcard`)

A link card is a informative box about an external source. It is similar to the card that popular apps like Wordpress, Facebook, Twitter, Telegram, Slack... generate when you embed/post a link.

In order to build the box, the generator downloads the target url and extracts social metadata: Featured image, title, description... The download page is cached so that first non-failing download will avoid further downloads.

::: linkcard https://css-tricks.com/essential-meta-tags-social-media/

The Essential Meta Tags for Social Media | CSS-Tricks

These days, almost every website encourages visitors to share its pages on social media. We’ve all seen the ubiquitous Facebook and Twitter icons, among

Options

url: The url to embed as card
wideimage (bool, default True): Whether the featured image will be shown wide, if not, a small thumb will be shown
*args: any extra positional value will be added as class to the top level element

Additionally you can provide the following keyword parameters to override information extracted from the url:

image: the image heading the card
title: the caption
description: the text describing the link (though using content is recommended)
siteurl: a link to the main site
sitename: the name of the main site
siteicon: the site icon

Content, if provided, will be used as description instead of the summary in the page.

Styling

The above example uses this css.

That stylesheet have some configurable css vars you may modify.

Examples

::: linkcard nowideimage https://css-tricks.com/essential-meta-tags-social-media/