The Daily Spark Widget

🔧 Installation Instructions for most websites (HTML / Vanilla JS)

Add the following HTML snippet where you want the widget to appear:

<div
  class="spark"
  data-partner-url="https://www.your_domain.com"
  data-partner-id="YOUR_PARTNER_ID"
  data-theme="light"
  data-limit="6"
></div>

<script src="https://cdn.buffalosfire.com/the-daily-spark.js" async></script>

⚙️ Configuration options

• data-partner-url: The base URL of your site (required for tracking and attribution).
• data-partner-id: Your unique partner ID (contact us to obtain this).
• data-theme: Appearance theme:
  • light: Light mode
  • dark: Dark mode
  • auto: Follows the visitor’s system preference.
• data-limit: Number of articles to show. Accepts 3, 6, 9, or 12.
• data-layout: vertical or grid.
  The layout determines how the widget displays:
  • On larger screens, vertical shows a stacked sidebar style, while grid arranges items in a responsive grid.
  • On smaller screens (mobile), the widget always falls back to the vertical layout for readability.
  • You can see a demo in the sidebar of this article (if you're viewing on desktop) and below this text for the grid layout example.

💡 Platform notes

This simple embed method works best on platforms that allow custom HTML and third-party scripts.

• Wix: Use the "Embed HTML" widget to paste the snippet.
• Squarespace: Use a "Code Block" to add the HTML and script.
• Drupal: Paste the snippet into a block or page using the "Full HTML" input format.
• Webflow / Weebly / Ghost / other builders: Works similarly — use their custom code or embed HTML features.

For platforms that don't allow third-party scripts directly (or if you need tighter integration), a dedicated plugin may be a better option — we provide a plugin for WordPress, a tutorial for React and Next.js and plan to support other platforms soon.

❓ Need help?

Contact us at spark@buffalosfire.com to get your unique partner_id or for integration support.

🔧 Installation Instructions for WordPress websites

If you are using WordPress, we provide a plugin that makes it easy to embed The Daily Spark widget using a shortcode.

Download the plugin ZIP file here:

Download Spark Widget Plugin

Then install it on your WordPress site:

1. Log in to your WordPress Admin panel.
2. Go to Plugins → Add New.
3. Click Upload Plugin.
4. Upload the downloaded spark-widget-plugin.zip file.
5. Click Install Now, then Activate.

📖 Usage

After activation, you can embed the widget in one of two ways:

Method 1: Shortcode

Use this shortcode anywhere shortcodes are supported (e.g., posts, pages, widgets):

[spark_widget partner_url="https://www.your_domain.com" partner_id="YOUR_PARTNER_ID" theme="light" limit="6" layout="vertical"]

You can adjust the attributes as needed:

• partner_url: The base URL of your site (required for tracking and attribution).
• partner_id: Your unique partner ID (required).
• theme: light, dark, or auto.
• limit: Number of articles to show (3, 6, 9, 12).
• layout: vertical or grid.

Example:

[spark_widget partner_url="https://www.mysite.com" partner_id="12345" theme="dark" limit="9" layout="grid"]

Method 2: HTML <div>

Alternatively, you can manually add the widget <div> anywhere in your theme files or HTML blocks — the plugin ensures the required JavaScript is loaded automatically:

<div
  class="spark"
  data-partner-url="https://www.your_domain.com"
  data-partner-id="YOUR_PARTNER_ID"
  data-theme="light"
  data-limit="6"
  data-layout="vertical"
></div>

💡 Platform notes

• Once activated, the plugin automatically enqueues the required JavaScript file (the-daily-spark.js) across your site.
• No need to manually add the <script> tag if the plugin is active — just add the <div> or use the shortcode.
• No additional configuration is required.
• ⚠️ Please note that the plugin is currently in beta; let us know if you encounter any problems.

❓ Need help?

Contact us at spark@buffalosfire.com to get your unique partner_id or for integration support.