Menu
close
Start Free Trial
Start Free Trial

Sidebar Widget - Setup Guide

Last Updated: December 2025

What is the Sidebar Widget?

The Sidebar Widget is a collapsible panel that appears on the side of your website, providing a persistent call-to-action (CTA) for visitors. It features:

  • Rotating Headlines: A/B tested messages that automatically optimize for best performance
  • Brand Customization: Match your colors, fonts, and style
  • Click-to-Call or Book Button: Direct visitors to call or book appointments
  • Gradient Branding: Professional gradient effects on your brand colors
  • Smart Analytics: Track impressions, conversions, and headline performance

Setup Instructions

Step 1: Enable the Sidebar Widget

  1. Log into your Client Dashboard
  2. Navigate to the Settings tab
  3. Scroll to Enabled Widgets section
  4. Check the box for "Sidebar Widget"
  5. Click "Save Settings" at the bottom of the page

Step 2: Configure Basic Settings

In the Sidebar Configuration section:

  1. Widget Position: Choose Left or Right side of screen
  2. Brand Color: Select your primary brand color (used for gradient background)
  3. Text Color: Choose the color for headlines and text
  4. Button Text: Customize what appears on your CTA button (e.g., "Book Now", "Call Us", "Get Started")
  5. Button Type: Choose between:
    • Book Button: Links to your booking page
    • Call Button: Displays phone number and enables click-to-call
  6. Booking URL or Phone: Enter your booking page URL or phone number (include country code like +1 for phone)

Step 3: Configure Headlines

Navigate to the Widget Configuration tab:

  1. Create URL Groups: Define which pages show which headlines
    • Primary Page URL: Main page for this headline group (e.g., /services)
    • Additional URLs: Other pages to show these headlines (one per line)
    • Excluded URLs: Pages to NOT show these headlines
  2. Add Headlines: Create 3-5 headline variations for A/B testing
    • Examples: "Book Your Free Consultation", "Schedule a Call Today", "Start Your Journey Now"
    • The system will automatically rotate and test which performs best
  3. Click "Save Headlines"

Step 4: Install Widget Code

  1. Go to the Installation tab in your dashboard
  2. Copy the installation code snippet
  3. Paste into your website's <head> or before </body> tag (see platform-specific instructions below)
  4. Save/publish your website

Step 5: Test the Widget

  1. Visit your website in an incognito/private browser window
  2. Verify the sidebar appears on the correct side
  3. Check that colors and text match your settings
  4. Click the button to ensure it links to the correct URL/phone
  5. Refresh the page multiple times to see different headlines rotate

Platform-Specific Installation

WordPress

Use a plugin like "Insert Headers and Footers" or add to your theme's footer.php file before the closing </body> tag.

Wix

Dashboard → Settings → Custom Code → Add code to "Body - End" section.

Squarespace

Settings → Advanced → Code Injection → Footer section.

Shopify

Online Store → Themes → Edit Code → theme.liquid file before </body>.

Custom HTML Sites

Paste before the closing </body> tag on every page, or in a global footer template.

Customization Tips

Headline Best Practices

  • Keep headlines under 50 characters for best display
  • Use action-oriented language ("Book", "Schedule", "Get", "Start")
  • Test different value propositions (free consultation, limited time, exclusive offer)
  • Create variety - the system will identify what works best

Color Selection

  • Use high contrast between background and text colors
  • Test your colors on both desktop and mobile devices
  • Consider your brand guidelines and website design
  • The gradient effect adds depth - experiment with different base colors

Button Optimization

  • Keep button text short and actionable (1-3 words ideal)
  • "Book Now" and "Call Us" typically perform better than generic "Click Here"
  • For phone buttons, include area code in display (e.g., "(555) 123-4567")
  • Test different CTAs to see what drives more conversions

Common Issues & Solutions

Widget doesn't appear on my site

Check these items:

  1. Sidebar Widget is enabled in Settings tab
  2. Installation code is correctly pasted in your website
  3. Your subscription is active and not expired
  4. At least one headline is configured for the current page
  5. Browser cache is cleared (try incognito/private mode)

Debug steps:

  • Open browser console (press F12)
  • Look for JavaScript errors related to widgets
  • Verify your client ID matches between installation code and dashboard
  • Check that widget-gateway.js is loading from CDN

Widget appears on wrong side

Solution:

  • Go to Settings tab → Sidebar Configuration
  • Change "Widget Position" to Left or Right
  • Save Settings and clear browser cache

Headlines don't rotate

Explanation: Headlines rotate per visitor session using A/B testing. You'll see one headline consistently during a browsing session, but different visitors see different headlines. To test rotation:

  • Open incognito window and note the headline
  • Close window and open a new incognito window
  • You should see a different headline (or the same if it's the top performer)

Button doesn't work when clicked

Check these items:

  1. For Book Buttons: Verify booking URL is complete (include https://)
  2. For Call Buttons: Ensure phone number includes country code (e.g., +15551234567)
  3. Test on both desktop and mobile devices
  4. Check browser console for errors

Colors don't match my brand

Solutions:

  • Use a color picker tool to get exact hex codes from your website
  • Adjust text color if hard to read against background
  • Preview changes in dashboard before saving
  • Consider that gradients may appear different on various screens

Widget covers important content

Solutions:

  • Switch widget to opposite side (Left ↔ Right)
  • Adjust your website's layout to account for sidebar space
  • Consider using Smart Button widget instead if sidebar conflicts with site design
  • Check mobile view - widget may behave differently on small screens

Analytics & Performance

Viewing Sidebar Analytics

  1. Navigate to Analytics tab in dashboard
  2. Select "Sidebar Widget" from widget filter
  3. Review performance metrics:
    • Impressions: How many times widget was displayed
    • Conversions: How many times button was clicked
    • Conversion Rate: Percentage of impressions that converted
    • Winner Badge: Identifies best-performing headline

Improving Performance

Low impressions:

  • Verify widget appears on high-traffic pages
  • Check URL targeting to ensure headlines match your most visited pages
  • Confirm widget isn't disabled or hidden on certain pages

Low conversion rate:

  • Test different headlines (Auto-Evolve on Pro/Premium/Expert plans helps)
  • Review button text - make it more actionable
  • Ensure booking URL is working correctly
  • Try different color combinations for better visibility

Best practices:

  • Let A/B testing run for at least 7-14 days before making manual changes
  • Export analytics data monthly to track long-term trends (Pro/Premium/Expert plans)
  • Compare performance across different URL groups to identify what works
  • Use Auto-Evolve feature to automatically refresh underperforming headlines

Advanced Features

Auto-Evolve Headlines (Pro, Premium & Expert Plans)

Auto-Evolve automatically refreshes underperforming headlines with AI-generated alternatives:

  • Pro Plan: Refreshes every 30 days
  • Premium Plan: Refreshes every 14 days
  • Expert Plan: Refreshes every 14 days

How it works:

  1. System identifies headlines with low conversion rates
  2. AI generates fresh alternative headlines based on your best performers
  3. New headlines are automatically tested against existing ones
  4. Process repeats to continuously optimize messaging

To enable:

  • Navigate to Widget Configuration tab
  • Enable "Auto-Evolve Headlines" toggle
  • System runs automatically - no further action needed

URL Targeting

Create sophisticated targeting rules:

  • Homepage: Welcome messaging and general CTAs
  • Service Pages: Service-specific offers and CTAs
  • Blog Posts: Educational CTAs and resource downloads
  • About Page: Team introductions and consultation offers

Example setup:

  • Group 1 (Homepage): Primary /, Headlines: "Book Your Free Consultation"
  • Group 2 (Services): Primary /services, Additional: /services/landscaping, Headlines: "Get a Custom Quote"
  • Group 3 (Blog): Primary /blog, Excluded: /blog/category/news, Headlines: "Download Our Free Guide"

Branding Disclosure

Important: Branding appears on widgets for Starter plan and trial accounts only. Pro, Premium, and Expert plans have all branding removed automatically.

Branding behavior:

  • Starter Plan & Trial Accounts: Small "Powered by Crave" link in widget footer
  • Pro Plan ($49/month): No branding displayed (white-label)
  • Premium Plan ($79/month): No branding displayed (white-label)
  • Expert Plan ($99/month): No branding displayed (white-label)
  • Complimentary Accounts: No branding (unless configured as Marketing Account by admin)

To remove branding, upgrade to Pro plan or higher from your Billing tab.

Need Help?

Support Response Times:

  • Starter Plan: 48 hours
  • Pro Plan: 24 hours (priority support)
  • Premium Plan: 12 hours (premium support)
  • Expert Plan: 12 hours (premium support)

Contact Support:

  • From your Client Dashboard
  • Include website URL, client ID, and description of issue
  • Attach screenshots if applicable

Helpful resources:

  • FAQ document
  • General Troubleshooting Guide
  • Dashboard tooltips (hover over "?" icons)

Ready to get started? Follow the setup steps above and your Sidebar Widget will be live in minutes!

© 2026 -  Crave Media LLC. All rights reserved.
Privacy PolicyTerms of Service