All themes of NooTheme share the same theme settings structure so that you can export then import setting from one theme to another one conveniently.
Import Settings: Click Upload button then choose a JSON file (.json) from your computer to import setting to this theme. All the settings will be loaded for preview here and will not be saved until you click button “Save and Publish”.
Export Setting: Simply click Download button to export all your settings to a JSON file (.json). You then can use that file to restore theme settings to any theme of NooTheme.
Custom Code
In this section you can add custom JavaScript and CSS to your site. You Google analytics tracking code should be added to Custom JavaScript field.
Social Media
Input URLs of your social media here so that the corresponding social icons will be displayed if Social Icon is enabled on Top Bar or Bottom Bar
Woocommerce
1. Shop Page
Shop Layout: Shop page is also an ideal place to incorporate sidebar. Opt With Right Sidebar or With Left Sidebar to achieve this and as usual, Full-Width makes display of the sidebar inactive. Shop Sidebar: select a sidebar that exists on the Shop page Shop Heading: Enter a title here Heading Background Image: Remove or change the image Shop Default View Style: The style can be Grid or List Products Grid Columns: The number of columns is displayed Products per page: The number of products is displayed on each page
2. Single Product
Product Layout: check this box in order that single products will have the same layout as Shop page. Product Sidebar: Choose a sidebar that will be shown on the single product page Related Products Count: The number of related products is shown.
Blog
Making some changes in this section will have some impacts on Post list and each post on Blog page
1. Post List
Blog Layout: The layout of Post list is Full-width , With Right Sidebar or With Left Side bar. Choose the first style if you do not want sidebar to be displayed on Blog page. In contrast, the last ones will let sidebar be shown on the page
Blog Sidebar: choose a sidebar that will be shown on Blog page
Excerpt Length: Excerpt is a short paragraph or an extract taken from the blog post. The number you enter here is corresponding to the number of words included in this excerpt.
Show Readmore Link/ Post Meta/ Post Tags: Tick boxes to show these items
2. Single Post
Post Layout: Tick this box so that single posts have the same layout as Post list. Uncheck to opt another layout. Show Post Tags, Post Meta, Show Author`s Bio: Tick these boxes to show these items on each post Enable Social Sharing: Enable/Disable Social Sharing. If it is enabled, visitors can share your post by Facebook, Twitter, Google+, Pinterest and LinkedIn
Widgets
This section enables you to customize Widgets situated in Footer. Besides, you can also add widgets to Menu Sidebar One, Menu Sidebar Two, Menu Sidebar Three, Noo Footer Top, Noo-Footer Column #.
Footer
Footer Columns: Select the number of columns that will be shown in footer Footer Bottom Content In Left: Enter content that will be displayed on the left side of footer section Footer Bottom Content In Right: Enter content that will be shown on the right side of footer section
Header
1. Header Style
There are 4 types of Header
♣ Header Fullwidth Transparent
♣ Header Classic Transparent
♣ Header Business
♣ Header Classic
2. Navigation Bar
NavBar Position: Position of NavBar includes Static Top, Fix When Scroll To Top and Fixed Top. Static Top, in this case, the NavBar does not move. It means that when you scroll down on the page and let the mouse pass the NavBar, you will not see the NavBar displayed on top. However, Fixed Top will allow you to see the NavBar when you scroll down the mouse. Meanwhile, Fix When Scroll To Top will allow you to see the NavBar when you scroll the mouse to the top. NavBar Link Spacing: You can change NavBar Link Spacing here Use Custom NavBar Font and Color: Turn on this button to change NavBar Font and Color. Then you can change NavBar Font, Font Size, Link Color, Link Hover Color. Transform to Uppercase: Tick this box so that Header font will transform into Uppercase.
3. Logo
Emigo allows you to add image file or use text for logo. If turning off Use image for Logo button, you will have options to enter your site name, select logo font from Google font, font size, font color, uppercase for text logo. If turning on this button then you can upload an image and change its height.
4. Top Bar
Text On Top Left: Texts entered in this section will only be shown if you select Header Classic Transparent Facebook/ Twitter/ Google Plus/ Pinterest URL: Enter link of these social media Text On Top Right: Enter texts that will be displayed at the right top
Typography
You can customize your Typography settings here. Organici integrated all Google Fonts. See font preview at Google Fonts
1. Headings
Use Custom Headings Font: Turn this button on so that you will have extra options to change Headings font and color
Transform to Uppercase: If you tick this box, headings such as <h1><h2><h3> will be in uppercase
2. Body
Use Custom Font Body: Turn this button on in order that you can make adjusments to Body font, Font color and Font size
Design and Layout
1. Site Layout
You can set Style & Layout for your site. Emigo is equipped with two layout styles including: Boxed Layout and Fullwidth layout.
If you select Boxed Layout, you will have further options: Site Width, Site Max Width: these options handle width of the site Background color, Background Image: If you opt yellow for background, background of your site will be filled with this color. However, when you set up background image, background of the site will be replaced with a new image. Background repeat: Background Repeat will work effectively if you use patterned background image. When you let the image repeated, its copies will cover the whole background.
Background image attachment: There are two types that are Fixed image and Scroll with site. Fixed image means that when you scroll down on the page, you will still see the background image. Yet Scroll with site does not allow you to do this. Auto Resize: if you turn on the button, image will appear in the whole background area. Yet, turning off this button will make background image be displayed only in a part of one side. Position of background image in this case may be left top, left center, left bottom, center top, center center, etc of the side. It depends on your choice in Background Image Alignment box.
2. Color
You can select a color for links and various elements of your site
Menus
You can create a new menu, change order of items in a formed menu or add items to the menu
Site Identity
Options in Customizer are in charge of appearance of your site. You can control various features of header, footer, font, color, logo, menu, etc here. Remember that any adjustments made by you will become real with the condition that you have clicked Save & Publish button on top.
Tag line: reveals a brief description of the site Site icon is an image viewable in browsers for users to identify your website among many tabs. Please remember that the icon must be square and at least 512px wide and high. See the illustrative image to better understand function of the site icon. After choosing the image , you will click Save and Publish. Then when you come back to your site, you will see an image displayed on the tap of your website. It is clear that by dint of the this icon, you can distinguish your website`s tab from other tabs more easily.
Footer
Footer
The Footer is composed of two parts that are Footer Columns or Widget area and Footer Bottom. Thus, now you can guess that you will have to use not only Customizer but also Appearance>Widgets to make adjustments to the Footer.
You can see available widgets on the left side and 4 sidebars belonging to Footer: Noo – Footer Column #1, Noo – Footer Column #2, Noo – Footer Column #3 and Noo – Footer Column #4.
1. Noo- Footer Column #1
Drag Noo Information widget on the left side to this sidebar> click triangle icon on the right side of the widget > complete options > Save
2. Noo-Footer Column #2
Drag Custom Menu widget on the left side to this sidebar> click the triangle icon on the right of the widget> complete options (select About menu that is created in Appearance> Menu) > Save
3. Noo-Footer Column #3
Drag Custom Menu widget on the left side to this sidebar> click the triangle icon on the right of the widget> complete options (Select Account menu) > Save
4. Noo-Footer Column #4
Drag Noo Instagram widget on the left side to this sidebar> click the triangle icon on the right of the widget> complete options > Save
header
Mega Menu
Emigo equips you with a kind of menu called Mega menu whose sample is placed on Shop page of our demo site. Basically, it has some typical features:
• The first one, a noticeable feature is that Mega menu allows you to organize sub-menus according to columns. Meanwhile, sub-menus are usually arranged in conformity with hierarchy.
• The structure of a mega menu contains Mega menu heading, sub-pages and widget area.
• Mega menu helps icons to be shown next to pages and sub-pages on the Navigation bar
1. Create A Mega Menu
In order that you can better perceive how to build a Mega menu, we will opt Shop page in which Mega menu is created. Please follow these steps:
Step 1: Navigate to Appearance > Menus > do the same steps mentioned in Set Up Menu to obtain structure of the mega menu on Shop page as in the image
Step 2: Click the triangle icon on the right of Shop pages item then it will expand into many options like:
Navigation label: name of the parent page (Shop page)
Icon: you can select an icon of the page and change size, color and position of the icon here. Click the arrow icon to opt an icon and click the stick icon to make alternations to the icon.
Enable Mega menu: ticking this box allows display of megamenu
Mega menu column: This option has a drop-down list of different numbers of columns shown in Mega menu area. The number varies from 2 to 6. On our demo site, this number is 3.
Hide Mega menu heading: Check this box if you want to hide Mega menu heading. In our demo, Shop pages item is considered to be a Mega Menu heading. When you choose option of hiding mega menu heading, Shop pages title will automatically disappear on Mega menu area.
Step 3: Regarding Shop Page item, it is a Custom link. Therefore, you also have common options like URL, Navigation, Title Attribute and Icon. Besides, you will have an extra option named Mega Menu Widget Area which contains a drop-down list. Thus, you will have to opt Select Widget area whereas the remaining options in this drop-down list will make Shop pages item become a widget area.
Step 4: As for sub-pages like Wishlist, My account, Cart and Checkout, you only need to modify three options which are Navigation Label, Title Attribute and Icon.
Step 5: With regards to Categories and Popular Brands, they are Custom Links. Thus, you can figure out that options of Categories and Popular Brands are similar to those of Shop Page. For instance, as for Categories, you will enter a URL, Navigation Label (Categories), choose Select Widget Area in the drop-down list of Mega Menu Widget Area.
Besides, Categories and Popular Brands items have some sub-items which are also Custom links.
Step 6:Column 4 generates the widget area which contains 2 images.
Therefore, before making any changes to options included in this item, please assure that you created a sidebar and a widget corresponding to it.
• Next, we will go to Appearance> Widgets> drag Text widget to Menu Sidebar One> click the triangle icon on the right of the widget> paste link of the image into content section (See the illustrative image to know how to add link)> Save.
Column 4 is a Custom Link. So it has some options like URL, Navigation Label, Icon, Mega Menu Widget Area (select Menu Sidebar One in the drop-down list)
Step 7: Click Save Menu
Set Up Menu
Follow these steps so that menu items can be shown in Header
Step 1: Navigate to Appearance–> Menu section of your admin sidebar. Step 2: Click the Create A New Menu link to make a new menu. Enter the name then click the Create Menu Step 3: To add menu item, select one of your created pages on the left hand side and click the Add To Menu button. You can also add different posts from the left side. Step 4: To add a custom menu item, enter a custom name and link into the Links box. Step 5: Manage your menus by using the drag and drop functionality. To create a dropdown menu in Menu Structure, simply drag a menu item on the left side to the area on the right side. Step 6: After setting up your menu, scroll down to the bottom of the page to assign the menu on the Theme Location box. Step 7: Once It’s all done, make sure you click Save Menu.
Now returning to the site, you will see the menu shown on the header like this:
Yet when you see the header on our demo site:
You can wonder yourself “why is the header of my site different from that of your site?”.To achieve such design, refer to this link: http://nootheme.com/documents/header-9/
An Introduction To Header
Perhaps Header is the first place visitors look at when they go to your site. The first impression is always important; therefore, if the Header can convey your message to users, that is very great! The simple message given to them can be an understandable and clear menu or an amazing and eye-catching design of the header or diversified header styles of your site also make the most choosy customers feel satisfied.
In the most essential respect, a header should contain three parts which are menu area, logo and top bar:
Here is structure of sections in Header, which will help you to acquire essential knowledge of building a Header. In terms of an striking and personal Header, I suppose that it depends on your creativity:))
♦ Set up Menu
♦ Customize Header
Import demo
Import Demo
To import demo data, please go to Noo settings> Import Demo> Tick all three boxes to import Post, Nav Menu and Comment> Click install button to install Emigo
Only by carrying out steps on Envato market and in Admin Panel > NOO settings > Quick Setup can you update the theme automatically:
Step 1: Hover over username then choose Download
Step 2: Select “License certificate and purchase code”
Step 3: In Admin Panel, choose NOO settings > navigate to Quick setup tab > Enter code into License key
Step 4: Save changes ♣ Note: When a new version of the theme is released, you will go to Appearance> theme> there will be a message notifying you to update the theme automatically > Click Automatic Update
Requirement For Emigo
To use Emigo theme, you must be running WordPress 3.6 or higher, PHP 5.6 or higher, and MySQL 5 or higher. Follow below checklist to ensure your host can work well with Emigo theme:
Your web host has the minimum requirements to run WordPress.
They are running the latest version of WordPress.
You can download the latest release of WordPress from official WordPress website.
You did create best secure passwords FTP and Database.
Download Theme Package
After purchasing our theme from Themeforest, you will need to download theme package for your use. To download the package, please login to your Themeforest account, navigate to “Downloads”, click the “Download” button in the left of the theme, choose “All files & documentation” to download our theme package to your computer. The theme package includes:
Emigo Theme File: Includes noo-emigo.zip file that consists of everything you need to install the theme.
Document Folder: Includes Emigo Documentation file that helps you get to know about Emigo and guides you to build your site with our theme.
Licensing Folder: Includes the licensing files of Themeforest purchase.
WordPress Information
Before installing this theme, please make sure you have a working WordPress version already installed. For further guide to install WordPress, please find in useful links below:
Firstly we would love to send our great thanks to you for purchasing Emigo. This documentation covers almost everything to guide you step by step to have your site on air. We encourage you to read all sections thoroughly before you go on. If you still have to cope with any problem around, get our quick support at NooTheme Support Center.
Thanks again and enjoy building your website with Emigo.
Pages
Page Template
We have built some specific page templates for you. Here is the list and their short description:
•Full- width Template: This template is set to be full-width that can be used for Homepage, About Us….Most of our demo pages use this kind of template.
• Page Left Menu: This template is used for Home Page 5
• Page Product Slider: This one is selected for Home Page 3
• Page With Left or Right Sidebar: This template is used for page on which sidebar is displayed.
Page Settings
When you create a new page, you will have options to change elements of Header :
Show Breadcrumb: Tick this box so that the breadcrumb can be shown on the page
Header setting: there is a drop-down list containing Header types to select
Menu Logo: Upload a Logo image
Navbar Position: There are 4 options that are Use Navbar Position in customizer, Static Top, Fix When Scroll To Top and Fixed Top. Static Top, in this case, the NavBar does not move. It means that when you scroll down on the page and let the mouse pass the NavBar, you will not see the NavBar displayed on top. However, Fixed Top will allow you to see the NavBar when you scroll down the mouse. Meanwhile, Fix When Scroll To Top will allow you to see the NavBar when you scroll the mouse to the top.
♣ Note: In spite of what you set up in Customizer, all options in Page settings will always be prioritized.
Create A New Page
Please follow these steps to create your pages:
Step 1: In Admin Panel, choose Page, click “Add New” on top then enter your page title. You can custom slug of the page in Permalink field appeared after entering title.
If you need to know more about Pages in WordPress, use the Help tab in the upper right of your screen.
Step 2: In Page Attributes box on the right side, choose your Parent page. It is set by default as no parent. Pages are usually ordered alphabetically, but you can choose your own order by entering a number in Order field.
Step 3: Also in Page Attributes box, choose your Page Template in dropdown list.
Step 4: Start editing your page content in the editing field. You can choose to edit your content using Visual or Text editor. To build content for you page you will need to our provided Shortcodes.
Step 5: Make other settings for the page in meta-boxes under editing field. Once you get your settings done, click Publish.
Next, we will introduce you elements or short codes used to build each page
Note:
After editing any sections in an element setting, please click Save changes button and then Publish/Update button.
We instruct you to create shortcodes in pages so that your pages will be exactly similar to those on our demo site. Yet, it is up to you to make adjustments to settings of elements. By virtue of this creative action, your site will become special 🙂
FAQ Page
There are two shortcodes used to create FAQ Page.
These two shortcodes are Row and Tour. After you add Tour shortcode, some Section shortcodes are automatically generated.
Display of this page on the site
Contact Us Page
Here is image of shortcodes used to create Contact Us Page
1. Red Row 1
♣ It has a Row shortcode whose style is one column
♣ The column contains a Google Map shortcode
2. Red Row 2
♣ It has a Row shortcode whose style is 4 columns
♣ Each column contains a Noo Information shortcode Icon: Click the arrow on the right side to choose icons in the drop-down list Title: Enter a title here Description: Give a short description you want or you can add extra contact information
Row settings
3. Red Row 3
♣ It has a Row shortcode whose style is 2 columns
1. The first column setttings
2. The second column settings
♣ The first column contains a Noo Title 1. Noo Title and a Text Block shortcode
♣ The second one does not include any shortcodes
4. Red Row 4
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Contact Form 7 shortcode
About Us Page
Here are images of shortcodes used to create About Us Page
1. Red Row 1
♣ It has a Row shortcode whose style is one column
♣ The column contains a Noo Title shortcode 1. Noo Title
2. Red Row 2
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Text Block shortcode
Row settings
3. Red Row 3
♣ It has a Row shortcode whose style is 2 columns
♣ The first column comprises a Single Image shortcode
♣ The second one includes a Noo Title, a Text Block and a Progress Bar shortcode
Display of Red Row 3 on the site
4. Red Row 4
♣ It has a Row shortcode whose style is one column
♣ The column contains a Noo Title and a Text Block shortcode
Row settings
5. Red Row 5
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Noo Team shortcode Attach: Enter texts here Title: Enter a title here Categories: Choose member categories in the drop-down list Order By: The display order of members is based on Recent First, Older First, Title Alphabet or Title Reversed Alphabet Posts Per Page: The number of posts is shown per page
Row settings
Blog Pages
1. Blog Page
To build this page, you only need to enter title of the page and click the Publish button. After that, you will carry out one further step: Navigate to Settings>Reading> opt Blog in Posts page section> Save changes.“Why does this page not have any shortcodes but it will still contain content when the page is exhibited on the site?”You may be intrigued by this question. The reason is that you decided on Blog in above-mentioned Posts Page section. In this case, it takes all the latest blog posts originating from Posts in Admin Panel.
2. Blog Masonry
There are two shortcodes used to create Blog Masonry page
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Noo Blog shortcode Choose style: The style can be Grid or Masonry
1. Grid
2. Masonry
Data Source: The data can be originated from Category, Tags or Posts Categories: Select shown blog categories Order By: The display order of blog posts is based on Recent First, Older First, Title Alphabet or Title Reversed Alphabet Choose columns: The number of shown columns varies from 1 to 4 Choose Style Pagination: The style is Default or Infinite Scroll. If you select the second style, you will have an extra option called Load More Button Posts Per Page: The number of posts is shown per page Excerpt Length: The number entered here is equal to the number of texts included the excerpt.
3. Blog Grid 3 Columns Page
Shortcodes of this page are similar to those of Blog Masonry. However, style of Noo Blog now is Grid instead Masonry.
4. Blog Grid Left/ Right Sidebar Page
Shortcodes of these pages are similar to those of Blog Grid Left/ Right Sidebar Page. Yet, template of these pages is Page With Left/ Right Sidebar
Display of these two pages on the site
Home page 5 (Home Left Menu)
This page has some distinct features:
♣ You will need to select Page Left Menu in the drop-down list of Template
♣ The page does not have footer section
♣ You will complete options of Copyright and Social For Left. You can add content to the Copyright section and add social links. These ones will be shown on the left side
Here are images of shortcodes used in building Home Page 5
1. Red Row 1
♣ It has a Row shortcode whose style is one column
♣ The column contains a Revolution Slider shortcode
2. Red Row 2
♣ It has a Row shortcode of which style is one column
♣ The column comprises a Noo Product shortcode 10. Noo Product
Row settings
3. Red Row 3
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Noo Purchase Custom 13. Noo Purchase Custom
4. Red Row 4
♣ It has a Row shortcode whose style is one column
♣ The column contains a Noo Product shortcode 10. Noo Product
Row settings
5. Red Row 5
♣It has a Row shortcode whose style is one column
♣ The column comprises a Noo Countdown shortcode
Row settings
6. Red Row 6
♣ It has a Row shortcode whose style is one column
♣ The column contains a Noo Testimonial shortcode
7. Red Row 7
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Noo Blog Slider shortcode
Row settings
Home Page 4
Here are images of shortcodes used to Home Page 4
1. Red Row 1
♣ It has a Row shortcode whose style is one column
♣ The column contains a Revolution Slider shortcode
2. Red Row 2
♣ It has a Row shortcode of which style is one column
♣ The column comprises a Noo About shortcode Title: Enter a title here Attach: Enter texts here Content: Give a short description Button name: Give a name to the button Button Link: Enter link of the button Background Image Right: Upload an image that will be on the right side
3. Red Row 3
♣ It has a Row shortcode whose style is 2 columns
♣ The first column contains a Image Gallery shortcode
♣ The second one comprises a Noo Title and a Noo Testimonial shortcode Noo Title settings Attach: Enter texts here Title: Enter a title here
4. Red Row 4
♣ It has a Row shortcode whose style is one column
♣ The column contains a Noo Product shortcode 10. Noo Product
Row settings
5. Red Row 5
♣ It has a Row shortcode of which style is one column
♣ The column includes a Noo Partner shortcode
6. Red Row 6
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Noo Mailchimp shortcode
Row settings
Home Page 3
There are two special features of this page:
♣ To show the slider at the top of this page, you will need to choose Page Product Slider in the drop-down list of Template
♣ Besides, you will need to complete some options of Slider Config Choose Categories: Select product categories that will be shown Posts Per page: The number of posts is shown per page Order by: The display order of products is based on Recent First, Older First, Title Alphabet or Title Reversed Alphabet Auto Play: Choose True so that the slider can automatically play and select False for the opposite case
Here are images of shortcodes used to create Home page 3
1. Red Row 1
♣ It has a Row shortcode whose style is 2 columns
♣ Each column comprises a Noo Custom shortcode 11. Noo Custom
2. Red Row 2
♣ It has a Row shortcode whose style is one column
♣ The column includes a Noo Product shortcode 10. Noo Product
Row settings
3. Red Row 3
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Noo Purchase Custom shortcode 13. Noo Purchase Custom
4. Red Row 4
♣ It has a Row shortcode whose style is one column
♣ The column includes a Noo Blog Slider shortcode 5. Noo Blog Slider
Row settings
5. Red Row 5
♣ It has a Row shortcode whose style is one column
♣ The column contains a Noo Partner shortcode 8. Noo Partner
Row settings
Home Page 2
Here are images of shortcodes used to create Home page 2
1. Red Row 1
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Revolution Slider shortcode
2. Red Row 2
♣ It has a Row shortcode of which style is one column
♣ The column includes a Noo Product shortcode 10. Noo Product
Row settings
3. Red Row 3
♣ It has a Row shortcode whose style is one column
♣ The column contains a Noo Purchase Custom shortcode Title: Enter a title here Button Name: Give a name to the button Button Link: Enter link of the button here Background Image: Upload a background image here
4. Red Row 4
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Noo Product shortcode 10. Noo Product
5. Red Row 5
♣ It has a Row shortcode whose style is 2 columns
♣ Each column includes a Noo Custom shortcode Title: Enter a title here Attach: Enter texts here Description: Enter a short description Choose Image: Upload an image Button name: Give a name to the button Button Link: Enter link of the button Position Text: All texts can be on the right or left side
6. Red Row 6
♣ It has a Row shortcode whose style is one column
♣ The column includes a Noo Partner shortcode 8. Noo Partner
Row settings
7. Red Row 7
♣ It has a Row shortcode whose style is one column
♣ The column includes a Noo Blog Slider 5. Noo Blog Slider
8. Red Row 8
♣ It has a Row shortcode whose style is one column
♣ The column contains a Noo Testimonial shortcode 6. Noo Testimonial
9. Red Row 9
♣ It has a Row shortcode of which style is one column
♣ The column comprises a Noo Mailchimp 7. Noo Mailchimp
Row settings
Home page
Here are images of shortcodes used to create Home page
1. Red Row 1
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Revolution Slider shortcode
2. Red Row 2
♣ It has a Row shortcode whose style is 2 columns (2/3+1/3)
♣ The first column contains 2 Row shortcodes of which styles are 2 columns
Setting of the first Row:
The first column
The second one
Setting of the second Row
The first column
The second one
Both columns of these 2 Row shortcodes contain a Single Image shortcode
♣ The second column comprises a Single Image shortcode
3. Red Row 3
♣ It has a Row shortcode whose style is one column
♣ The column includes a Noo Product shortcode Title: Enter a title here Attach: Enter a short description here Choose categories: Choose product categories in the drop-down list Choose Style: The display style of product categories can be Slider, Grid or Grid Two. Order By: The display order of product categories can be based on Recent first, Older first, Title alphabet or Title Reversed alphabet Limited: This option places a limit on the number of product categories displayed per page
If you are interested in Slider then the display will be
If you are partial to Grid style then display of this shortcode will be like this one
If you opt Grid Two Style, you will have extra 3 options: Choose Image: Upload an image Position for image: the image can be on the left or right of the products Link image: Enter link of the image here
4. Red Row 4
♣ It has a Row shortcode whose style is one column
♣ The column contains a Noo CountDown shortcode Choose Date: It is the date on which the countdown will end Title: Enter a title here Description: Give a short description here Button Link: Enter link of the button here Button name: Give a name to the button Image Left: Upload an image that is on the left side Image Right: Upload an image that is on the right side
Row settings
5. Red Row 5
♣ It has a Row shortcode whose style is one column
♣ The column includes a Noo Product shortcode 10. Noo Product
6. Red Row 6
♣ It has a Row shortcode whose style is one column
The column includes a Noo Partner shortcode Show or Hide Border: Select Show or Hide Limited Post of Slider: Upload Images: Upload Images here Custom Links: Enter link of the images. These links are separated by “Enter” Custom Link Target: the link will be opened in the same window or in a new one Auto Play: Choose Yes or No
Row settings
7. Red Row 7
It has a Row shortcode whose style is one column
The column contains a Noo Blog Slider shortcode Title: Enter a title here Attach: Give a short description here Choose Style: The style can be Default or Creative Data Source: The data can be taken from category, tags or posts Categories: Select blog categories in the drop-down list Order By: The order of posts` display can be based on Recent first, Older First, Title Alphabet or Title Reversed Alphabet Auto Play: Choose True or False Posts Per Page: The number of posts is shown per page
8. Red Row 8
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Noo Testimonial shortcode Choose Style: There are 3 styles:
1. Default
2. Navigation
3. Thumbnail Control
Categories: Choose the testimonial categories in the drop-down list Limited Testimonial: This option places a limit on the number of shown testimonial Order By: This option handles the display order of testimonials based on Recent First, Older First, Title Alphabet or Title Reversed Alphabet Auto Play: Choose Yes or No
Row settings
9. Red Row 9
♣ It has a Row shortcode whose style is one column
♣ The column comprises a Noo Mailchimp shortcode Title: Enter a title here Description: Give a short description here Note: In order that Noo Mailchimp can function properly, you will need to install and activate Mailchimp For WordPress plugin. Then you will paste these codes into Admin panel> Mailchimp For WordPress> Forms> Fields
<input type="email" name="EMAIL" placeholder="Your email address" required />
<input type="submit" value="subscribe" />
Row settings
Note:
To set a home page to be front page, you will go to Settings> Reading> tick A static Page box> choose a front page in the drop-down list> Save changes.
Post Types
Post Types
Usually, the theme only has a type of post called Blog post. However, hardly have you activated NooTheme Core Library plugin when you have 2 further kinds of post. So now the number of post types is 3, namely Blog post, Team Member and Testimonial.
1. Blog Post
It is obvious that blog posts will be shown on Blog page In Admin panel, please go to Posts. You can see subordinate parts like All posts (to see all created posts), Add New (to create a new post), Categories (to classify posts) and Tags (to classify posts but in a more specific way, tags can be keywords that are indicated in a post).When you intended to create posts, you had surely thought of generating all categories for posts. So we will begin with building categories:Adding a new category is very easy: enter name of category and click on Add New Category button.
Add A New Post
Step 1: Enter title and content of the post. Step 2:Now turning to the right side, you will complete some sections such as Format, Categories, Tags and Featured image. Step 3: Remember to click Publish to complete creating the post.
2. Team Member
Team members are shown on About Us page
To add a new team member category, you will go to Team Member> Categories> Enter name of team member> Click Add New Category
Add A New Team Member
Step 1:
Go to Team Member> Add New
Step 2: Enter title> complete member information (Image, name and position) and Social Media Data> on the right side, you will choose a team member category
Step 3: Click on Publish button
3. Testimonial
Testimonials are shown in testimonial section of Home pages
Add a New Testimonial Category You will go to Testimonial> Testimonial category> Enter name of the new category> click Add New Testimonial Category
Add A New Testimonial
Step 1: You will go to Testimonial> Add New> Enter title and content Step 2: Complete Testimonial options like your image, your name and your position. On the right side, you will choose a testimonial category Step 3: Click the Publish button
Sidebars & Widgets
Sidebars & Widgets
Emigo allows you to create an unlimited number of sidebar. Each page or post can come with a unique sidebar. To select a sidebar for post or page, make sure you set page template with sidebar . You may need to create several separate sidebars to use for different pages and posts. Follow these steps to generate a sidebar and add widgets to it.
Create A Sidebar
Step 1: Navigate to Appearance–> Sidebar Generator and click the Add New button, enter sidebar title then save. You can add as many sidebars as you need. Step 2: Once you are done, you need to add Widgets to the sidebar you just created. Step 3: Navigate to Appearance–> Widgets and find your sidebar on the right side. Step 4: On the left hand side you will see all the widgets you can use, simply drag and drop the widget you want into your sidebar on the right hand site. Step 5: Make sure you click Save to save the widgets added to your sidebar
Add Widgets To A Sidebar
You can add any widget and any number of widgets to your sidebar. All widgets are accessible from Appearance–>Widgets and easily dragged and dropped to your sidebar.
Step 1: Navigate to Appearance–> Widgets to access the list of widgets and widget section that they can be added. The left hand side shows all the widgets you can use. The right hand side shows all different sections you can add widgets to. Step 2: Simply drag and drop the widget you want into the widgets section you want the right hand side. Step 3: Don’t forget to click save changes after you customize any widget in sidebar.
The image above illustrates two sidebars that are Shop Sidebar and Main Sidebar
1. Shop Sidebar
This sidebar is displayed on the Shop page.
Drag Woocommerce Product categories, Woocommerce Price Filter, Woocommerce Products and Woocommerce Product Tags on the left side to this sidebar> click the triangle icon on the right of widgets > complete options > Save
2. Main Sidebar
This sidebar is shown on Blog page
Drag Categories, Noo Recent Posts, Tag Cloud and Noo Gallery Posts to this sidebar> click the triangle icon on the right of widgets > complete options > Save
Visual Composer
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, Emigo has 13 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 Emigo tab to find a shortcode you want to use. You can add those shortcodes to any pages or posts for your own use.
Note: In some cases, when you add an element and edit it, you should edit Row settings at the same time.
♣ 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 hereBelow 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.
1. Noo Title
This shortcode is used to build Home Page 4 Noo Title settings Attach: Enter texts here Title: Enter a title here
2. Noo Team
This shortcode is used in building About Us Page Attach: Enter texts here Title: Enter a title here Categories: Choose member categories in the drop-down list Order By: The display order of members is based on Recent First, Older First, Title Alphabet or Title Reversed Alphabet Posts Per Page: The number of posts is shown per page
3. Noo Information
This shortcode is used in building Contact Us Page Icon: Click the arrow on the right side to choose icons in the drop-down list Title: Enter a title here Description: Give a short description you want or you can add extra contact information
4. Noo Blog
This shortcode is used to create Blog Masonry and Blog Grid pages Choose style: The style can be Grid or Masonry
1. Grid
2. Masonry
Data Source: The data can be originated from Category, Tags or Posts Categories: Select shown blog categories Order By: The display order of blog posts is based on Recent First, Older First, Title Alphabet or Title Reversed Alphabet Choose columns: The number of shown columns varies from 1 to 4 Choose Style Pagination: The style is Default or Infinite Scroll. If you select the second style, you will have an extra option called Load More Button Posts Per Page: The number of posts is shown per page Excerpt Length: The number entered here is equal to the number of texts included the excerpt.
5. Noo Blog Slider
This one contributes to building Home Page Title: Enter a title here Attach: Give a short description here Choose Style: The style can be Default or Creative Data Source: The data can be taken from category, tags or posts Categories: Select blog categories in the drop-down list Order By: The order of posts` display can be based on Recent first, Older First, Title Alphabet or Title Reversed Alphabet Auto Play: Choose True or False Posts Per Page: The number of posts is shown per page
6. Noo Testimonial
It is one of shortcodes used to create Home Page Choose Style: There are 3 styles:
1. Default
2. Navigation
3. Thumbnail Control
Categories: Choose the testimonial categories in the drop-down list Limited Testimonial: This option places a limit on the number of shown testimonial Order By: This option handles the display order of testimonials based on Recent First, Older First, Title Alphabet or Title Reversed Alphabet Auto Play: Choose Yes or No
7. Noo Mailchimp
It is one of the shortcodes used to create Home Page Title: Enter a title here Description: Give a short description here
Note: In order that Noo Mailchimp can function properly, you will need to install and activate Mailchimp For WordPress plugin. Then you will paste these codes
into Admin panel> Mailchimp For WordPress> Forms> Fields
8. Noo Partner
Show or Hide Border: Select Show or Hide Limited Post of Slider: Upload Images: Upload Images here Custom Links: Enter link of the images. These links are separated by “Enter” Custom Link Target: the link will be opened in the same window or in a new one Auto Play: Choose Yes or No
9. Noo Countdown
It is one of shortcodes used to create Home Page Choose Date: It is the date on which the countdown will end Title: Enter a title here Description: Give a short description here Button Link: Enter link of the button here Button name: Give a name to the button Image Left: Upload an image that is on the left side Image Right: Upload an image that is on the right side
10. Noo Product
This shortcode is used in building Home page Title: Enter a title here Attach: Enter a short description here Choose categories: Choose product categories in the drop-down list Choose Style: The display style of product categories can be Slider, Grid or Grid Two. Order By: The display order of product categories can be based on Recent first, Older first, Title alphabet or Title Reversed alphabet Limited: This option places a limit on the number of product categories displayed per pageIf you are interested in Slider then the display will be:
If you are partial to Grid style then display of this shortcode will be like this one
If you opt Grid Two Style, you will have extra 3 options: Choose Image: Upload an image Position for image: the image can be on the left or right of the products Link image: Enter link of the image here
11. Noo Custom
This one is used in building Home page 2 Title: Enter a title here Attach: Enter texts here Description: Enter a short description Choose Image: Upload an image Button name: Give a name to the button Button Link: Enter link of the button Position Text: All texts can be on the right or left side
12. Noo About
It is one of the shortcodes used to create Home Page 4 Title: Enter a title here Attach: Enter texts here Content: Give a short description Button name: Give a name to the button Button Link: Enter link of the button Background Image Right: Upload an image that will be on the right side
13. Noo Purchase Custom
This shortcode is used to create Home page 2 Title: Enter a title here Button Name: Give a name to the button Button Link: Enter link of the button here Background Image: Upload a background image here
Woocommerce pages
Woocommerce Pages
After Woocommerce plugin is installed, it creates the following new pages:
Yet if it is unfortunate that those pages are not automatically created, you can do the following steps to build them:
1. Cart Page
• Navigate to Pages > Add New. • Enter Title (Cart), paste this shortcode [woocommerce_cart] into content area of the page
• Opt Default Template in Page Attributes on the right side
• Click on Publish button
2. Checkout Page
• Navigate to Pages > Add New. • Enter Title (Checkout), paste this shortcode [woocommerce_checkout] into content area of the page.
• Opt Default Template in Page Attributes on the right side.
• Click on Publish button
3. My Account
• Navigate to Pages > Add New.
• Enter Title (My Account), paste this shortcode [woocommerce_my_account] into content area of the page.
• Opt Default Template in Page Attributes on the right side.
• Click on Publish button
4. Shop Page
• Navigate to Pages > Add New • Enter title, Shop
• Opt Default Template in Page Attributes on the right side.
• Click on Publish button
