Visual composer

Visual composer is a drag and drop frontend and backend page builder plugin that equips you with more than 40 elements (also called shortcodes) to design your page with ease. In addition to these predefined elements, Pearle has 30 extra ones helping you to create many desirable pages. To generate the shortcodes, go to Backend Editor, click the “+” icon to add shortcode. Navigate to Nootheme tab to find a shortcode you want to use. You can add those shortcodes to any pages or posts for your own use.

♣ Row settings includes:
• General:
Using Container: if you check this box, container`s width will be 1170px.
Row stretch: In our demo, we set Default in this section. Besides Default, you can select Stretch row, Stretch row and content, stretch row and content (no paddings). If opting these ones, the whole content in Red row 2 will disappear when it is shown on the site.
Full height row: when you tick this box, row will be set to full height.
Use video background: If this box is checked, video will be used as row background.
Parallax: There are three options for you:
None: image without parallax effect
Simple: image with parallax effect. It means that the image will move when you let the mouse scroll on it
With fade: image with parallax effect but move effect of the image is not as clear as that of Simple style.
Note: Two options Use video background (tick this box) and Parallax (Simple and With fade) will avail in some cases. For example, if font color is white and you do not use video background or Simple/ With Fade Parallax then visitors of you site may find it difficult to read white words and phrases. You know,  white words on white background. No one can figure out those words in this case!

• Design Options:

CSS box: you can change width of padding, border and margin here

Background color: opt color for background here

Below background color section, you will have an option to upload the background image and opt styles of background image: theme default, cover, contain, no repeat and repeat.

Cover: Scale the background image to be as large as possible so that the background area will be completely covered by the background image. Some parts of the background image may not be in view within the background positioning area.

Contain: Scale the image to the largest size such that both its width and its height can fit inside the content area.

No repeat: Size of the image will not change when it is placed in background area.

Repeat: Size of the image will also be as same as that of the original one; however, then many replicates of this image will be established in background area.

This shortcode is used to add titles
Position Styles: this option controls position of the title. The style can be Left or Center
Choose color: Color of the title which is Black or White
Number: opt a number that will be placed next to the title. Notice that as for the number containing more 2 digits you should separate them by space so that the number will not hide the title when it is shown on the site.Title: Enter a title here
Display of Noo Title on Home Page:

Choose Style: Your choice in this section will have an influence on the next options.If you opt Style 1 then the following ones are:

Style Align: Left or Right. If it is Right, the first word of the Description will  be moved to the right little. Meanwhile, Left style will let the first words in each line of the Description be aligned or they will be arranged in a straight line when you see them in vertical direction.

Choose Style icon: Font icon or Image Icon. If your preference is the first one then you will be given Choose icon section. Yet, your interest is image icon you can upload images in Choose image

Title: Enter a title here

Description: Type a brief paragraph here.

If you opt Style 2 , the upcoming options are Choose Style Icon, Title and Description

If you opt Style 3, the next options are Choose Style icon, Image hover (this option will act if you select Image icon in Choose Style icon), Title and Description.
Display of Noo Why Choose Us on Home Page:

Choose Style: Style One or Style Two. The first choice is applied to Carle demo whereas the second one is used in Printing demo.
Title: Enter a title here

Content: Enter a content here

Background: select a background image

Icon: Upload an icon image

Button name: Give a name to the button, for example, Learn more button

Button link: Paste link of the button

Style Two of Noo Save Your Money shortcode and its display on Home Onepage of Printing demo

• General options:Categories Services: opt service categories here

Order By: Recent First, Older First, Title Alphabet or Title Reserved Alphabet

Limit: This option places a limit on the number of displayed services

Limit excerpt: A number you enter here will be equal to excerpt length of each service post
• Services options:

Show categories/ Title/ Learn more: Opt Hide or Show here

Choose Style: The Style can be Slider Services or Column Services. If you vote for Slider Services, you will have the following options: Show pagination (Opt show or hide here), Auto play (opt Yes or No to decide whether or not service`s sliders will automatically played or not. If you are partial to the second choice then you will have an option named Size Services. The size of column is Large or Small.

Limited post of Slider: This option restricts the number of posts shown on each Slider. The number is 2, 3 or 4.

Display of Noo Services on Home page:

This shortcode is used to create Services 2 Page
Categories Services: pick service categories in the drop-down list
Order By: Recent First, Older First, title alphabet and Title Reserved Alphabet
Show Filter: Opt Yes or No to show or Hide the filter
Limit: this option limits the number of displayed services.

Choose Style: The style can be default or Border. If it is default, the Description will be displayed like this:

If it is Border style, when you let the mouse hover over Descriptions, you will find that they are underlined.

List active: Opting Yes will result in automatic display of Border style

Description: Give a piece of information here.

Display of Noo List on Home page:

Choose Style: Background or No Background. The first choice let you complete the next two options are Button Name and Button Link. However, If you select the second one, you will have a further option called Choose icon.

Choose Style: There are three styles for you to select: Slider One, Slider Two and Default. Slider One is used in Carle demo whereas Slider Two is used on Home One Page of Printing.
Number: opt a number that will be placed next to the title. Notice that as for the number containing more 2 digits you should separate them by space so that the number will not hide the title when it is shown on the site.
Title: Enter a title here
Description: Give a short description here
Data source: The sources are Posts, Tags or category.
Include Only: Add title of the posts which will be displayed on the page.
Order by: Recent First (the latest published date), Older First (The older published date), Title alphabet, title reversed alphabet.
Posts per page: The number of posts is shown per page.
Excerpt length: Excerpt is a short extract or a short passage taken from from the post. Length of the excerpt is determined by number of words. Therefore, if you opt a specific number like 15, the number of words contained in an excerpt will be equivalent to 15.

This shortcode is used to create Blog Mansory page
Categories: Select blog post categories in the drop-down list
Order By: Recent first, Older first, Title Alphabet and Title Reserved Alphabet.
Post per page: The number you enter in this option will decide number of posts loaded at the same time when you scroll the mouse down.
Load more icon: opt a icon used to load itemsDisplay of Noo Blog Mansory

Latitude: Enter a number corresponding to latitude of the map
Longitude: Enter a number corresponding to longitude of the map
Icon Map: Upload an icon image here
Height Map: Enter a number equivalent to height of the map
Note: To get longitude and latitude, firstly, you should go to this website:
http://www.latlong.net/
Search the place you want then you will see its longitude and latitude
Display of Noo map on Contact page:

Number: opt a number that will be placed next to the title. Notice that as for the number containing more 2 digits you should separate them by space so that the number will not hide the title when it is shown on the site.
Title: Enter a title here
Description: Give a short description
Categories: opt a member category
Order by: Recent First (the latest published date), Older First (The older published date), Title alphabet, title reversed alphabet.
Posts per page: The number of posts is shown per page
Display of Noo Team on Home Page:

Style: the style can be Default or Slider. If you have a liking for Default, you will have three extra options:

Upload images, Custom link (enter links for clients and those links are separated by Enter), Custom Link target (select where to open custom links: same window or new window). Yet, selecting the remaining style will make you complete two further options other than options above: Status Button (Show or Hide the button), Limited post of Slider (the number of posts situated on the Slider)

Display of Noo Clients on Home Page:

This shortcode is used to create Newsletter section that is usually shown at the bottom of pages.
Title: Enter a title
Subscribe Text: Type subscribe texts here
Subscribe Mail list: This option shows what you completed in List name section when you had created a List in Mailchimp
Style: Full-width or Boxed. The Style handles measurements of Newsletter section. Full-width give larger measurements while the opposite belongs to Boxed style.
Background: upload a background image here
Note: Learn more about our Mailchimp Instruction

Select Contact form: opt a contact form you created in Contact> Contact Forms
Include only: Add title and an extract of posts here. It is recommended that you choose a post to type hereDisplay of Noo Post Contact on Home page:

 

Choose Style: The style is Style One or Style Two. If you pick the first one, you will have fewer options:
Title: Enter a title
Select Contact Form: opt a Contact form in the drop-down list.
Yet when you vote for Style Two, you will have further options:
Number: Enter a number. If the number has more 2 digits, please separate them with space so that the number will not hide the title when they are displayed on the site.
Background: Select a background imageDisplay of Noo Custom Form 7 on Home Services page

This shortcode only has an option:
Select Contact Form: opt a Contact form you created in Admin panel> Contact> Contact Forms
Note: To see Appointment form, please click on Book Appointment tab on the right side.
Display of Noo Appointment on Home One Page:

Import Number: Enter a number here
Tile: Enter a title here

Title: Enter a title here
Price: Enter price here
Button name: give a name to the button
Button link: paste link of the button here
Content: Enter items whose price is the one you input in Price option above. Separate items by pressing Enter
Background Style: There are two available background colors that are White and Gray
Display of Noo Pricing on Home One Page

Choose Style: Style 1, Style 2 or Style 3
Categories: Pick Testimonial categories in the drop-down list
Order by: Recent first, Older first, Title alphabet or Title Reserved Alphabet
Auto play: Opt Yes or No
Limited Testimonial: The number of testimonials is displayed

Choose Style: The style controls position of each contact information. It can be Left or Center
Icon: Click the arrow to choose an icon
Name: give a name to each contact information section , for example, we have address, email, hotline, etc
Description: give more specific contact information
Display of Noo Information on Home One page

This shortcode is used for creating Special Offers page
Title: Enter a title
Content: Enter a paragraph
Link image: Enter link of the image
Upload image
Note: Opt a coupon by ticking the square box on the upper right. After choosing your coupons, you can print the list of these coupons by clicking Print Selected Offer.

Choose category: Opt project categories in the drop-down list
Order by: Recent First, Older First, Title Alphabet, Title Reserved Alphabet
Auto Play: Opt Yes or No
Limited: This option limits the number of projects displayed on each pageDisplay of Noo Projects Slider on Home Page of Bikang:

This shortcode is used to create Our Projects page of Bikang
Style Project: Show padding or Hide Padding
Project columns: Number of columns displayed on the page. The drop-down list has three options that are 2, 3 and 4 columns
Choose Categories: choose project categories here
Order by: Recent first, Older first, Title Alphabet or Title Reserved Alphabet
Show filter: Opt Yes or No to show or hide filter
Limit: This option restricts the number of projects shown on each pageDisplay of Noo Projects Grid on Our Projects page:

This shortcode is used to create Project list page of Bikang
Categories: Select project categories in the drop-down list
Order By: Recent first, Older first, Title Alphabet or Title Reserved Alphabet
Post per page: The number of posts is shown on each pageDisplay of Noo Projects List on Project List page:

General options:
Image size: the size can be thumbnail, medium, large, full or other sizes defined by the current theme. Besides, you can also enter image size in pixels such as 200×100 (widthxheight). Leave empty to use thumbnail size.
Images: opt images in media library.
Design options
You can make changes to CSS box, border color, border style, border radius, background and box controls.

General options:
Choose data: Opt an item in the drop-down list
Order by: Recent first, Order first, Title Alphabet or Title reserved alphabet
Post Per page: This option determines how many products are shown on the page
Slider options:
Show pagination: Choose Show or Hide so that pagination will be shown or hidden
Auto play: Opt Yes or No
Display of Noo Woocommerce on Home page

General options:
Choose Style: Style 1 or Style 2. This option controls position of the image. If it is Style 1, the image is on the right side while the opposite is true of Style 2. We selected Style 1 for Red Row 3.
Text color: There are two choices for you: Black and White or White and Gold
Icon: Upload an image of the icon
Background: Upload a background image
Select identificator: Input product ID or product SKU or product title to see suggestions
Line options:
Status: Hide or Show line style
Line Style: Line Inset or Line Out. The first style, Line inset, it is a diagonal and the second one, Line out, it is a horizontal line.Display of Noo Product on Home Shop 1
:

Product categories: This option has a drop-down list of product categories you created in Admin panel > Products> categories.
Order by: Recent first, Older first, Title alphabet or Title Reserved Alphabet.
Auto Play: Opt Yes or No
Limited: This option limits the number of  displayed products
Display of Noo Products Slider on Home Page of bikang

Its setting is very simple because it only includes one option called Select Identificator (input product ID/SKU/title to see suggestions)

Display of Noo Simple Product on Home Shop 2 page:

Background: Upload a background image here
Product Categories: opt product categories in the drop-down list
Order by:  Recent First, Older First, Title Alphabet, Title Reserved Alphabet
Auto play: Opt Yes or No
Limited: This option limits the number of  displayed productsDisplay of Noo poster Product on Home Shop 2