Post on 17-Jun-2020
transcript
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
help@rootways.com
MEGA MENU PRO
USER GUIDE
Version 1.0
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
Table of Contents
1. Introduction…………………………………………………………………………………... 3
2. How to use and configure……………………………………………………………………. 5
2.1 General Settings….............................................................................................................. 5
2.1.1 Top Menu Design………………………………………………………………….. 7
2.1.2 Vertical Menu Design……………………………………………………………… 8
2.1.3 Implementation code……………………………………………………………… 9
2.2 Mega Menu Management………………………………………………………………... 9
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
1. INTRODUCTION
Rootways Advance Mega Menu extension is your solution to create the best site map right
on the main navigation bar of your website. Using mega menu you can display categories
upto 4th level, you can also display content, images, products, contact form, header and
footer in your website's main navigation.
You can also display vertical navigation on any page. Rootways mega menu has more
than 15 layouts of mega menu; you can set any layout for specific category. Rootways
mega menu is flexible for mobile, tablet and all responsive screens. Without touching
HTML and CSS you can modify mega menu layout from admin settings. You can set
different layout and menu type for top menu and vertical menu.
Create Professional looking Magento Navigation Menu. All your categories and sub-
categories are easy to find with this extension. Add featured content in Navigation menu
with Right/Left CMS block. Promote products/services with Add to cart feature directly in
navigation menu.
Display 3rd level of categories in attractive Pop up style. Select font color, Background
color, and Active menu font color with easy options from admin. No need to learn HTML
and CSS. Very User friendly and easy to install. It doesn't affect your site speed.
Check out the features below:
Features:
Display Mega Menu both horizontally & vertically.
15 different types of Mega Menu.
Manage design of Mega Menu from Admin.
Add Vertical menu on specific page.
Just select mega menu types and change mega menu layout.
Full and half width menu.
Add category image icons.
Manage height and width of category image icon.
Set number of columns in dropdown menu.
Add header and footer text for menu content part.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
CMS static block within Mega Menu.
Add products to cart directly from the menu.
Display Products in Top and Vertical Menu
Easily manages Position of Content, Number of Columns, and Category Image Size.
Hide or show specific category from mega menu.
Choose to show home icon or not.
Vertical Tabbing menu reveals products on hover effect.
Contact form in menu. Form is submitted using Ajax without reloading page.
Easy to Install, Configure and Use.
Responsive
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
2. HOW TO USE AND CONFIGURE
This section will show you how to configure Rootways Mega Menu Extension and how to
use different layout with different categories. It's very easy and fast!
You have to manage Mega Menu from two places, first one from Configuration setting and
second one from category section.
2.1 General Settings:
This section will show you how to manage Mega Menu from Configuration settings.
Log in to Admin Panel and then click SystemConfigurationRootwaysRoot (Left
sidebar) Mega Menu.
Below is the Screen shot for Mega Menu Settings and also the detailed description of
each setting.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
Enable: Enable/Disable Mega Menu Pro using this setting. If it’s enabled then only you
will be able to see the Rootways Mega Menu Pro in front side. Disable it to set default
Magento Menu.
Domain Mode: Choose appropriate Domain Mode, if you're site is in development then
select 'Development' or select 'Live'.
Domain: Add the Domain name that you entered when you purchased Rootways Mega
Menu Pro extension.
License Key: Enter the License Key that was emailed to you by Rootways Shop after the
purchase of Mega Menu Pro.
Show Contact Form: Select 'Yes' if you want to include Contact Form in your Mega
Menu Pro.
Contact us CMS block: If you have selected above Show Contact Form option as 'Yes',
you need to select the CMS block to add in this option.
Top Menu Alignment Type: Choose Alignment of Top Menu as Left, Right aligned or
you can choose Fit to Screen to display the top menu in a line fit properly to screen.
Vertical Menu Dropdown Type: For Vertical Menu choose from where you want to
show the sub-category dropdown as 'Top' or 'Relative'.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
2.1.1 Top Menu Design:
Top Menu Design: All the CSS and Style related settings for Top Menu can be
controlled from here such as Active Menu Font color, Header Font size, Vertical,
Tabbing Menu and simple dropdown menu type's style settings.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
2.1.2 Vertical Menu Design:
Vertical Menu Design: All the design and style settings for Vertical Menu are controlled
from here. You can customize the vertical menu according to your wish.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
2.1.3 Implementation Code:
After successfully installing and enabling the Rootways Mega Menu Pro extension,
you will see that your current menu is replaced with Rootways Mega Menu Pro. If
you want to display vertical mega menu in any page, move this code into your
pages.
$this->getChildHtml ("rootways_vertical_menu")
2.2 Mega Menu Pro Management:
This section will show you how to manage Mega Menu Pro from category section. Go
to AdminCatalogManage Categories. Over there you can see Top Mega Menu
and Vertical Mega Menu tab is created using this extension.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
Top Mega Menu:
Mega Menu tab from category section has options to display Menu as per your
requirement. When you first open Mega Menu tab of any category and there is no
option of "Menu Type" selected, at that time you can see only 'Menu type' option
under Top Mega menu tab.
Note: You must select 'Menu Type' option under Mega Menu tab with each and every
main category of your website. No need to select the sub categories of main category.
There are 15 Menu types to choose from for your Top Mega Menu. Below is their
overview:
Simple Dropdown
Half Width
◦ Only Links
◦ Links with right block
◦ Links with left block
◦ With sub category
◦ Sub category with right block
◦ Sub category with left block
Full Width
◦ Only Links
◦ Links with right block
◦ Links with left block
◦ With sub category
◦ Sub category with right block
◦ Sub category with left block
Tabbing Menu
Products Only
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
- Simple Dropdown:
This is simple dropdown menu, with this menu you can see tree of categories with 4th level
of categories that means it expands to sub-sub-sub categories.
Below is the preview for Simple Mega Menu from Front End.
- Half Width:
There are 6 different menu types in half width size. With all these menu types you can add
category image icon, header and footer text for featured content in menu drop down, custom
CSS class for customization.
Below are the menu types with their front-end screen shots.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
1) Half width-Only Links:
This menu type size is half width and you can display only links in it.
2) Half width-Links with Right Block:
Using this menu type, you can show links and a right CMS block directly in the
menu drop down.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
3) Half width-Links with Left Block:
This menu type is similar to the half width links with right block just the position of
CMS block is on Left side in this.
4) Half width-Sub categories:
In this menu type, you can display sub categories and their links in Half Width.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
5) Half width-Sub categories with Right Block:
If you select this menu type, you can add CMS block on Right side with Sub-categories
and their links.
6) Half width-Sub categories with Left Block:
This menu type is similar to the half width sub-categories with Right block just the
position of CMS block is on Left side in this.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
- Full Width:
There are 6 different menu types in Full width size. With all these menu types you can add
category image icon, header and footer text for featured content in menu drop down, custom
CSS class for customization.
Below are the menu types with their front-end screen shot.
1) Full width-Only Links:
This menu type size is Full width and it can be used to display only links in menu drop
down.
Below is the front-end screen shot of full width-Only Links menu type.
2) Full width-Links with Right Block:
Using this menu type, you can display links in full width with a Right CMS block
directly in menu drop down.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
3) Full width-Links with Left Block:
This menu type is similar to Full width-Links with Right block, just the position of the
CMS block is on Left side.
4) Full width-Sub categories:
Use this menu type to show the sub-categories with their links and in the Full width
size. Below is its screen shot:
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
5) Full width-Sub category with right block:
This menu type is full width in size and you can display sub categories and its links as
well as CMS block on right side of menu drop down.
6) Full width-Sub category with Left block:
This menu type is same as the above described menu type, just the position of the
CMS block is on the Left side in this one. Below is its screen shot:
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
- Tabbing Menu:
It displays Mega Menu feature with vertical tab of category. This is an extra ordinary feature
of Mega Menu ever used with Magento Websites.
- Products Only:
This Mega Menu displays Products only. It can be used to feature Best selling Products,
Products with Special offer.
User is redirected to Product detail page or Product can be added to Cart directly from mega
menu. (Only simple Product can be add to cart)
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
To display Product under 'Products only' Mega Menu just create Category with any name (in
given example we take Best Seller) then add products under this category and select Menu
Type="Products only" and you can see all products in Mega Menu under this category.
Note: All these menu types can be added in Vertical Mega Menu also. To manage Vertical Mega
Menu go to Admin->Catalog->Manage Categories->Vertical Mega Menu
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
Responsive Layout of Rootways Mega Menu
Responsive Layout of Rootways Mega Menu is adaptive to all screen resolutions
whether it is Mobile or Tablet.
Have a look at some of the screen shot of Responsive Mega Menu.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
User Guide for Rootways Mega Menu Pro Extension
2017 Rootways Inc. All Rights Reserved.
That's how easy it is to use Mega Menu Pro by Rootways. Please contact us for any queries
regarding Magento and custom web-development of Ecommerce websites.
Our Website: https://rootways.com/
Our Shop: https://rootways.com/shop/
Email: info@rootways.com
Phone: 1-855-766-8929
Our team is working on the newer version of Rootways Mega Menu Pro with an extra ordinary feature that you've never seen
with any extension!!!
------------------------- THANK YOU -------------------------