Webflow Mastery

Purchase

Course curriculum

1. Course Introduction
2. Getting Started
3. html & css
4. The Box Model
1. Webflow Interface Intro
2. The Elements Panel
3. Symbols
4. Navigator
5. Pages
6. CMS
7. Assets
8. Settings & Backups
9. Breakpoints
10. Undo and Redo
11. Code Export
12. Read Only Link
13. Publishing Your Site
14. Style Panel Introduction
15. Spacing, Margin and Padding
16. Sizing
17. Overflow Hidden
18. Position
19. Typography
20. Backgrounds
21. Radius & Borders
22. Effects
23. Settings Panel
24. Style Manager
25. Interaction Panel
1. Dont Use These
2. Div Blocks
3. Sections & Containers
4. Column Layouts
5. Link Block
6. Lists
7. Buttons
8. Headings
9. Paragraphs
10. Text Block
11. Rich Text & Block Quote
12. Images
13. Videos
14. Lottie Animations
15. Forms
16. Site Search
17. Lightbox
18. Slider
19. Navbar and Dropdown
20. Tabs
21. Code Embed
22. Social Media
1. Chrome Extensions Intro
2. Finsweet
3. Flowbase
1. native keyboard shortcuts
2. Flowbase Keyboard Shortcuts
3. PRO TIP: Custom Keyboard Shortcuts
1. Class Naming Intro
2. How To Write Classes
3. Combo Class
4. Global Classes
5. Class Naming For This Course
1. Display Options Intro
2. Block, Inline & Inline block
3. Display None
4. Flex Intro
5. Flex Direction
6. Flex Align and Justify
7. Space Around and Between
8. Stretch and Baseline
9. Flex Wrap
10. Flex Child
11. CSS Grid Intro
12. Using CSS Grid
13. Flex vs Grid
1. Style Guide Essentials
2. Symbol Components
1. Think Like A Developer
2. Creating A Centered Layout
3. Creating A Two Column Layout
4. Multi Column Layouts
1. CSS Units Intro
2. Pixels
3. Percentage
4. EM
5. REM
6. CH
7. VW & VH
1. CMS Introduction
2. CMS Real Estate Example
3. CMS Template Page
4. CMS Sort and Filter
5. Reference Fields
6. Conditional Visibility
7. CMS Roundup
1. Default Interactions
2. Animate On Hover
3. Animate On Click
4. Mouse Move Over Element
5. Scroll Into View
6. While Scrolling In View
7. Component Animations
1. calendly
2. zapier
3. Mailchimp Popups
1. Introduction
2. Style Guide
3. Importing fonts
4. Importing Assets
5. Main Navigation
6. Mobile Navigation
7. Navigation Tweaks
8. Home Hero
9. Stats
10. Services
11. Entering CMS Data
12. Our work
13. Testimonials
14. CTA
15. Footer
16. Homepage Tweaks
17. Mobile Responsive
18. Creating Symbols
19. Portfolio Page
20. Portfolio Page Mobile Responsive
21. CMS Template
22. Contact Us Page
23. Navigation Links
24. Final Tweaks
1. Inspecting The Design
2. Style Guide
3. Creating The Style Guide
4. Desktop Navigation
5. Home Hero Section
6. Home Take Action
7. Home What We Do
8. Did You Know Section
9. Slider Section
10. Events section
11. CTA
12. Footer Section
13. Home Tweaks
14. Creating Symbols
15. Homepage Responsive
16. About Hero Section
17. About What We Do Section
18. About Team Section
19. About Impact
20. About Blog Section
21. Blog CMS Collection
22. About Blog Section 2
23. About CTA and Footer
24. About Responsive
25. News and Events Hero
26. News & Events Blog & Footer
27. News And Events Responsive
28. Blog Page Template
29. Blog Page Template Responsive
30. Contact Page
31. Contact Page Responsive
32. Main Nav Links Order
33. Mobile Nav
34. Final Checks
35. Meta Data
36. Meta Data Collections
37. Alt Tags
38. Going Live
1. Editor Introduction
2. Editing The Front End
3. Editing Collections
4. Client Considerations
1. Finding Clients Introduction
2. Your Local Network
3. Marketplaces
4. social media
5. SEO
6. Google Ads
7. Become A Webflow Expert
1. Bye for now :)

About this course

$275.00
179 lessons
15.5 hours of video content

Webflow Mastery

Course curriculum

Introduction

The Interface

Webflow Elements

Chrome Extensions

Keyboard Shortcuts

Class Naming

Display Options

Style Guide & Homemade Components

Building Common Layouts

CSS Units

CMS

Interactions & Animations

Custom Code/Integrations

Project 1: Portfolio Website Build

Project 2: Charity Blog Website Build (8 Page website)

The Editor

Finding Clients

You've reached the end! At least, for now!

About this course