This Framer CMS tutorial for beginners will teach you the tricks used to build editable portfolios, eCommerce pages, blogs and much more.
Working File:
Timecodes
0:00 - Introduction to Framer CMS
0:19 - Designing Content for CMS
0:37 - Components of a Card
1:02 - Adding Hover State to Card
1:56 - Placeholder Image & Video
2:20 - Hover State Conditionality (Preview)
2:34 - Three Ways to Create CMS
3:10 - Using CMS Collection
3:51 - Editing CMS Fields
4:56 - Adding CMS Fields: URL, Link, Image
5:47 - Additional CMS Fields: Toggle, Options
6:55 - File Type Constraints in CMS
7:03 - Adding CMS Items
7:17 - Linking CMS to Design
9:36 - Finalizing Home Page & Detail Page
9:59 - Starting to Drag Resources into Home Page
10:06 - Adjusting Resource Placement
10:14 - Using Default Template
10:23 - Importing Card Component
10:31 - Switching to Grid Layout
10:48 - Identifying Static Content Issue
11:00 - Editing Card Component
11:16 - Setting up Variables
11:28 - Adding Image and Title Variables
11:38 - Adding Resource and Software Options
11:58 - Setting Visibility for Icons
12:27 - Linking Title to Variables
13:00 - Adding Resource Type Options
13:55 - Configuring Video Variable
14:04 - Setting up Image Variable
14:17 - Configuring Link Variable
14:35 - Connecting Component to CMS
15:23 - Setting up Resource URL Linking
15:36 - Checking Hover State and Content
15:52 - Addressing Issue of Unwanted Play Icon
16:01 - Editing Default Video Setting
16:37 - Re-linking Video to CMS
17:09 - Configuring Play Icon Visibility
17:36 - Testing Conditional Logic
17:55 - Fixing Hover State Issue
18:20 - Closing Remarks and Further Resources
Watch video Crash Course on Framer CMS (Beginner Tutorial) online without registration, duration 18 minute 32 second in high hd quality. This video was added by user Tim Gabe 14 September 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 27 thousand once and liked it 752 people.