NPO Setup Guide — AuctionPage

Before You Start

You will need the following values from your AuctionPage account. Find them under Settings → Integration in your NPO dashboard.

Value	What it is	Where to find it
`API Endpoint`	Base URL for the AuctionPage API	Always `https://portal.auctionpage.com`
`API Key`	Your NPO's secret API key — keep this private	NPO Dashboard → Settings → API Key
`NPO ID`	Your NPO's unique identifier (UUID)	NPO Dashboard → Settings → Organization Profile
`NPO Name`	Display name shown in the auction widget	NPO Dashboard → Settings → Organization Profile

Option 1 — Recommended for WordPress

WordPress Plugin

Step 1 — Install the plugin

Log in to your WordPress admin panel.
Go to Plugins → Add New.
Click Upload Plugin and select the AuctionPage plugin ZIP file.
Click Install Now, then Activate.

Step 2 — Configure the plugin

Open AuctionPage → Settings in your WordPress admin menu.
Enter your API Endpoint, API Key, NPO ID, and NPO Name.
Click Save Settings.
Use the Test Connection button to confirm everything is wired up correctly before continuing.

Step 3 — Add auctions to a page

Create or edit the WordPress page where you want auctions to appear.
Add the following shortcode in the page body:

[auctionpage_listings]

This displays all active auctions for your NPO. To show a single specific listing, use:

[auctionpage_listing id="LISTING_ID"]

Replace LISTING_ID with the listing's ID from your NPO dashboard.

Done. Publish the page and visit it — the auction widget should appear automatically.

Option 2 — Any website

Plain HTML / JavaScript Embed

Use this option if your site is not WordPress — it works with any website that lets you edit HTML.

Step 1 — Add a container element

Place this <div> wherever you want auctions to appear on the page:

<div id="auctionpage-root"></div>

Step 2 — Add the configuration and script

Paste this block just before the closing </body> tag. Fill in your values where shown.

<script>
window.AuctionPageConfig = {
  apiEndpoint:     'https://portal.auctionpage.com',
  apiKey:          'YOUR_API_KEY',
  npoId:           'YOUR_NPO_ID',
  npoName:         'Your NPO Name',
  mountSelector:   '#auctionpage-root',
  defaultScope:    'local',

  // Optional display settings
  initialLimit:    12,
  initialSort:     'ends_at_asc',
  initialTag:      '',
  initialStatus:   'active'
};
</script>

<script src="https://portal.auctionpage.com/embed/auctionpage-main.js"></script>

Important: Replace every YOUR_... placeholder with your real values from the Before You Start table above.

Step 3 — Add the stylesheet

Add this inside your page's <head> section:

<link rel="stylesheet" href="https://portal.auctionpage.com/embed/auctionpage.css">

Done. Save and reload the page — the auction widget will mount automatically into the container.

NPO Events

Setting Up an Event in the NPO Portal

Before you can embed an event on your website, create it in the NPO portal. Events group auction items into a single time-bounded campaign — like a spring gala or annual drive — with their own preview and bidding windows.

Step 1 — Create the event

In your NPO portal go to Events → New Event and fill in the following fields:

Field	Required	Notes
Name	Yes	Displayed on the event page and in the embed (2–200 characters).
Description	No	Shown below the event title. Up to 5,000 characters.
Cover image	No	Uploaded directly in the portal; appears at the top of the event page.
Preview opens	Yes	When visitors can start browsing items. Must be before the start time. Bidding is not yet open during this window.
Bidding starts	Yes	When bids are accepted. Must be after the preview time.
Bidding ends	Yes	Must be after the start time. All bidding closes at this moment.
Visibility	No	Public (default) — items appear in worldwide search. Private — items are only visible on the event page itself; useful for invite-only campaigns.

Click Save. The event is created immediately.

Step 2 — Add auction items to the event

Open the event in the portal and use Add Item to create listings directly under it. Items added this way are automatically linked to the event and inherit its visibility setting. All event listings use fixed-price bids — there is no proxy bidding for event auctions.

You can also link existing approved listings to an event from the listing's detail page.

Step 3 — Copy the Event ID

On the event detail page in the portal, copy the Event ID shown in the header or under Settings. You will need this when embedding the event on your website (see below).

Timing tip: Set the preview window a few days before bidding opens so your community can browse items and build anticipation before the auction goes live.

NPO Events

Embedding an Event Page

Events are time-bounded fundraising campaigns — like a spring gala or annual drive — where all auction items are grouped on a single dedicated page. Only one type of auction display (standard listings or an event) can be mounted on a given page at a time.

Event auctions use fixed-price bids only. The standard proxy-bidding flow does not apply to event listings.

Step 1 — Get your Event ID

In your NPO portal, open the event you want to embed and copy its Event ID from the event detail page.

Step 2 — Add a container element

Place this <div> on the page where the event's auction items should appear:

<div id="auctionpage-root"></div>

Step 3 — Add the configuration and script

Use the same configuration as a standard embed, but add the eventId parameter. Paste this block just before the closing </body> tag:

<script>
window.AuctionPageConfig = {
  apiEndpoint:     'https://portal.auctionpage.com',
  apiKey:          'YOUR_API_KEY',
  npoId:           'YOUR_NPO_ID',
  npoName:         'Your NPO Name',
  mountSelector:   '#auctionpage-root',
  eventId:         'YOUR_EVENT_ID',
};
</script>

<script src="https://portal.auctionpage.com/embed/auctionpage-main.js"></script>

Replace YOUR_EVENT_ID with the Event ID from Step 1. All other values come from your Before You Start table.

Step 4 — Add the stylesheet

If it is not already on the page, add this inside your <head> section:

<link rel="stylesheet" href="https://portal.auctionpage.com/embed/auctionpage.css">

Done. The page will show only the auction items belonging to that event. During the preview window, items are visible but bidding is not yet open.

Troubleshooting

Nothing appears at all: Open the browser developer console (F12) and check for JavaScript errors. Make sure the script and CSS URLs are reachable.
Blank container, no error: Confirm the container's id exactly matches mountSelector in your config — it's case-sensitive.
Authentication error: Double-check your apiKey and apiEndpoint. Keys are shown only once in the dashboard — generate a new one if you've lost it.
No auctions listed: Confirm your npoId matches the UUID in Settings → General and that your NPO has at least one active listing.
Styles look broken: Verify the stylesheet link is loading — check the Network tab in browser dev tools for a 404 or CORS error.
WordPress shortcode shows as plain text: Make sure the plugin is activated and you are using the Classic or Gutenberg shortcode block (not pasting into a plain-text paragraph).

Still stuck? Contact us at auctionpage.com/contact — our team typically responds within one business day.

Installing AuctionPage on Your Site

Before You Start

WordPress Plugin

Step 1 — Install the plugin

Step 2 — Configure the plugin

Step 3 — Add auctions to a page

Plain HTML / JavaScript Embed

Step 1 — Add a container element

Step 2 — Add the configuration and script

Step 3 — Add the stylesheet

Setting Up an Event in the NPO Portal

Step 1 — Create the event

Step 2 — Add auction items to the event

Step 3 — Copy the Event ID

Embedding an Event Page

Step 1 — Get your Event ID

Step 2 — Add a container element

Step 3 — Add the configuration and script

Step 4 — Add the stylesheet

Troubleshooting

Ready to raise more for your cause?