CMS

Framer Update: CSV Import

Hunter

2:37

9.1K views

Mar 15, 2023

About this lesson

New in the CMS this week, CSV Import. Bring content from any source and make it come alive in a Framer site. Learn more in the support article: https://www.framer.com/learn/cms-import/

🌞 Try Framer for free: https://framer.com

🎉 Follow on Twitter: https://twitter.com/framer

💎 Join Community: https://www.framer.community

https://www.youtube.com/watch?v=H5GS5a5p_RQ&t=0s Introduction

https://www.youtube.com/watch?v=H5GS5a5p_RQ&t=25s File Setup

https://www.youtube.com/watch?v=H5GS5a5p_RQ&t=60s Importing

https://www.youtube.com/watch?v=H5GS5a5p_RQ&t=85s Adding Fields

https://www.youtube.com/watch?v=H5GS5a5p_RQ&t=96s Re-Importing

https://www.youtube.com/watch?v=H5GS5a5p_RQ&t=118s Wrapping Up

0:00hey yo it's Hunter 0:01in this video I will show you the latest 0:03addition to the Frameworks events CSV 0:06import we will take a CSV file make sure 0:10it's all set up correctly and import it 0:12into the CMS of your favorite project 0:13it's super easy so let's get started 0:17if we go to the CMS for our project 0:18you'll see there's new import action in 0:21the toolbar 0:22if we click that we'll see all the 0:24important information that we need the 0:25most important thing here is to make 0:27sure our CSV file is set up correctly 0:29and our collection is set up to match it 0:32this means that each field from our CSV 0:34file that we want to import in a framer 0:37it needs to have a matching field with 0:39the exact same name in our framer CMS 0:41with the matching type for instance in 0:44your CSV file if you have a field such 0:46as blog content that should match up 0:48with a field of the same name in your 0:50CMS collection of type formatted text 0:53and for something like a date that would 0:55use the date type making all these 0:57things match will ensure that your 0:58import goes smoothly 1:00let's import a colors.csv file without 1:03setting anything up 1:06we'll just select the CSV file from our 1:08computer upload it 1:12you'll see it looks pretty good but if 1:14we click on any of these CMS collection 1:15items we'll see that all the fields are 1:18there except for the color itself 1:20this is because we did not set up the 1:22field in our CMS before we imported if 1:25we go to edit the fields of our CMS 1:26collection we just need to add another 1:28field of type color 1:30from there we'll name it color to 1:32exactly match the name of the field in 1:34the CSV file 1:36then to update all our content we just 1:38need to re-import the exact same file 1:41this will give us the option to either 1:43skip or update each matching entry that 1:46already exists in our collection 1:48in this case I'll do update and apply to 1:50all 1:52now if we check each item in our 1:54collection 1:55we'll see that they have the color 1:56property 1:58let's hop back to the canvas and finish 2:00up our site 2:04let's assign our new color field to the 2:06layer on the canvas 2:10nice there we go we have a list of 2:13colors all rendering on the canvas 2:15all imported from content in a CSV file 2:17we hope you'll use this feature to bring 2:19content from anywhere 2:21and bring it to life with a framer side 2:24foreign

TeachesCollections CMS Fields

Watch on YouTube ↗

‹ Framer Update: Light & Dark Mode

Create an animating shimmer effect like the Linear app website without any code ›