Dash 4.5 Feature Preview: Social Media Meta Tags for Regular Dash Apps

Dash Python
1

New in Dash v4.5.0

Dash Pages automatically adds social media meta tags based on the title, description, and image for each page. Dash v4.5 extends this support to regular Dash apps using app-level metadata.

Social media platforms such as LinkedIn, Facebook, Discord, and others use Open Graph and Twitter meta tags to generate a preview when someone shares a link. These tags can specify the title, description, and image shown in the preview.

Regular Dash apps

Add title, description, and image when creating the app:

from dash import Dash, html

app = Dash(
    title="My Dash App",
    description="An interactive Dash application",
    image="social-card.png",
)

app.layout = html.Div("Hello!")

if __name__ == "__main__":
    app.run()

The image can be either an image in your assets/ folder:

image="social-card.png"

or a URL:

image="https://example.com/social-card.png"

Dash Pages

For a Dash Pages app, the app-level title, description, and image are used as the defaults for the social media meta tags.

To set different metadata for an individual page, specify title, description, and image in dash.register_page():

dash.register_page(
    __name__,
    title="Weekly Analytics",
    description="Explore weekly analytics",
    image="weekly_analytics.png",
)

Page-level values override the app-level values. This lets you set defaults for the application while customizing the social media preview for individual pages.

If image isn’t specified for a page or at the app level, Dash Pages can also automatically find an image in assets/. It looks for a page-specific image, followed by assets/app.* and assets/logo.*.

The existing image_url property is still supported for backwards compatibility. The image property can now be used for either an asset filename or a URL.

Opting out

The meta tags are generated by default in Dash Pages apps, and for regular Dash apps when app.description or app.image is supplied.

To opt out, set include_pages_meta=False in the app constructor.

Tips for a good social media preview

Keep the description concise and informative. Aim for a sentence or two that clearly describes what the app does. There isn’t a single recommended word count because social media platforms may truncate the description differently.

For the image, 1200 × 630 pixels is a good general-purpose size for social media previews. This 1.91:1 aspect ratio works well across LinkedIn, Facebook, X, Discord, and other platforms. Keep important text, logos, and other content away from the edges because platforms may crop the image differently.

2 Likes