Blocs 4 Website Course

The ultimate step by step video course covering everything you need to know to plan, design, optimize and publish a beautiful multi-page website in Blocs 4.


The Ultimate Course for Blocs 4

Blocs 4 Website Course is the best video course for Blocs app we have ever created. It includes over 74 quality lessons, 9+ hours of tutorials packed with valuable information, and a premium Blocs 4 template.



74+ Video Lessons

High-quality detailed tutorials available in crispy 4K resolution.


9+ Hours of Material

There are over 450 minutes of value packed video materials.


Premium Template

Great looking premium Blocs 4 template in two variations.



Project Assets

An archive with all project assets used in the course for practice.


Free Updates

If we update the course, you will get all updates for free.


Email Support

If you will have any questions, we are always happy to help.


Blocs 4 Website Course

Download the detailed version


Blocs 4 Website Course Overview

Part 1. Introduction

1-1. Exploring Blocs 4 User Interface
1-2. Project & Page Settings
1-3. Blocs Website Structure
1-4. Visual Web Design Basics
1-5. Classes Basics
1-6. Managing Menus
1-7. Image Editor & SEO Helper
1-8. Next Steps

Part 2. Preparation

2-1. Overview of the Part 2
2-2. Planning a Website Project
2-3. Setting Up a Project
2-4. Creating Pages & Site Structure
2-5. Installing Custom Google Fonts
2-6. Default Typography Settings
2-7. Preparing Images
2-8. Preparing Videos
2-9. Review of the Part 2


Part 3. Design

3-1. Creating a Custom Menu
3-2. Adjusting the Style of Menu
3-3. Setting the Color Scheme
3-4. Optimizing the Mobile Menu
3-5. Completing the Custom Menu
3-6. Creating banners with Responsive Headers
3-7. Responsive Padding
3-8. Applying Gradients to Text
3-9. Bloc Edge Shape Dividers
3-10. Building Responsive Column Grids
3-11. Applying Css Filter Effects
3-12. Class Library Manager
3-13. Custom Button Styles
3-14. Building Website Footer
3-15. Social Links & Footer Optimization
3-16. Writer Mode & Text Editing Options
3-17. Multi-layer Parallax Effect

3-18. Building a Grid of Icons with Text
3-19. Edge to Edge Feature Blocs
3-20. Gradient Background & Wire Button
3-21. Installing 3rd Party Brics
3-22. Creating a Shop Page
3-23. Using Toggle Visibility
3-24. Setting Up a Product Page
3-25. Setting Up a Tabbed Contact Bric
3-26. Adding Content to Tabs
3-27. Using Toggle Class Interaction
3-28. Completing the Product Page
3-29. Setting Up a Gallery Page
3-30. Setting Up a Contact Page
3-31. Adding & Editing the Form
3-32. Embedding Google Maps
3-33. Adjusting the Style of Alert Messages
3-34. Adjusting the β€˜Scroll to Top’ Button


Part 4. Optimization

4-1. Website Design Optimization
4-2. Local Host Preview
4-3. Troubleshooting Links
4-4. Adjusting Page Settings
4-5. Adding Social Cards
4-6. Search Engine Optimization

Part 5. Publishing

5-1. Exporting & Publishing a Website
5-2. Analyzing Website Performance
5-3. Creating and Editing .htaccess File
5-4. Preparing Project Files for Transfer

Blocs 4 Website Course Review

Part 6. Bonus Videos

6-1. DIV Container Bric
6-2. Styling Dropdown Menus
6-3. Class Editor – Flex
6-4. Class Editor – Positioning
6-5. Vertical Menu – Part 1 – Flex & Position
6-6. Vertical Menu – Part 2 – Body Classes
6-7. Continuous Scroll FX
6-8. Class Editor – Filters
6-9. Class Editor – SVG
6-10. Carousel Bric
6-11. Class Editor – Shadows


Introduction to Blocs 4

Start learning the basic features and design workflows in Blocs 4.

βœ“ 8 quality lessons
βœ“ Email Newsletter
βœ“ Standard Support



Blocs 4 Website Course

Everything you need to build a beautiful multi-page website in Blocs 4

βœ“ 74 quality lessons
βœ“ Barista Template
βœ“ Priority Support



Blocs 4 Ultimate Pack

The ultimate combo of Blocs 4 Website Course and Blocs 4 Templates.

βœ“ Blocs 4 Website Course
βœ“ All Blocs 4 Templates
βœ“ Priority Support


 Upgrading from Mastering Blocs 3?

If you have previously purchased the Mastering Blocs 3 tutorials, and you would like to purchase Blocs 4 Website Course, you can save 30%. We sent you an email with details, but if you didn’t get it, you can request a discount coupon below.

Monthly Newsletter

Get latest news and updates to your inbox.

Copyright Β© 2021  Blocs Templates