Constro User Guide

1.) First go to developers tab and right click on Created Packages menu.

2.) Select create and enter name of your package and click on create.

3.) Enter the package details as per requirements in Package Properties tab.

4.) Now select the package contents one by one as per the requirement in Package Content tab.

5.) Now select installer file and bin files from respected folders in Package Files tab.

6.) Enter any specific details related to package in Package Actions tab.

Umbraco is one of the most popular CMS in the world that makes it the best choice for your website.

You can download and install the Umbraco from their official website

For more information on Umbraco, please, visit the Umbraco page.

Theme Requirements:
Please check the recommended umbraco version for proper functioning of kit:
– Umbraco v7.5.4
Make sure your server is set up properly so the kit and content will be loaded correctly.

Package Requirements:

Please install following packages first:

- LeBlender
- Nested Content
- Umbraco Forms (Trial Version)
- uSky Slider
- Smart Blog
- Spectrum Color Picker

1. Package install steps:
   • 1. After logging in to your umbraco backend go to Developers tab.
   • 2. Click on Packages on left side navigation.
   • 3. Now click on Install Local option on top right corner.
   • 4. Drag or upload your prefered layout package file given in drag area.
   • 5. Now accept the license and let the package install.
   • 6. After package get installed you can see it in installed tab.
2. You're now good to go..! Start adding your Content and show off your Brand New Beautiful Website in style.

1. Right Click on Content and select Create from the drop down.

2. Then select Site Master from sub drop down.

3. Enter your desire name for page and enter all the details required for page and click on Save and Publish button at bottom of page.

1. Right Click on Parent Page and select Create from the drop down.

2. Then select Child Page from sub drop down.

3. Enter your desire name for page. Then click on Save and Publish button at bottom of page.

1. To take advantage of bootstrap we have created few grid options. There are 11 pre made grid options. Select any one option from the list.

1. As we have added the row now we will add shortcode/content. Click on add content and select your desire shortcode from the list.

1. Right click on your page and select Delete from the drop down. Then click on ok button to delete the page.

1. Right click on your page and select Delete from the drop down. Then click on ok button to delete the page.

1. Select the row. It will be highlighted in blue color. Then click on delete icon on top right corner of row.

1. Select the content you want to delete. It will be highlighted in blue color. Then click on delete icon on top right corner of row.

<section class="... page-section-ptb">

           [YOUR CONTENT]

</section>

<div class="text-white">  
[YOUR TEXT CONTENT]
</div>

<div class="bg-overlay-black-10">
  [YOUR CONTENT]
</div>

The basic concept of a Retina image is that an image twice the size of a standard web image will be displayed on screen. On a non-retina device an image will be 100px X 100px whereas a Retina device will display the same image but at 200px X 200px. Most of devices use this branded concept for Retina devices like having approximately twice the pixel density of a non-retina device.

If you want to get perfect looking images on Retina screens. If for example you build website where you upload regular images into Content, you must always upload 2 images in Media
Add new section which looks like below:

my_image.png - this is the name for standard image (e.g. 100px X 100px)
my_image@2x.png - this is the example name for retina image and file must be always 2x larger than regular image (e.g. 200px X 200px)

Note You need to include retina.js to make your website completely retina ready. See example below:

<!-- retina --> 
<script type="text/javascript" src="js/retina.js"></script>

For more information about retina documentation and to download retina.js Click here.