Today we’ll show you step by step how that is done!
For the quick learners, here’s the quick guide:
- get the product ID of the item you are selling
- create an “add to cart” link with the product ID: https://yourwebsite.com/cart/?add-to-cart=374
- Add a popup window to your virtual tour
- Add some product details
- Add the button and link it with the new link you created.
What you need:
1. An online shop In this tutorial we will use a wordpress website that uses Woocommerce as their shop engine. But you can use any link you like on your button. 2. A virtual tour of your shop created in My360Here's the full video:
Some helpful links:
Get a GIF image for your CTA button: https://giphy.com/
Find some cool “add to cart” buttons: click here for google search
Here's the full tutorial with pictures and more detail:
First we have to create the “add to cart” button.
Create an “add to cart” button for your virtual tour
- go to your woocommerce admin area and click on “products”
- Hover over your product to find the product ID
- Create your “add to cart” link
Create the link for your shop item like so:
https://yourwebsite.com/cart/?add-to-cart=374
You need to change the website url and the product ID accordingly.
Now we have the “add to cart” link, we have to add it to the virtual tour
Adding the "add to cart" button in your virtual tour
In the virtual tour editor, drag the blue ball to your image and select the “i” icon
Remove the default camera image and click on the “image” icon to add your own image (we are using a blue pulsating GIF image, but you can use any image you like)
Resize your image so it is the right size for you (I recommend an icon of around 30 to 50px)
Don’t worry about the default text – that does not show.
Select “opens in popup” to configure the “popup” screen
Complete the popup content with text and images.
Click on the “image” icon to upload an “add to cart” button.
You can find lots of “add to cart” buttons in Google Image search
I recommend the images to be approx 300px wide
Once you added your “add to cart burron” in your virtual tour, you have to link it to the link you created earlier.
So go ahead and click on the button and then select the “link” icon.
Put your link in the link field and click on “ok”
Make sure you “save” your project and then click on “publish” tour to see the results.
If you followed the steps correctly, you will now have a popup button with an “add to cart” button in your virtual tour that leads straight to the check-out area of your website!
