Smart Footer Banner

Show Preview
Smart Footer Banner
Smart Footer Banner

About Smart Footer Banner

Smart Footer Banner is a premium footer component that adds an interactive, scroll-aware callout to your site. Hidden by default, it smoothly slides up when users scroll near the bottom of the page, and retracts when they scroll away.

Features & Capabilities:

  • Scroll detection: Set a custom threshold (e.g., 70–90% scroll) for when the footer appears.

  • Smooth animations: Choose from slide, fade, or combined reveal styles with adjustable speed and easing.

  • Flexible content: Add text, links, or full CTAs (button + description).

  • Styling controls: Colors, typography, padding, border radius, shadows, and background options.

  • Sticky mode: Keep the footer visible after first reveal or auto-hide when scrolling back up.

  • Responsive: Works seamlessly across desktop, tablet, and mobile layouts.

  • Accessibility: Keyboard-navigable buttons, ARIA labels for screen readers.

Use Cases:

  • Newsletter signup prompts

  • Limited-time offers or sales messages

  • Cookie consent or policy reminders

  • “Back to top” or quick link callouts

How to use:

  1. Place the component at the bottom of your page.

  2. The footer is hidden by default and will slide up when users scroll down past the reveal threshold (80% by default).

  3. It will hide again when scrolling up.

  4. Adjust the “Reveal Threshold” property (e.g., 50–90%) to control when it appears.

  5. Works best in Preview or Published mode — make sure your page has enough content to scroll.

From John Valentine

Announcement Bar
Highlight Reveal
Smart Tooltip Popup
Video Gallery Grid

Related Components

Ink Reveal Footer
Scroll Sync Showcase
Skewed Hero
Cinematic Video