Easy Product Tour

The Easy Product Tour allows users to learn more about your business or product by clicking through a series of slides about the product. The final slide of the tour features a form that users can complete in order to gain access to an asset. A CTA located in the upper right corner navigates users the fourth slide of the tour where they will be encouraged to complete a form.

This Product Tour is part of our “Easy” quick starts which are designed to go from ideation to launch in just 1 hour and with minimal to no training. You can create your experience (and take it live) inside of a campaign, which is a folder located in a portfolio.

What you’ll need for the Easy Product Tour:

• Copy for headline and subheadline that describes the experience.
• Copy for three slides including a header and paragraph that describes your product.
• Four images for each of the slides. For best use, select imagery that matches the size of the images used in the Quick Start. Those sizes are:
  • Slide One - 1024 x 690 px
  • Slide Two - 1024 x 658 px
  • Slide Three - 1024 x 682 px
  • Slide Four - 811 x 682 px
• Copy for a Thank You page
• Iconography for Thank You page to encourage users to download your asset. Icon should match sizing of existing icon: 100 x 89 px. 

1st step: If you don’t have a portfolio and campaign yet… create them first (:30 seconds)

When you first log in to the ion platform, you will more than likely find yourself at the dashboard page. From the dashboard, click on “portfolio” in the navigation and select the green plus sign found next to “your portfolio” and type the name of your portfolio! A “Portfolio” is a great way to keep your content organized and easy to locate in the future. For example, if you plan to run multiple campaigns promoting this Product Tour (paid search, email, social) the portfolio can house all of those campaigns.

Once you have saved and named your portfolio, you can now add a campaign by clicking the green plus sign. Create a name for your campaign folder and then add your corporate website in the “Fallback URL” field which is where traffic will be re-routed to should this campaign ever go offline).

2nd step: Download the Easy Product Tour from the quick start cloud (:30 seconds)

Within your campaign, click the green plus sign to add a new creative.

Place the internal name of your Product Tour in the label field. It is important to note that this label will not be visible to your users, so you can select a name that will be used internally.

This section will default to the Quick Starts tab. The top drop down labeled “Quick Start Cloud” should remain untouched. The second drop down showcases all of the Quick Start categories. For the Easy Product Tour you will want to select the “Easy Quick Starts”. Click on the Easy Product Tour thumbnail.

Important tip: Before you save this creative from the cloud, it may be beneficial to “preview” the functionality. When you preview an experience you are able to see what it looks like, how it functions and how the content is arranged. Sometimes when you are in the creative editor, things may look differently than they do in the final product (this is because the pages are responsive, and the layout is impacted by the size of the screen).

Once you select the Easy Product Tour hit save to begin!

When you hit save, just note that it may take a few seconds to download the quick start into your console. Once the Product Tour has downloaded you will find yourself on the Creative Management tab of the Product Tour.  

3rd step: Apply your brand theme to the Product Tour pages (:10 seconds)

On the creative management page of your Product Tour located within the right side panel, you will see a drop down that is labeled “theme”. From that drop down select your brand theme. A theme includes all of your branding requirements such as logo, colors, fonts, etc. This step must happen before you can take the Product Tour live and it’s a best practice to do this step before you begin adding your content.

Don’t see your company’s brand theme in the drop down?
If you are not yet an ion customer and are in a demo or sandbox account, you won’t see your brand’s theme. You can however, select the Spokes theme to demo the experience.

If you are a customer, are in your company’s ion console and you still don’t see your theme, contact your ion customer success manager. More than likely, you’re a brand new customer and we are in the process of adding your theme to your console.

4th step: Let’s add your content! (20-50 minutes)

• Begin by selecting the “Landing” thumbnail image to access creative studio and begin adding your copy.

• Once you access the “Landing” page of the Easy Product Tour, click on the “Product Tour Title Here” content block. Once it is highlighted with a blue line, click it again to access the text editor box to replace our sample copy with your own headline copy. Below that headline is descriptive copy that explains the Product Tour to the user. Update the subheadline with descriptive copy about the Product Tour.
• Each of the slides contain an image paired with copy that provides an opportunity to highlight key features or information about your product or service. 
• Click on the “Step One Title Here” content block to replace the sample copy with your own. Beneath the title is a descriptive paragraph that can include a simple explanation of what your product is. Click on the sample copy until it is highlighted blue to add your own. To update the image to the right of your copy, click on it until it is highlighted blue. Once it is highlighted a window will open. Locate the “reselect image” option at the top of the screen to access the upload panel. From this screen, you can add your own images to the creative. For best use, your image should match the measurements of ours: 1024 x 690 px.
• Once you complete the first slide, click on the title for the second slide to update the sample copy with your own. The second slide gives you four bullet points to showcase important facts or information about your product. Update these bullet points with your own copy by clicking on the text box until it is blue. The imagery found to the right of the copy can be updated with your own image. For best use, the imagery should match the measurement of the existing one: 1024 x 658 px.
• Following the same steps as the first two slides, click on the slide title in order to replace the sample copy with your own. The paragraph located below the slide title can be updated with your own copy as well. Click on the imagery located to the right of the copy, to update it with your own. For best use, use an image that matches the measurements of the existing one: 1024 x 682 px.
• The fourth slide of the experience can be leveraged to encourage users to download a simple form in order to gain access to an asset. Update the imagery on the left side of the slide to an image that reflects your message. For best use, your image should match the measurements of the sample image found within our experience: 811 x 682 px. The form title can be updated by clicking on the copy “Form Title Here” to access the text box. Beneath the form title you can provide the user with a brief description of what they will gain from completing the form.
• Locate the CTA button within the header. The CTA navigates users to the form located on the fourth slide of the experience. Click on the button to update the “CTA Button” verbiage with your own copy. 
• In the footer section of the experience you will see “Your Company”. Click on this content to add your company name to the footer. 

Expert-level tip: You can have both of these updates automatically published on the other page of your Product Tour. To automatically have this applied to the other page of your Product Tour, you must first ensure that the content has been updated correctly. Once you are satisfied with the content and links click on the content and determine that what you want to update is highlighted in blue, locate the “Save” option found beneath the the edit tab of the creative studio panel, and select “creative wide”. Once you select “creative wide” a window will pop up with the pages located within this experience. You have the option to only update the pages you wish to or to select “all” to publish this to the Product Tour page. From this menu you can select “all” and then hit “ok”. Only do this once you are comfortable working in the ion platform. This isn’t a necessary step, and can be done on a page by page basis.

• On the right side of Creative Studio, click the “Thank You” thumbnail to access the “Thank You” page. Update both the headline and subheadline with your own verbiage by clicking each of them until they’re highlighted blue. Users are able to revisit the Product Tour by clicking on the “Back to Tour” link. If you wish to update the verbiage of this link, click it until it is highlighted blue to open the text editor.
• Users will be encouraged to download an asset from the “Thank You” page. Update the PDF icon located in the blue box by clicking on it until it is blue. For best use, select an icon that matches the measurement for the one used in the Quick Start, 100 x 89 px. 
• To the right of the icon, click on the “Title of Asset Here” content block to update the text with your assets title. Below the title, place a short description of the asset in the content block provided. Click on the “Download Now” button to update the link to your asset. Once you click on it you will notice on the right side of the screen below the “Edit” menu under “Actions” there is a link to our website. Click on that link to update the link. If you wish to change the verbiage on the button, click on it twice to open the text editor. 
• You are finished! Use the breadcrumb navigation at the top of creative studio to navigate back to the creative management screen for this creative. Click the name of your creative to do so. Click the preview button in the upper right area of the screen to preview your Product Tour and view it as your visitors will.
• Along the top of your preview screen you can also simulate various screen sizes to see how the responsive design will appear in different viewports. As you preview, if you see things you want to change, return to the creative management screen, click on a thumbnail of a page and go back into the creative studio to make your edits.
• As soon as you are satisfied with your experience preview, you are ready to take your experience live!

5th step: Let’s launch your Product Tour! (<5 minutes)

1. From the creative management screen, in the “Status” area, click “Engaged”. This indicates you are ready to take it live. 
2. Then, in the “Traffic sources” area, click “+traffic source” to create a URL, which you will use to drive traffic to your Product Tour.
3. On the add traffic source screen, select your sub domain from the traffic source URL drop down. This is the URL your visitors will see when they land on your Product Tour. You can use our default “postclickmarketing.com” domain, or select your company’s subdomain if one has been set up. Don’t see your company’s subdomain in the drop down? If you are not yet a customer or are in a demo or sandbox account you will not see your brand’s domain. However, you can select the postclickmarketing domain for demo purposes. If you are a customer, and are in your company’s ion console and still don’t see your subdomain, it means your company hasn’t yet pointed a subdomain to your ion console. Contact your ion customer success manager to have this set up.
4. It is important to note that your traffic source will be visible to your users. For example, if you add “MyAmazingProduct” in the path field and select postclickmarketing.com as your domain drop down, your URL will be http://companyname.postclickmarketing.com/MyAmazingProduct. Just for tracking purposes select the type of traffic you are driving, and the sub category. For example, Search Engine as the category, and Google as the sub category.
5. Locate your Product Tour thumbnail below and click save. Congratulations! Your Product Tour is launched and live!
6. Along the top of your traffic source management screen you will see the Product Tour URL and you can click the copy button to copy your URL. Drive traffic to that URL to promote your Product Tour. 

Tip: If you are embedding your Product Tour into another web page, such as a page on your website, it will work just the same as embedding a YouTube video on a page. Click the “Embed code” button next to your URL and copy the code from the pop up window. Paste that code into your external web page.

Optional step: Download the data collected from your Product Tour and lead form

You can download a .csv file of your Product Tour and lead data at any time! From your campaign screen, locate the Campaign Resources area in the upper right section of the page, click “Export Respondents”. On the export page, enter a date range to see Product Tour data from all visitors. Hit the export button and download your file (this file may take a moment to generate).

If you haven’t been trained by an ion trainer, here are some important tips for your success:

Easy Quick Starts are meant to be used exactly as they have been built.

We don’t recommend adding/removing pages, adding/removing sections of content, adding/removing questions & page elements, or moving elements of the pages. If you need to do that, we recommend a training session, or training series, with an ion customer success trainer.