Crash Course on Framer CMS (Beginner Tutorial)
This Framer CMS tutorial for beginners will teach you the tricks used to build editable portfolios, eCommerce pages, blogs and much more.
🔴 Working File: timgabe.com/resources/cms-for...
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
Пікірлер: 54
Mind blown. The best video on framer CMS...
@TimGabe
9 ай бұрын
wow, that means a lot my friend 🙏
One of the best videos I saw about Framer. Thanks Tim! Covers everything i just needed, haha.
@TimGabe
7 ай бұрын
that's amazing, really glad you liked it 😃
Really well explained Tim! bravo
Been expecting this ❤ thanks a lot Tim. 🙏
@TimGabe
9 ай бұрын
happy you liked it, my friend 💜
Doing the lords work ser
This was super helpful; thank you!!
nice and clean explanation .thanks tim
Awesome tutorial for beginner! It's very very easy to understand. Thank you
Amazing. Best video on Framer CMS and is super easy to follow. Thank you!!!
@TimGabe
5 ай бұрын
that's amazing to hear, thank you!!
I thought I had a good grip on CMS but I never thought about building from a component in this manner! Such a helpful vid, thank you! I've got a good project coming up where I'll be able to put this knowledge to good use 😁
Omg, thank you so much for this video! It's the best Framer CMS video!
@TimGabe
6 ай бұрын
glad you liked it!!
This tutorial is such a god send!
Thanks for this amazing video!
Looove it!!
amazing video thankyou
Excellent tutorial 👌
@TimGabe
9 ай бұрын
thanks a lot, really appreciated the support!
Well this was the only video from your crash course which is confusing for me 😅, maybe i need to re-watch this video to understand that why do we need to setup CMS instead going directly and working with components and variable... Anyways great work bro!! Hats off for giving such an amazing course for free. Just Subscribed to your channel 😄
Good one
Thanks tim😊
@TimGabe
9 ай бұрын
thank you 🤩
Thanks for your videos! Is there any possibility to use CMS for a onepager? Like having the collection list as a menu and each item leading to the scroll section on the same page where the actual item is (but without leading to a different page). I hope my question is understandable^^
Thanks Tim! I've noticed tho that the "option" variable has a maximum of four options. Is there an alternative way if we want the convert variable to work with more than those four options?
@TimGabe
9 ай бұрын
haha!! thank you, friend!
@TimGabe
7 ай бұрын
wow, just realised that this answer should have been to another comment. 😅 i haven't yet got to a case with more than four options, let me dive into that and get back as soon as i know!
Thanks tim, but what if i want each detail page in the cms to look different
@TimGabe
9 ай бұрын
that's a different story! you'll need different collection pages or code overrides for that, i think!
Masterclass Again !! Thx Tim . Course open in 2023 or 2024 ?
@TimGabe
9 ай бұрын
thank you Florian!! i'm aiming to release the course early 2024! 😃
Thanks. Is there a CMS admin panel for clients to CRUD their website? Without having the ability to see or edit any design elements.
@TimGabe
9 ай бұрын
thank you for commenting! 🤩
@TimGabe
7 ай бұрын
this is so weird -- YT is sending responses to the wrong comments. regarding CRUD, i think that framer is working on this!
Great countdown!😂
@TimGabe
9 ай бұрын
haha!
Yes!
@TimGabe
9 ай бұрын
hope it taught you some stuff, nicolo!
Is it possible to do it with pdf files?
When is ur full course comming out
@TimGabe
9 ай бұрын
early 2024, my friend!
please use dark mode in framer it's freaking blinding me with that white UI
@TimGabe
9 ай бұрын
i've just started digging the day mode again 😅
@DartsHell
9 ай бұрын
@@TimGabe hahaha I have gotten so used to dark mode that white UI feels like floodlight on my eyes
1:26
Very complex 😅
@TimGabe
6 ай бұрын
cms is definitely hard in the beginning...
@Zaindkir
Ай бұрын
Very complex tutoriel bro
Why would you create CMS and not duplicate Components each time, seems such a waste of time or I think I am missing something ?
@TimGabe
4 ай бұрын
imagine you have a website with 100s of items, like a blog or even my site with resources duplicating components quickly becomes unmanagable in those cases ☺️
rip webflow