> ## Documentation Index
> Fetch the complete documentation index at: https://docs.topsort.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Banner Ads: Fallback Image Upload

> Upload fallback images directly for banner ad slots instead of providing URLs

export const ChangelogActions = () => {
  return <>
      <style>{`
        .changelog-actions {
          display: flex;
          justify-content: center;
          gap: 12px;
          margin-top: 2rem;
          padding-top: 1.5rem;
          border-top: 1px solid #e5e7eb;
        }
        
        [data-theme="dark"] .changelog-actions {
          border-top-color: #374151;
        }
        
        .changelog-btn {
          display: inline-flex;
          align-items: center;
          gap: 6px;
          padding: 8px 16px;
          border-radius: 9999px;
          border: 1px solid #d1d5db;
          background: transparent;
          color: #6b7280;
          font-size: 14px;
          cursor: pointer;
          transition: all 0.2s ease;
        }
        
        .changelog-btn:hover {
          border-color: #9ca3af;
          background: #f9fafb;
        }
        
        [data-theme="dark"] .changelog-btn {
          border-color: #4b5563;
          color: #9ca3af;
        }
        
        [data-theme="dark"] .changelog-btn:hover {
          border-color: #6b7280;
          background: #1f2937;
        }
      `}</style>
      <div className="changelog-actions">
        <button className="changelog-btn" onClick={() => {
    const btn = event.target.closest("button");
    btn.innerHTML = "❤️ Like";
    btn.style.borderColor = "#ec4899";
  }}>
          🤍 Like
        </button>
        <button className="changelog-btn" onClick={() => {
    const btn = event.target.closest("button");
    navigator.clipboard.writeText(window.location.href);
    const originalContent = btn.innerHTML;
    btn.innerHTML = "✓ Copied";
    btn.style.borderColor = "#22c55e";
    btn.style.color = "#22c55e";
    setTimeout(() => {
      btn.innerHTML = originalContent;
      btn.style.borderColor = "";
      btn.style.color = "";
    }, 2000);
  }}>
          ↗ Share
        </button>
      </div>
    </>;
};

<div
  style={{
display: "flex",
gap: "8px",
flexWrap: "wrap",
marginBottom: "16px",
}}
>
  <Badge color="gray" size="sm" icon="calendar">
    December 2, 2025
  </Badge>

  <Badge color="blue" size="sm" icon="rectangle-ad">
    Ad Platform
  </Badge>

  <Badge color="orange" size="sm" icon="arrow-up">
    Improvement
  </Badge>
</div>

<Note>
  **Why It's Important**

  Admins can now upload fallback images directly when configuring banner ad slots, eliminating the need to host images externally and provide URLs. This streamlines slot configuration and gives admins full control over fallback creatives.
</Note>

<Frame>
  <img src="https://mintcdn.com/topsort/IPYqfFwUqBX3axYX/images/changelog/banner-fallback.webp?fit=max&auto=format&n=IPYqfFwUqBX3axYX&q=85&s=3219d4047a9d10bdf11448ff6eada099" alt="Banner fallback image upload interface" width="565" height="542" data-path="images/changelog/banner-fallback.webp" />
</Frame>

Banner ad slot configuration now supports direct image uploads for fallback creatives. Previously, admins could only provide URLs to externally hosted images, requiring separate file hosting and creating potential for broken links.

## Use Cases

**House Brand Promotion**: When no paid ads are available to fill a banner slot, the fallback image displays instead of leaving the space blank. Upload fallback images promoting house brands, seasonal sales, or marketplace features to maintain a complete site appearance even during low ad inventory periods.

**Inventory Management**: For high-traffic placements like homepage hero banners that typically show sponsored ads, upload fallback images promoting your marketplace's loyalty program or key marketplace features. When ad inventory runs low, users see your promotion instead of an empty space, ensuring premium real estate is never wasted.

## What This Improves

**No external hosting needed**: Upload images directly from your local machine without managing CDNs or external URLs.

**Instant updates**: Replace or delete fallback images immediately in the admin dashboard without coordinating with external providers.

**Prevent broken images**: Eliminate broken links from expired or moved external resources that can leave banner slots empty.

<div
  style={{
margin: "3rem 0",
height: "3px",
background:
  "linear-gradient(to right, transparent, #00ff88 20%, #00d4ff 40%, #8280ff 60%, #ff6b9d 80%, transparent)",
borderRadius: "2px",
opacity: "0.6",
}}
/>

Any standard image format is supported. Navigate to banner slot settings in the Admin Dashboard to find the new upload option in the fallback creative section.

<ChangelogActions />