Data Automation for catalogs is a great feature that we implemented to help our customers save time by automating the boring parts of processes that imply a repetitive copy and paste task.
But when designing catalogs with a lot of interactive elements in them, it can get quite stressful. You can already automate the process of adding product tags in your catalogs, so in this article, I will show you how Automation works for Popup frames and Videos.
If you’re already adding these interactive features in your flipbooks and would like to simplify your process, please do yourself a favor and keep on reading.
Note: You need to be an Enterprise or Organization plan user to use Automation.
How to set up your CSV file
In order to use Automation, you need to have a CSV or an XLSX file, with the data you want to automate.
It’s very important to include a code for the Popup frame and a link for the Video. You can have both, or just for one, depending on what you want to add.
Note: Read this article to find out how to prepare your spreadsheet for automation of product catalogs.
You now have to set up your CSV file and make sure it contains all the necessary information that will later be displayed on the Popup frame and the Video button and widget. Let me give you an example. I’ve added an iframe code of a Google map and Youtube links to some of my favorite videos. Please add these types of information as column headers in your CSV file. See below.
If you have 2 separate CSV files, one for Popup frame and one for Video, you can easily switch between them in the Design Studio.
Import your CSV file
Firstly you have to log in to Flipsnack, go to “My Flipbook”, and click on “Automation”.
Here you’ll import your data files by clicking on “Add a new data set”.
When you upload your CSV or connect your Google spreadsheet, you’ll see that you can choose some Elements that will determine how your list will look like in the Automation tab in Design Studio. You’ll also find Attributes from your list that you need to connect with the information from your CSV file. This is how you make the connection between them.
After you’re done with these details, click on Next Step and then Start now.
Now you’re in Flipsnack's Design Studio.
Use Automation for Popup frame
First, go to Automation and you’ll see that your files were imported into our Design Studio. And select the CSV file you want to use. If you’ve uploaded more, then pay attention to select only the one you wish to use.
By default, it will select the first one you uploaded.
Now, head over to the Link tab and drag and drop the Popup frame.
Simply drag and drop it wherever you want on your page.
Select the Popup frame, go to Automation, and click on Connect with feed.
Note: You need to know that the Popup frame lets you display various types of content in a popup window that opens on top of the publication’s page.
Now, let’s make the connection between the two.
Tip: After you mapped your element with the Popup frame, you can simply copy and paste it to other pages too.
From here on, the process is easy. Simply drag and drop the link into the Popup frame icon.
How to know if it worked? Click Preview and click on the Popup frame element on your page.
Use Automation for Video
Let’s do the same for Video, now. You need to have in your files URLs directing to desired videos, from Youtube or Vimeo or videos hosted under your own URL.
The difference between them is the following:
The Video button will open as a popup
The Video widget will be displayed and showed in the page
Now, let’s see how to use Automation for both video options. It’s really similar to what we’ve already done.
First, go to Automation and you’ll see that your CSV files were imported into Design Studio. Select the CSV file you want to use. If you’ve uploaded more, then pay attention to select only the one you wish to use.
By default, it will select the first one you uploaded. So make sure you use the right one.
Now, head over to the Video tab and drag and drop the Video button and the Video widget.
Drag and drop them wherever you want on your page.
Select the Video and Video widget, go to Automation, and click on "Connect with feed".
Simply make the connections between them in the opened tab. Then just click on the link element you want to be put on the Video button and the link element you want to appear on the Video widget.
Tip: After you mapped your element with the Video button or Video widget, you can simply copy and paste it on other pages too.
And now check the Preview to make sure everything works.
If you have more elements that you want to automate, you just need to select all of them and go again to Connect with feed. You’ll see that you can easily make all the connections between them with just two clicks.
We hope this article was helpful and if you have more questions related to Automation
please ask us via live chat.