//LEARN_PATH / TRACK

Your learning path

Tick stages off as you finish them. Move at your own pace — the order matters more than the speed. Your progress is saved automatically in this browser.

01–04

Foundations

Pick your tools
  1. 01

    Learn the web first

    PRE

    Counter-intuitive but true: don’t start with our docs. They assume web-dev fundamentals. Spend a few days on HTML & CSS basics first — everything after gets easier.

  2. 02

    Pick your block flavor

    CHOICE

    Decide between GreenShift Blocks (predefined, ready-made designs) and GreenLight Elements (raw HTML-tag equivalents, maximum control). Different philosophies — pick the one that fits how you build.

  3. 03

    Choose a theme route

    CHOICE

    Classic theme or Block (FSE) theme? Each unlocks different workflows. Watch the overview, then commit — mixing routes mid-project costs you time.

  4. 04

    Pick a build workflow

    CHOICE

    Classes, frameworks, no framework, variables — sites can be built many ways. Skim the basic workflows video so you know what tradeoffs you’re signing up for.

05–07

Build basics

Ship your first site
  1. 05

    Master the Stylebook

    CORE

    The Stylebook is where every global style lives. You can ship a site without it — but in 99% of cases you shouldn’t. Learn it once and stop fighting cascade.

  2. 06

    Layout blocks

    CORE

    Every page is built on layout blocks. Consistent section widths and spacing come from here — get this right and the rest of the site stays clean.

  3. 07

    Design panels & productivity

    CORE

    The most-used design panels plus the productivity tips video. This is the muscle-memory layer — the keyboard shortcuts and quick-copy patterns that compound every day.

08–09

Going further

Make it shine
  1. 08

    Motion, panels & interactions

    EXTRA

    Sliding panels, popups, animations and the Interaction Layer system. The toolkit that takes a site from finished to memorable.

  2. 09

    Dynamic data & AI

    EXTRA

    No real site lives without dynamic data — Query Builder, dynamic fields, dynamic placeholders. Then plug in the AI helper for design and block generation.