Articles on: Snapshots

Setup Product Demos

Setting up a plugin/theme sandbox demo can be really painful. A lot of folks try with WP multi-site or struggle setting up demos using in-house bash scripts, resulting in a frustrating experience for both you and your users. Not to mention, you miss out on important usage insights, too.

Well, InstaWP has solved this problem. Our WordPress product authors, like GravityForms and WP Job Manager, are already using our solution for demonstrating their products. And there are hundreds more such examples.

Read this tutorial to figure out how to setup a product demo with InstaWP on your own. In this documentation, we'll be following this navigation:

Create a New Site
Setting up the Product Demo
Save your Site as a Shared Snapshot
Customize Snapshot
URL Parameters
FAQs

How to Setup a Product Demo using InstaWP?

Note: If you are not using InstaWP, sign up with our WordPress sandbox tool using this link.

Step 1 - Create a New Site

Once you are signed in to the InstaWP dashboard, click on the Add New button. Now, you will see a modal/popup on your screen.

To deliver a good product demonstration experience, make sure to change the Server Location as per your target audience's geography. Keep it closest to them.

You can add a site label to identify it with ease, and make other changes, as required. Hit Create Site when you are ready, and InstaWP will auto-install it for you.

Use the Magic Login link and open WordPress site's admin panel.

Step 2 - Setting up the Product Demo

You have your demo site installed. Now, you need to prepare it for your prospects, so think accordingly.

A few things you can do at this stage are:

Install your plugin/theme and its dependencies (e.g., adding essential plugins and modifying essential settings).
Install a theme on your site and set up a landing page for your demo users.
Add some demo content, may be create a sample page.
Add a message on Dashboard on how to use your demo. (You can use a plugin like this or this OR custom code inside the theme files).
Update the fields on ** Settings > General ** page.

Note: We currently support the following tested plugins and themes, which will work. Other plugins and themes can also be integrated, though they are not tested. ⚙️Plugins: WooCommerce, Bricks Builder & Elementor. ⚙️Themes (Customizer Settings): Astra, Hello Elementor, Twenty Twenty-Four, Twenty Twenty-Three, Twenty Twenty-Two, Twenty Twenty-One & Twenty Twenty.

All done? Great. Let's move to the next step.

Step 3 - Save your Site as a Shared Snapshot

A snapshot is a blueprint of an active InstaWP website. It is possible to re-use this snapshot and create more identical sites from it. You need to create a Shared Snapshot for product demos, because you would like to make it public.

When you mark a snapshot as "Shared" snapshot, it is possible for you to share it with a link to anyone around the internet, for them to create an copy of your saved site.

The link will look something like this:

"https://app.instawp.com/launch?t=extendifydemo"

You can share this link to your potential customers, effectively creating a product sandbox / demo for your plugin, theme or SaaS business.

From the Staging page, click Save Template/Snapshot icon adjacent to your site.

Add a name to your snapshot, provide some description, and mark your snapshot as Shared without fail.

Remember, these details will be visible to your users (and search engines) when they land on the demo page. So, keep them precise, crisp, and engaging.

Make sure that your snapshot has a unique name.

You can also mark this snapshot as Instant Snapshot to improve its load speed.

We add your Instant Snapshot to InstaWP's warm-up pool for superfast loading. It will appear with a yellow sign while warming up. Until then, it functions as a regular snapshot, indicated by a grey sign.

Now, Save this snapshot.

To copy the link to this shared snapshot, from the Snapshots page, click on the Copy button (next to your snapshot's name).

This link can be used on your landing pages, in your emails, and everywhere throughout your product promotion campaign.

Step 4 - Customize Snapshot

You can customize the look and feel of your snapshot landing page. From the Snapshots page, scroll down to your shared snapshot, and click on the Edit button.

Now, you will find various options to help you control and customize your product demos more efficiently.

Setup

Modify the name, description, and other essential settings from here. For more infromation, refer to the Edit Setup document.

Branding

This section will let you customize your product demo to suit your brand needs. Logo, email template, privacy policy, custom CSS, and brand colors can be selected here. For more information, refer to the Edit Branding document.

Gallery

Want to add one or more images related to your product on your product demo landing page? Do it here.

Advanced Options

Full explanation of these snapshot options can be found here. However, here are few notable ones:

Site Lifetime - Demo sites will be auto deleted after this.

Extend Site Lifetime - Guest user can extend the site lifetime by clicking on the link via webhook.

Enable Site Cloning - Switch this on, if you want to give access to clone site.

Auto Login to wp-admin - Automatically login to wp-admin panel, instead of showing credentials to users.

Redirect URL - Give a sitename for your the landing page of product demo.

At this point, your Product Demo is all set and you can pass the snapshot link to your users and post it on your website.

The snapshot landing page should look something like this:

And when the user will click on the Launch Demo button, the next screen will be:

Upon clicking Proceed, your prospect will be able to find demo account details and use the Magic Logic link to directly enter the product demo. (If the auto-login is enabled, user will directly see the WordPress admin dashboard.

Next, if you have set a redirect URL (linking to a page in dashboard/frontend), your prospect will reach that page. Otherwise, the WordPress admin panel of this demo setup will open up.

👉 Did we miss anything in this WordPress product demo creation tutorial? Use the live chat option to ask us right now.

URL parameters

InstaWP provides flexible URL parameters to customize the launch of your WordPress site. Here's a breakdown and examples of how to use these URLs.

Components of URL	URL & Parameters	Description
Base URL	`https://app.instawp.io/launch?t=your-snapshot`	Fixed part of the URL that initiates the launch process on InstaWP.
Moving parts (attached to the URL for customization)	`&d=v2`	The parameter specifies the version of the launch process.
	`&redir=/wp-admin/edit.php`	Specifies a redirect path within the WordPress admin area.
	`&post_cmd_var[key1]=value1&post_cmd_var[key2]=value2`	Passes additional key-value pairs that can be processed by the application.

Example 1: Redirecting to a Plugin Page

If your plugin page loads like this - /wp-admin/pluginpage.php, you can set the redir value accordingly.

https://app.instawp.io/launch?t=snapshot-name&d=v2&redir=/wp-admin/pluginpage.php

Example 2: Redirecting to an Order Edit Page in WooCommerce

If your plugin supports values in the URL, such as WooCommerce loading order information with wp-admin/post.php?post=15403&action=edit, you can use the post_cmd_var option.

Key: post
Value: 15403 (order ID)

To direct the user to an order edit page after launching the demo, use:

https://app.instawp.io/launch?t=woodmart&d=v2&redir=/wp-admin/post.php&post_cmd_var[post]=15403

Example 3: Redirecting to a Post Edit Page with Multiple Parameters

If your plugin supports multiple values in the URL, such as a post edit page with additional parameters like wp-admin/post.php?post=12345&action=edit&meta_key=meta_value, you can use the post_cmd_var option to pass multiple key-value pairs.

Key1: post
Value1: 12345 (post ID)
Key2: meta_key
Value2: meta_value

To direct the user to a post-edit page with additional parameters after launching the demo, use:

https://app.instawp.io/launch?t=advanced-snapshot&d=v2&redir=/wp-admin/post.php&post_cmd_var[post]=12345&post_cmd_var[meta_key]=meta_value

Example 4: Redirecting to a Custom Settings Page

If your custom settings page loads like: /wp-admin/options-general.php?page=custom-settings, you can set the redir value accordingly.

URL Example:

https://app.instawp.io/launch?t=custom-snapshot&d=v2&redir=/wp-admin/options-general.php?page=custom-settings

Configure “Reply-To Name” and “Reply-To Email” Fields

In the Snapshot > Email Collection section of our WaaS, the Reply-To Name and Reply-To Email fields allow you to specify the name and email address that appear in confirmation emails, enabling personalized and professional communication with users.

This feature ensures that recipients can easily identify who the email is from and reply directly to the specified email address for further communication. It's especially useful for maintaining a professional email interaction with users.

FAQs

How can I get the emails of users via the shared snapshot?

👉 You can download a CSV or connect to a CRM software using Webhooks. This is available only for paid members.

What are Advance Options?

👉 Advance options allow you to customize the look and feel of the snapshot landing page. This is available in the Professional plan and above.

What is an Instant snapshot?

👉 You may notice that the demo instances are taking 5-60 seconds to create, Instant Snapshot changes that. New instances will be launched, well, instantly!

Is there a limit of how many sites can be created by shared snapshots? And does this limit eat up my “Active Sites” limit?

👉 We have same limit for this, which comes under Active Sites or Staging Sites. When users create sites from your shared snapshot, it does eat up your Active Sites limit.

What if I make changes to the site, can I sync changes to the snapshot?

👉 Yes, you can sync your changes. We have made a simple sync icon under each snapshot, you can also choose to auto sync changes based on a schedule (available in paid plans).

💡 Did you know - Once you've created and customised your template, you can monetize it by sharing it publicly on the internet with anyone and start making money from it. Learn how to monetize a template.

Updated on: 03/07/2025

Was this article helpful?

Thank you!