Welcome to our LiveChat! Please press "Start Chat" button to proceed

Start Chat

Introduction to MotoCMS HTML

1. Login Screen and Users Management
2. Welcome screen
3. WYSIWYG editor
  3.1 Main Toolbar
  3.2 Editor Toolbar
  3.3 Tools Panel
  3.4 Properties Panel
  3.5 Editor Preview
4. Menus
5. Pages
6. Pop-ups
7. Widgets

1. Login Screen and Users Management

Every time when the system starts, you will need to enter your username and password to log into the control panel. This is the username and password that you entered during the initial application setup process.

Please use the 'Forgot Username or Password' option to retrieve your login information in a case you need one or both of them. You should provide your e-mail to get the username and new password. If you do not remember your e-mail, please contact our Support Team.


2. Welcome screen

You will see the “Welcome” screen right after the control panel loading process is completed. You will have access to any section of it - Content Wizard, WYSIWYG Editor, Quick Content Editor, Website Preferences and Help&Support.

If you are newbie to these applications, you can use the “Wizard Section”, which provides quick access to the content management functions.

The main and most powerful section is our “WYSIWYG Editor”. You may edit your website pages by dragging and dropping the elements into it. The editing environment contains multiple toolbars and panels to control both: the overall layout and the single element properties. Please use the Main menu to get access to the all functions you have. You can manage your pages by using the main toolbar controls: Add, Save, Remove, Revert and navigate through them using our website section selector. There is a quick access to the preferences dialog window here.

Please use the “Preview Website” button to preview the changes you've made. Controls for the selected object are located on the additional toolbar. On the left editor panel, you can add a new object to the scene. It includes: texts, images, and other objects, animated objects and widgets. The right panel is dynamic and changes depending on the selected object's type. If there is no object selected, you will see "Change page or popup" properties.

The "Quick Content Editing" section is used when you have finished the website building process and would like to update a single data elements, like news, articles, galleries or music. It provides quick access to all parts of the website, so you can avoid going through the whole structure all over again. You can enter this section either from Wizard or from the Main menu.

All website settings can be changed via the “Website Preferences” section. There are also Control Panel Preferences, Media Library and Fonts Manager inside of it.

And finally, the “Help & Support” section, where you will find all necessary documentation and tutorials concerning MotoCMS HTML template and Control Panel, as well as the info for the MotoCMS HTML template version.

Start from previewing your website and then try to make some changes. We really think you'll like it!

The Content Wizard section is created for first time users. It helps you to easily find everything you need for managing your MotoCMS website. It is available from the “Welcome” screen and the “Main menu”.


3. WYSIWYG editor

WYSIWYG editor is the main section of the MotoCMS HTML template's Control Panel (WYSIWYG means What You See Is What You Get - you will get the same result on your website just like you see it within the control panel). It helps you to edit pages with simple drag and drop functions. You can add, edit or remove objects on your page. You can also create new website pages or remove them.

3.1 Main Toolbar

The Main toolbar has all controls needed for managing your website sections. Please use the "Create new page" button to create a new website page. For the quick navigation through the website pages you may use the "Current section" selector. You may also preview pages with it in order to find the page you would like to edit. You may save/discard your changes or remove the whole page using the following buttons:

- The "Revert changes" button reverts all the changes you have made since the last time when you saved the changes.
- The "Preferences" button allows to have quick access to the control panel and website settings fonts' manager and Media Library.
- The "Preview Website" button saves changes and opens your website in a new window for preview.

3.2 Editor Toolbar

The Editor toolbar is located right under the main toolbar and controls the selected objects. It has some useful controls like the "Undo" and "Redo" buttons, "Unlock all" and "Show all" buttons. All of these controls are also available in the Edit tab of the Main menu.

With the "Undo" and "Redo" buttons you can easily go through your changes history. You can also use hot keys for that: Ctrl + Z for "Undo" and Ctrl + Y for "Redo" operations.

The Editor toolbar is activated when you select an object on the stage. Depending on the selected object’s type and its properties, various controls can be placed there.

If the selected object is not a locked one, then the "Visibility Selector" will appear next to the "History" buttons. Using object visibility, you may change its placement. You may also use the next four buttons to arrange objects on the page. Every object is located in a holder (layer) and has it's own position and depth. The holder can be visible on the entire website, only on the layout or on the page and does have a predefined position and animation. Please use the “Placement” menu to place the selected objects wherever you want. To get a better idea of this, try to place one of the objects to different layers and preview the website.

The following six buttons are used to align the selected object on the stage. You can align it horizontally or vertically if needed.

Please use keep the "Aspect ratio" checkbox for controlling the selected object transformations. If it is checked, the object’s width and height will stay in the same proportion.

You can hide the selected object by using the "Hide Object" button if needed. You can also “Lock” the selected object to make it non-selectable. Please use the "Unlock" and "Show all" buttons to unlock or not hide all the objects on the current page.

Snapping to objects feature means that items dragged around will automatically jump to align with the vertices and edge centers of the nearest objects and stage.

3.3 Tools Panel

There is the Tools panel on the left side of the Editor window. With the Tools panel you may easily add new objects to the page. There are blocks, texts, shapes, images, videos and widgets.

In order to add a new object to the stage, just select it from the Tools panel and then click the space you want to place it. Most of the objects are resizeable, so you may not only click, but draw the area where you want the new object to be located. There are some expandable buttons on the Tools panel. You will see more options by clicking the "Video" and “Widget" buttons.

Please use the "Arrow" button to hide this panel, if you need more space for the preview area. Then you can access it with the roll over.

3.4 Properties Panel

From the right side of the Editor there is the Properties panel. You may change the selected page properties, the selected object properties, etc. It changes depending on the situation and has different properties for the page, pop-ups, texts, shapes, images, blocks, videos, widgets. For the full properties list, please refer to the Moto CMS Objects section.

Please use the "Arrow" button to hide this panel, if you need more space for the preview area. Then you can access it with roll over.

3.5 Editor Preview

The main area of the Editor is the website preview. You can select objects using your mouse. Then you can move, resize, and rotate them. You can also use the keyboard arrows for that. You can place any object wherever you want it to be placed or just remove it.

Please do not forget to use the Right click option to pop-up an additional menu that is very useful in many situations.

1. The "Menus" section which can be found at Content menu allows you to edit all the website menus in one place. It can be accessed from the Main menu or when you edit any of the menu modules on the page. There is a menu selector, by means of which you may choose the menu that you would like to edit.

2. You may also create your own menus or remove the unnecessary ones. Just remember that the menu data is used by the menu modules. While adding a new menu, you will be prompted to choose its type. One template may contain several types of menus; one exact module can display the menu of its type only.

3. After selecting the menu, you can see its items below. By clicking on the menu item, you may change its properties on the right panel. Menu properties are different and depending on the menu type. You can link the menu item to the page, open pop-up or an external link. For the external link option you can also select a window type and open it in the current or in a new window. In order to delete the menu object, you need to remove it from the stage as well. If you want to remove the menu from the page, you should delete that module, but you can leave the menu data for the future and use it with other menu objects on your website. You can put one menu item into another to make drop-down menus. The maximum menu depth can be limited by a certain type of the menu. Also, some of the menus have root items quantity restrictions.

5. Pages

The “Pages” section allows you to quickly look through and edit your page properties. You can view all pages by following Content - Pages.

All pages can be reviewed on the left. You can also change the order of the pages and group them here. You can drag them, changing the order and grouping them the way you need. By selecting the page, you will see its preview on the right. You may change all the page’s properties there - the page title, icon, redirect features (click action) and keywords and mark the page as "No follow".

The page’s title is displayed in the browser's title bar when a current page is opened. It is also an output to the page’s title tag in HTML and is important for search engine optimization.

6. Pop-ups

The “Pop-ups” section allows you to quickly look through and edit pop-up properties.

All pop-ups can be seen on the left. By selecting the pop-up, you may see its preview on the right. You can change all pop-up properties here: a pop-up’s name, title, URL, description and keywords, password protect, mark a pop-up as "Do not index" or "Do not follow".

The pop-up name is an internal value, which is used to identify certain pop-ups in the control panel.

7. Widgets

You can find all the necessary components of your website and update them here without searching for a certain page.

You can also name each of the website modules. These names will help you to easily find any of modules within this section.

Some certain types of modules are not the content modules, and they can be found on the website pages only.

On the left side of this window you can find buttons for a quick navigation within the menu, pages or website pop-ups.

Have more questions? Submit a request