How to tutorial videos here:

Site Name

if you don't have a logo you can add a label that appears at the top of the page. (if choose this, delete the Site Logo image below it)


Site Logo

You can add a logo for your page


Navigation color

pink / orange / blue / green / purple / light / dark


Navigation animation 

Mobile view navigation animation.

Flip / Move / Zoom 1 / Zoom 2


Footer Area Color

Theme Dark / Theme Light / Theme Color


Block display

single blocks / wrapped blocks 



Styler make your work easier, you can make temporary changes on your website customization settings like background, navigation color, etc. and you can find the best choice for your website look.

You can change the styler settings on the dasboard > cool > settings page the options are: 

On / On (Only for Admins ) / Off 


Site background

custom  - You can add a custom image background for your site.

color - beige / navy / pink / orange / blue / green / purple

image - wood 1 / wood 2 / urban / tape / ambient pink

HTML5 canvas - canvas light pink / canvas light orange / canvas light blue / canvas light green / canvas light purple / canvas pink orange / canvas blue green / canvas purple blue

parallax - parallax night sky / parallax sky / parallax leafs


Social links

You can fill the listed social media sites with your account url (the full url start with http://)

Set the select next to the name to show and it will show on the website.


Site Theme

You can set the colored block's background

Color Pink / Color Orange / Color Blue / Color Green / Color Purple / Color Pink Orange / Color Blue Green / Color Purple Blue / Color Orange Blue


Layout system usage

Before explaining the ‘Layout’ system function, we need to run through some basic concrete5 things.

Every page on your concrete5 website has a Page Type, like "Home", "Left Sidebar" etc. which contain areas that you can fill with blocks. The only thing that differs in Page Types is the Area places. You can use image, html, autonav and many other blocks to fill these areas and you can use "Add layout" function on these areas to divide it to cells and place blocks there.

You can use the "Design" option too, to add style to these areas.

This theme contains 3 Page Types with areas that are editable, these page types are: Layout 1, Layout 2 and Layout 3. 

So If you use Cool theme's Layout System, you don't need to use concrete5 "Add layout" and "Design" function. 

You can define areas, as it's defined in every Page Type's source-code. You don't need any programmer skills, because the ‘Layout’ system offers a visual design interface, so you can create area type schemes and place them in the right order with drag & drop, after that you can easily change the options to these area schemes and save them.


You can create 4 different area scheme, these are:

Slider Area

Main Area

Row Area

Row GlobalArea


Main Area

You can create Main Area which contain an Area called Main and it can contain a sidebar (left or right) too.

You can set these options if you open the scheme and also you can set the color style of these areas. 

Color styles can be Light, Dark and Color.

The Color style depends on Cool theme's Site Theme parameter, which can change at 

Dashboard > Cool > Settings

Row Area

This area scheme used for adding more areas next to each other, You can set 1,2,3 or 4 areas, and you can set these area's color. 

Keep in mind, if you done editing and adding blocks to these areas, if you leave one of them empty, it will not appear, and the other ones what has contents will aligned equally.


Row GlobalArea

This area scheme used for the same thing what Row Area, except, that Global Areas content's will shown on every page what use the Page Type which it has this scheme. It's called Sitewide area.

For example the footer and navigation blocks are in this type of area in every theme, because it need to be shown in every page of your website.

You can set 1,2,3 or 4 areas, and you can set these area's color. 

Slider Area

There's another area scheme what used for adding a slider block custom widget, which is only implemented in this theme.

You can create sliders just like when you adding a block to and area, but here you not do it at the front-end edit mode. First you can create a slider (There's a Slider 1 named slider by default) and after you saved it, and go back to Layouts, at Slider Area scheme's Slider option you can choose one from the Custom widget > Slider blocks what you already saved.

You can find and edit custom widgets under Dashboard > Cool > Custom Widgets page.

After you change an Area scheme options you need to click on the "Save" button inside the area scheme.

If You done editing Layouts settings you can click on the "Save" button at the bottom of the panel to save Layout 1, Layout 2 and Layout 3 settings.

Now you have a Custom Page Type. It good if you need many areas, and it good if you want to use one Page Type for every pages, just leave empty the areas what you don't need on each page and fill those what you want.