Installation

Install Kirby with the Starterkit. Kirby is a lightweight, flexible and file-based CMS made by Bastian Allgeier. For more informations about installation you should look at getkirby.com/docs/installation.
Remove the default /assets, /content and /site folders and replace them with the downloaded ones from VERTICAL.
Once the upload is finished, your website is ready for use.

License

Please remember, that Kirby itself is not for free. If you use this theme for a public release, don't forget to buy a license for Kirby!

Managing site (panel)

The panel is the site management interface to configure your site, add or delete content. Go to panel and fill username and password. For more informations about the panel, have a look at getkirby.com/docs/panel.

Quick formating

1. Setting up your website (name, style, buttons)

In Menu > Site Settings, complete the General settings and customize the Style settings (the general width, colors) and the layout of the menu (visibility, accordion option). The last two sections (Advanced changes, Analytics) can be left empty.

2. Setting up your contents

In Menu > Dashboard, the "Pages" section allows you to create, edit and delete pages. VERTICAL comes with different page templates : Simple page, Portfolios (vertical, slideshow, thumbnails, etc.). When you create a new page, choose a title and select a template (these settings can be modified afterwards). Once the page is created, you can fill it with your custom contents (text, images, etc.). Finally, check the "Visible" option in the sidebar. Now your page is published and its title appears in the menu.

3. Organizing your contents

Pages can be organized in Sections. A "Section" appears as a separate group in the menu. To make a new Section, create a Page in the Panel and set the "Section" template. A section works like a "folder" where you can manage different pages.
To create a new page in a section, first select the section. Then create a page with your custom contents and layout. It is best to define your site structure before starting to create pages and sections.

Advanced Formatting

1. CSS Styles

In Menu > Site Settings, the "Advanced changes" section allows you to enter custom CSS directly :

html {font-size: 110%; }

Each template (page, slideshow, thumbs, vertical, etc.) has a specific class to apply specific styles, for example:

.portfolio-slideshow img {border: 1px solid #000; }