Hello. I’m new to e-commerce and love Funnelish. Ive set up my first funnel and have seen the proofy functionality in a Funnel belonging to someone else.
As my store is new, is there a way I can get Proofy to pop up with some sample data instead of waiting for someone to purchase an item? It will take me a while to scale to the numbers I’m seeing on a different e-commerce store.
Hi @nav007x,
Welcome to the world of e-commerce and Funnelish! 
Proofy is an amazing tool to boost trust and conversions, and yes, it is possible to display sample data while your store is still scaling. However, this feature isn’t available out of the box.
To achieve this, you’ll need to use some custom code to work with sample data. You can create a script that generates and sends fake purchase events or mimicking real activity. This way, visitors will see the pop-ups even before your store has significant sales volume.
Use the following code:
(function () {
const sampleData = [
{
name: "John D.",
location: "New York",
product: "Wireless Earbuds",
mapImage: "https://img.funnelish.com/proofy/whakatane/OkxPSOiQXetOsxAiERuwVAUnGBpzBYBsdkrpHrkn" // Replace with your map image URL
},
{
name: "Emma R.",
location: "London",
product: "Smartphone Case",
mapImage: "https://img.funnelish.com/proofy/whakatane/OkxPSOiQXetOsxAiERuwVAUnGBpzBYBsdkrpHrkn"
},
{
name: "Liam P.",
location: "Toronto",
product: "Bluetooth Speaker",
mapImage: "https://img.funnelish.com/proofy/whakatane/OkxPSOiQXetOsxAiERuwVAUnGBpzBYBsdkrpHrkn"
},
{
name: "Sophia G.",
location: "Sydney",
product: "Fitness Tracker",
mapImage: "https://img.funnelish.com/proofy/whakatane/OkxPSOiQXetOsxAiERuwVAUnGBpzBYBsdkrpHrkn"
},
];
// Function to display a Proofy popup with animations
function showProofyPopup(data) {
const popup = document.createElement('div');
popup.className = 'proofy-popup';
popup.style.cssText = `
position: fixed;
bottom: 10%;
left: -400px; /* Start off-screen */
display: flex;
align-items: center;
max-width: 350px;
background: #ffffff;
padding: 10px 15px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
border-radius: 35px;
font-family: Arial, sans-serif;
font-size: 16px;
z-index: 9999;
transition: all 0.5s ease-in-out; /* For sliding effect */
`;
popup.innerHTML = `
<div style="flex-shrink: 0; margin-right: 10px;">
<img src="${data.mapImage}" alt="Map of ${data.location}"
style="width: 50px; height: 50px; border-radius: 50%; object-fit: cover;">
</div>
<div>
<strong>${data.name}</strong> from <em>${data.location}</em> just purchased <strong>${data.product}</strong>! 🎉
</div>
`;
document.body.appendChild(popup);
// Slide-in effect
setTimeout(() => {
popup.style.left = '10%'; // Slide into view
}, 100);
// Slide-out and remove after 5 seconds
setTimeout(() => {
popup.style.left = '-400px'; // Slide out of view
setTimeout(() => popup.remove(), 500); // Remove after slide-out
}, 5000);
}
// Function to cycle through sample data
function simulateProofy() {
let index = 0;
setInterval(() => {
if (index >= sampleData.length) index = 0;
showProofyPopup(sampleData[index]);
index++;
}, 7000); // Adjust interval time as needed
}
// Start simulation
simulateProofy();
})();
Good luck with your funnel, and let me know if you have more questions!
Best,
Anwer
@anwerashif Can you please help take a look at our Custom Code for Proofy? We can’t get it to display.