Note - If you don't know VC Plugin, look first this detailed guide here -> VC Guide
Note - If you want create a layout full with, you can first set the Template -> Visual Composer Page in your page.
You can use the VC elements in a standard page or standard post too but it will add the elements in the content box.
By follow, ther's a list of all VC Incanto's elements and some VC elements edited and improved for this theme.
Row
Use 'Row' element to put inside anything other vc elements: columns, rich text, html text, and all other addons vc.
Row Settings -> General - > Background Source - you can select the source for your background: parallax image, design options ( default VC ) or Video background.
If you have selected the parallax source, upload the image background in the area below.
If you have selected the video source, paste the YouTube id in the area below, you can set also the start second, the loop and image background by default.
If you have selected the design options ( from Row Setting -> Design Options ) you can upload an image or add a static color as background and much more..
Text Color - Set the color for the text inside row. You can select between light or dark ( white or black ).
Overlay Effect - Set the background overlay on your row. You can select between dark gradient, white gradient or film overlay.
OnePage Menu - Compile this label if you want to link row to an onepage menu button.
Note - if you have added a label to link the menu at this row, you must active first the onepage mode in bottom of your page ( chek it and turn on ).
Row Settings -> Design Options - You can set the css box ( margin, padding, border ), background color or image ( only for design option source ).
Check the Full Height if you want create a background full screen.
Check the Boxed Container if you want create a row boxed ( bootstrap based - width 1200px ).
Columns
You can set the alignment of text inside: auto, left, right, center, justify.
For all other options consult the VC official guide here.
Text Block
You can add a title above your text already formatted, a button label below the text and the button url.
For all other options consult the VC official guide here.
Progress bar
You can set the value and label for each bar and the color background of the lines.
The sintax for each bar is value ( integer ) | label ( chars ), (example: 90 | Design ). Note - You must write only one per row.
You can add stripes and animation ( visible only with striped bar ).
Hero Head
This element adds an heading in your section. Note - Include it always in a row.
You can set multiple titles one under other, you can set the text, the sizing ( between 6 size ) and add a margin bottom for each title.
Note - if you want create a full section with background within titles, remember you to adjust the padding top and bottom in the row setting -> 'design options'.
Hero Head Rotator
This element adds a slider headings in your sections.
You can set up to 3 slides text. For each slide you can set a surtitle a title and subtitle.
If you want show titles in rotator mode, you must change the text between the slides. In other hand they will rest static.
Slider
Note - Before including this element in your layout, you must create a slider through the post type Sliders on the left wp bar.
Go to Sliders -> add New and create your slider.
Add a title and upload your images. You can upload multiple images ( your slides ).
For each image you can add a type of overlay ( between 7 types ), add a title and subtitle and set an animation between all CSS3 Transitions.
After creating your slider, return in your page, and open the slider element through the Visual Composer, at this point you can select your slider.
You can decide if you want a standard slider ( no titles ) or hero slider ( with titles ).
Section head
This element adds a special heading in your section.
You can set a title and subtitle, or only one.
Use this element like heading sections, e.g. first to write an about text, or list of features.
Separator
This element adds a simple thin line. Use this one to separate sections.
Include it always in a row.
To add padding on this element, include it in a row and edit the box model of the row.
To set the line full width, uncheck the full with option in the design option of the row.
Service
This element adds a paragraph of text with icon.
Use this to create a service box. Include it always in a column, so create your row and then divide it in two or more columns.
You can add a title already formatted and a text description.
You can add an icon and placed it on top or on the left of the text.
Image
Use this element to put an image in your content page or portfolio page.
Upload the image from media upload and then compile your title and subtitle to create a caption for this image ( optional ).
You can set the caption color ( dark or light ).
To set the size click on tab - > design options and set the size. Check the image crop too if you want to crop the image on based your size.
Testimonials
Use this element to create your testimonials slider section.
You can add multiple blockquote and set a text and author for each ones.
You can active the autoplay too.
If you want create a blockquote slider with background, include the testimonials element inside a row, then apply a background image color or parallax in the design section of the row.
Clients
Use this element to create a carousel of logos.
You can add multiple logo and add an url for each ones.
Use the media upload to put your logo inside.
If you want to create a clients carousel with background, include the client element inside a row, then apply a background image color or parallax in the design section of the row.
Counters
This elements creates a section counter.
If you want to show some goals or awards, create first your row, apply your custom background or none, then divide it in as many columns as there are clients.
For each counter you can set a number ( integer ), a suffix ( for ex. K or % or other ) and a label.
The varius counters they will be auto animated when you'll scroll the page to this section.
Team Member
Use this elements to create a team section in your page.
This element adds an item team for column. So you must create your row before and then divide it in as many columns as there are people.
For each team element you can upload an image, set a name and his role. You can insert up to 3 social networks too.
Service Carousel
This element creates a carousel with service blocks.
The service box adds an icon above the text.
You needn't to divide the row in columns.
The slider works on all row, however you can include it in a column to make it smaller.
In other hand you can set the full width or boxed mode from row which contains the carousel (row -> design options).
Accordion
This is a classic accordion element edited and well formatted just for this theme.
Add one or multiple tab to create for example a FAQ section.
For each tab you can set a title and write a description.
Tabs
This is a classic tab element formatted just for this theme. You can add one or multiple tabs. For each tab you can add title and description.
Google Maps
Use this element to create your custom map.
You can use this element to add feature in your contact page or bottom home.
To create a map, you must set the latitude and longitude coordinates.
You can add a description for the marker point, set the area zoom and set the height of map.
Include map element in a row and set it in full width mode ( row settings -> design options ) to make the map full width.
Pricing Title
Use this element to create your pricing area.
Before using this element create a row and then divide it in as many columns as they are the tabs.
For each table you can set a title, mark it as featured, set a price and currency.
Then you can compile your table adding multiple features. For each feature you can add a label and set it as enabled or disabled.
In adding you can set a button link below the feature list.
Project Metas
Use this element in your project page. This one adding a list of meta informations.
You can compile it setting the category of the project, a release date, a project url, and the client url.
Each of ones options can be let empty.
Portfolio Grid
Use this element to create your custom loop of items ( projects ) in your page or row.
Note - Before set this element make sure that you have already adds your items in your portfolio.
To create items ( projects ) go to creation project here.
After adding all items, you can set the portoflio grid.
You can enable or disable the filter category, set the items limit ( integer ), selecting your prefer order ( between: title, date, date modified, slug or random ) and set the direction ( ascending or descending ).
In adding you can add a load more button too to active the ajax loader.
Posts Grid
Use this element to create your custom loop of posts ( blog ) in your page or row.
Note - Before set this element make sure that you have already adds your posts in your blog.
After adding some posts, you can set the posts grid.
Like the Portfolio Grid, you can set the limit posts to show, the order and the direction.
