@plugdash/engage

The engagement bundle

The engagement bar your blog needed from day one.

320 words·2min read

A convenience bundle that composes heartpost, sharepost, and shortlink into one component. Drop EngagementBar.astro into your Post layout and readers get all three signals with one import.

npm install @plugdash/engage
beta GitHub

This is the default. No configuration.

Setup

  1. Install and register

    npm install @plugdash/engage
    // engage is not registered in astro.config.mjs.
    // Register heartpost, sharepost, and shortlink instead,
    // then import EngagementBar.astro directly:
  2. Add to your layout

    import EngagementBar from "@plugdash/engage/EngagementBar.astro"
    
    <EngagementBar post={post} />

engage is a bundle. Register heartpost, sharepost, and shortlink as plugins, then import EngagementBar.astro from @plugdash/engage in your Post layout.

It looks right. But it's yours to change.

Props

proptypedefaultdescription
post EmDash content item Required
showHeart boolean true Render heart button
showShare boolean true Render share buttons
showCopy boolean true Render copy link
variant "circle" | "pill" | "ghost" "circle" Visual style

CSS custom properties

tokendescription
--plugdash-engage-gap Space between actions
--plugdash-engage-size Button size
--plugdash-engage-radius Button radius

Components are intentionally simple. Copy src/EngagementBar.astro into your theme and modify freely - no upstream coupling.

Pairs well with

engage wraps these three. Install all three, then use engage's component.

heartpost

alpha

The simplest signal readers can send. Show them you counted it.

npm install @plugdash/heartpost

sharepost

beta

Readers who want to share your work shouldn't have to work for it.

npm install @plugdash/sharepost

shortlink

alpha

A short URL for every post, ready to paste anywhere.

npm install @plugdash/shortlink