Instructions

Instructions

Before publishing the website

We highly recommend deleting all unused sections and pages, cleaning up unused CSS classes in style manager, and cleaning up unused interactions as well. Don't forget to clone the template before it.

Webflow University lessons:

Style manager

Clean up unused interactions

Sizes of the elements

In this web template, the unit “em” is used for most elements. The reason is better and faster size management and less CSS of the elements on the website. If you want to change an individual element, adjust its "Size". If you want to resize all elements on the entire website with one small adjustment, change the body element size.

Example. For breakpoint size “1920px and up” I want to enlarge everything. I change body element size from the template's default 15px to 16px. Every element on the website will be enlarged.

Some typography has a “vw” (Viewport Width) in mobile breakpoints, a unit based on the viewport's width. The reason is consistent design, so the heading looks the same on different types of devices. When you change the content, don't forget to change the font size to fit the screen properly.

Background color tone

It's pretty easy. The color tone on pages is defined in the CSS style "Page Background" in the "Fixed Background" symbol. You can change the background color for the new page color tone.

Page triggers

You can duplicate a ready-made Blank Page or create a new page and then don't forget to set up page triggers in the interaction panel.

Webflow university

We highly recommend the Webflow University library. Great resources and tutorials for beginners and experts as well.