> ## 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.

# Salesforce Integration

> Connect your SFCC-based marketplace directly to Topsort's auction engine for sponsored products and banner ads

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">July 20, 2025</Badge>
  <Badge color="purple" size="sm" icon="server">Ad Server</Badge>
  <Badge color="green" size="sm" icon="sparkles">New Feature</Badge>
</div>

We've added a comprehensive **Salesforce Commerce Cloud (SFCC) Integration** that enables SFCC-based marketplaces to seamlessly connect with Topsort's auction engine. Display bid-ranked sponsored products and banner ads directly within your native storefront experience.

## Key Benefits

**Native User Experience**:
Sponsored products and banners integrate seamlessly into your existing SFCC storefront without disrupting the customer journey

**Monetize Product Listings**:
Generate revenue from vendor bids while maintaining your marketplace's native look and feel

**Real-Time Optimization**:
Dynamic placement optimization based on Topsort's auction logic maximizes both user experience and revenue

**Minimal Setup Required**:
Quick implementation with just API credentials and simple auction calls in key pages

## Integration Features

### Sponsored Products

Transform your category and search pages with bid-ranked sponsored listings that feel native to your storefront.

**How It Works**

* Hooks into SFCC's category and search page controllers to send product context to Topsort
* Receives a ranked list of sponsored products from the auction engine
* Reorders visible listings based on real-time auction results

### Banner Ads

Monetize premium placements throughout your storefront with sponsored banner advertisements.

**How It Works**

* Integration sends requests to Topsort's `auction` endpoint including banner slot information
* Topsort responds with ranked banner creatives based on auction results
* Banners render in designated slots on homepage, search, or category pages

## Implementation

1. **Configure API Credentials** - Set up your Topsort API credentials in your SFCC environment

2. **Inject Auction Calls** - Add auction calls to key storefront pages (search, category, homepage)

3. **Map Product Context** - Send relevant product and page context to Topsort's auction engine

4. **Render Results** - Display auction-ranked sponsored products and banners in your storefront

5. **Test & Optimize** - Monitor performance and adjust placements for optimal results

## Resources

Get started with some documentation and code:

* [**SFCC Integration Guide**](/en/ad-platform/plugins/salesforce/) - Setup instructions
* [**GitHub Repository**](https://github.com/Topsort/salesforce-topsort-auctions) - Implementation

***

The Salesforce Commerce Cloud integration is available now. Contact your Topsort representative to begin implementation and start monetizing your SFCC marketplace with sponsored products and banner ads.

<ChangelogActions />