Adding to your website

To Add MicroWidgets to your website:

Add the script available in the Widgets Edit screen inside the <head></head> tag on your website

<aside> 💡 If you have enabled a Top bar it will display automatically on your website now.

</aside>

Adding GitHub Updates

Wherever you want to display a GitHub last update badge, simply add an HTML element with the class last-commit-date.

<p>Last Updated <span class="last-commit-date" /></p>

If you want to style it to show as a badge, here’s a Tailwind example:

<span
  className="bg-secondary  text-xs font-medium inline-flex items-center px-2.5 py-0.5 rounded border">
  Updated <span className="last-commit-date" />
</span>

Adding Stripe Updates

Wherever you want to display a Stripe number of customers update, simply add an HTML element with the class total-sales.

<p class="total-sales" />

Sample Page

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>My Page</title>
    <script
      defer
      src="SCRIPT_FROM_DASHBOARD"
      data-domain="microwidgets.dev"
    ></script>
  </head>
  <body>
    <h1>Welcome to My Page</h1>
    <p>Last Updated <span class="last-commit-date" /></p>
    <p class="total-sales" />
  </body>
</html>