First of all, go to generator app, drag and drop some blocks from left panel to a central working area
or simply choose number of blocks that you want to have in your project and click "Generate" button -
it will create a page generated from a randomly choosen blocks. This will be a good point to start with.

After at least one block choosen, you can preview your project (click on the "Eye" button)
or export it ("Download" button).

You can delete project using button with "Trash" icon.

If you've got a slow internet connection, some blocks could not be loaded.
In this case, click on "Refresh" button to reload blocks.

Note that if you don't purchased Startup 3 the only free blocks layout will be shown and exported!
Other blocks will be replaced to preview images and cannot be changed or customized!

Use presets

We've made 6 predefined design styles to show you all power of Startup 3 generator. Simply choose some of them in "Apply preset" block and it will drammaticaly change style of all page!

Change Fonts

We use Google Fonts - "Poppins" font family by default. It can be simply changed in "Typography" block of our generator app:

First of all, choose the subset in top-right corner (if you need to use non-latin subset). After that, you can choose your main font ("Body") and font for headings ("Heading"). Also you can choose font-weight of both of them.

Also, you can click on "Random" button and get unique color scheme in one second!

Set animations

You can set on-scroll animations for your project in 2 clicks!

Go to "Animation" block and set toggle in top-right corner to "on" position.
It will enable animations in your project.
After that, you can choose animation speed (0 is a slowest one and 10 is fastest)
and one of three styles: Fade Down, Fade Up, Zoom In.

Paddings

We've extend Bootstrap's pt-4 type classes to make paddings much flexible.
Now value can range from 5px to 1000px (not rem as it used in Bootstrap).
You can still use pX-[0...5] Bootstrap's classes - they're not affect any change.

Sticky Navigation

By default, all navigations are static.
If you want to make your navigation sticky
(it will stick to the top of browser window and always be visible while scrolling the page) -
simply add fixed-top bootstrap's class to your <nav> tag.

Receive data from forms

We included PHP script, that allows you to receive data from any form of your project to your email.
All you need to do is open form-handler.php in the root of your exported archive and set your email:
row 15: $to = "my@email.com";
Also, we recommend to set your "From" email address - it will be better if it will be on the same domain that your website.
row 13: $from_email = "robot@domain.com";

That's it! Now all contacts from forms will be added to the chosen list in MailChimp.

Animations

To simply create beautiful on scroll animations we included in Startup 3 "AOS" library.
It has a lot of effects and settings.

All You need to do is add data-aos="ANIMATION_NAME" to elements that you'd like to animate.
It could be a whole block or only it's title and text.
Also, you can set data-aos-delay="XXX" parameter, where XXX is delay of animation start in milliseconds.
It can be useful to create "cascades" of animations, when you want some elements to animate after another (e.g. two blocks in row).