Click Listing iFrame

Overview

The Click Listing iFrame is the simplest way to display personalized offer listings on your thank-you or results page. Instead of building a custom offer wall using the Click Listing API, you embed a single <iframe> tag and Pingtree handles the display, click tracking, and redirect logic automatically. The iFrame reads the transaction_id from the parent page URL using postMessage, then dynamically loads the offers matched to that consumer’s lead.

iFrame Embed Code

Obtain the iFrame source URL from your campaign settings in the Pingtree dashboard (under Click Listing > Embed Code). Replace the src value below with your specific iFrame URL:

<iframe 
    src="https://app.pingtree.com/iframe/YOUR_CLICK_LISTING_ID"
    width="100%"
    height="600px"
    frameborder="0"
    scrolling="yes"
    onload="(()=>{this.contentWindow.postMessage({s:window.location.search},'*');})()"
></iframe>

The onload attribute fires as soon as the iFrame loads and sends the current page’s query string (which contains the transaction_id) into the iFrame context via the postMessage API.

How It Works

The consumer submits a lead form and is redirected to your results page.
The results page URL contains ?transaction_id=txn_abc123... (and optionally cid, pid, and other parameters).
The embedded iFrame loads from Pingtree’s servers.
On load, postMessage sends the parent page query string into the iFrame.
The iFrame reads transaction_id from the received parameters and fetches the matched offers.
Offers are rendered inside the iFrame; clicks are tracked and redirect consumers to advertiser pages.

Requirements

Requirement	Details
`transaction_id` in page URL	Must be present as a query parameter on the parent page
iFrame source URL	Obtain from Pingtree dashboard — unique per click listing configuration
HTTPS	Both the parent page and iFrame source should be served over HTTPS
Browser JavaScript	`postMessage` is used for cross-origin communication; JavaScript must be enabled

Implementation Steps

Get your iFrame URL. In the Pingtree dashboard, go to your campaign’s Click Listing section and copy the embed URL for the desired listing.
Add the iFrame to your results page. Paste the embed code into the HTML where you want offers to appear.
Confirm transaction_id is in the URL. After form submission, ensure your redirect URL includes ?transaction_id=<value>. Pingtree typically appends this automatically.
Set dimensions. Adjust width and height to suit your page layout. A minimum height of 400px is recommended for comfortable offer display.
Test end-to-end. Submit a test lead and confirm the results page loads with offers. Check the browser console for any postMessage or CORS errors.

Example Results Page URL

https://results.yourdomain.com/thank-you?transaction_id=txn_7f3a2b1c&cid=cmp_9z8y7x6w&pid=src_abc123

The iFrame automatically reads transaction_id from the query string above via window.location.search.

Full Integration Example

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Your Personalized Offers</title>
</head>
<body>
  <h1>Here are your matched offers</h1>

  <iframe 
    src="https://app.pingtree.com/iframe/66b263223ebfc5d22f662814"
    width="100%"
    height="600px"
    frameborder="0"
    scrolling="yes"
    onload="(()=>{this.contentWindow.postMessage({s:window.location.search},'*');})()"
  ></iframe>
</body>
</html>

Technical Details

Detail	Value
Communication method	`window.postMessage` — cross-origin safe
Data sent to iFrame	`{ s: window.location.search }` (full query string of parent page)
Supported parameters	`transaction_id`, `cid`, `pid`, and all standard tracking parameters
Responsive behaviour	Set `width="100%"` for full-width display; height must be set explicitly
Click tracking	Handled automatically inside the iFrame

Security Considerations

HTTPS only. Serving the parent page over HTTP while the iFrame is on HTTPS (or vice versa) may cause mixed-content browser warnings.
Trusted source. Only embed iFrame URLs generated by the Pingtree platform. Do not modify the src URL.
No token exposure. The iFrame does not expose API tokens. Consumer data is fetched securely server-side using the transaction_id.
Content Security Policy (CSP). If your site uses a CSP header, add the Pingtree iFrame domain to your frame-src directive.

Troubleshooting

Issue	Resolution
Offers not loading	Confirm `transaction_id` is present in the parent page URL
Blank iFrame	Check browser console for CORS errors; verify the iFrame `src` URL is correct
`postMessage` not firing	Ensure JavaScript is enabled and the `onload` attribute is not stripped by a CMS
Mixed content warning	Serve both the parent page and iFrame over HTTPS
Offers appear but clicks fail	Do not modify the offer click URLs; they are managed by Pingtree

For further assistance, contact your Pingtree support team or account manager.

API Documentation

Offer Campaign APIs

Database Source

Global Event Postback API

Overview

iFrame Embed Code

How It Works

Requirements

Implementation Steps

Example Results Page URL

Full Integration Example

Technical Details

Security Considerations

Troubleshooting

​Overview

​iFrame Embed Code

​How It Works

​Requirements

​Implementation Steps

​Example Results Page URL

​Full Integration Example

​Technical Details

​Security Considerations

​Troubleshooting

Overview

iFrame Embed Code

How It Works

Requirements

Implementation Steps

Example Results Page URL

Full Integration Example

Technical Details

Security Considerations

Troubleshooting