Buttons, placement, and styling

Overview

Allspice is designed to blend seamlessly into your site while giving you control over appearance, behavior, and entry points.

This page explains how to:

• adjust widget theme and display settings
• enable or disable features and behaviors
• create custom entry points from your own site UI

If you manage multiple domains, each domain has independent customization settings. Entry points are scoped by domain, and changes to one domain do not affect others.

Prerequisites

To customize Allspice settings, you must meet the following requirements:

• Your domain must be verified
• Allspice must already be installed on your site
• You must have access to the Publisher Portal (and optionally your site code for custom entry points)
• The Allspice plugin must be active (WordPress only)

Theme & Visual Settings

Allspice allows you to customize key visual elements so the widget feels native to your brand.

Currently, you can configure:

• Primary accent color
• Secondary accent color
• Chatbot name (display name shown to users)

These can be configured in the Integrate tab under Domain Settings.

These settings affect Allspice-rendered UI only and do not modify your site's styles. If you're using premade buttons, you can also configure premade button colors in the Partner Portal to match your site theme.

Feature & Behavior Settings

Feature and behavior settings control what actions users can take through the Allspice widget. These settings apply at the domain level.

Currently, you can control the chat's ability to answer questions about certain topics:

• General cooking questions
• Pantry management
• Recipe management
• Meal planning
• Grocery list management
• Recipe interactions

Soon, you will also be able to enable or disable specific widget areas and tabs (for example: meal plans or pantries). We recommend leaving all features enabled at the current time.

Chat Responses

Allspice allows you to provide domain-specific context that will be factored into chatbot responses on your site.

This can be configured in the Domain Settings page.

Examples of supported configuration include:

• Audience insights and goals
• Your cooking philosophy and style
• Information that impacts substitutions and recipe editing
• Ingredients to prioritize or avoid

More information on this feature will be available shortly.

Creating Custom Entry Points

Allspice gives you two layers of control: premade buttons and blocks you enable and place through the Partner Portal (and your recipe template where needed), and fully custom elements on your site that trigger Allspice via classes and portal mapping.

Premade entry points

These are ready-made UI patterns. Enable them per domain and place them where your theme or recipe card allows - no hand-built markup for the button itself.

Allspice Rail

A floating rail that updates by scroll position so the next best action matches where the reader is in the post. Readers can dismiss it (×) for the rest of the session, expand or collapse it (for example to show the “Ask Me Anything” field), and drag it so it never covers what they want to read.

Four automatic states:

1. Jump to Recipe - top of the post, before the recipe card. Header “Recipe tools”, CTA scrolls to the recipe card.
2. Ask Me Anything - mid-article. Header “Recipe assistant”; expands to an AI question field without leaving the page.
3. Build Grocery List - near ingredients. Header “Plan & shop”; opens the grocery and meal-planning flow.
4. Start Cooking - near instructions. Header “Cook mode”; launches step-by-step Cook Mode.

Floating Button

A small circular control with the Allspice leaf, fixed to the left or right edge of the viewport - always visible while scrolling. One steady action (unlike the Rail’s scroll-based states). Placement is automatic; you choose the side in the Partner Portal.

Cooking CTA

An inline coral banner in the post flow - usually above the recipe card or near the top. It pairs Start Cooking and Plan & Shop with a bookmark control and supporting tagline, so the two highest-intent actions are visible in one strip.

Allspice Overview

An inline block (not a floating chip) - typically between the article and the recipe card. It can surface Key Points (AI bullets), a visual ingredients strip with grocery selection, and an Ask me about this recipe bar. You can tune which parts show and match colors to your brand.

Action Bar

Built for WP Recipe Maker: two full-width coral buttons side by side - Cook step-by-step and Build grocery list - plus a bookmark icon. More width than the Guided Cooking button because both primary actions are exposed at once. Add it in the WPRM template (often between ingredients and instructions).

Groceries Button

A prominent full-width Build a grocery list control above the ingredients block in the recipe card - ideal when you want shopping intent right before readers scan quantities.

Guided Cooking Button

A template-placed control inside the recipe card (above or below the instructions heading works well) that launches Cook Mode for step-by-step guidance.

Coming soon

• Newsletter Signup Form - premade capture aligned with Allspice flows.
• Save Recipe Form - premade save experience for readers.

Custom HTML entry points

For your own buttons, nav items, or banners, add an Allspice class to any element and map its action in the Partner Portal (per domain). That lets you match your typography, spacing, and layout while still opening the right Allspice surface.

You can:

• use your own buttons and site styling
• integrate Allspice into custom layouts and site navigation
• launch specific Allspice views on demand

Examples:

• a “Chat with Allspice” control in your header
• a “Build grocery list” CTA on your homepage
• a “Search recipes” item in your nav
• a “Meal plans” promo on a landing page

Setup:

• add the Allspice class name to an element on your site
• assign the element’s action in the Partner Portal (domain-scoped)

Custom Buttons in Required Code docs →