Using Style Wizard in the Monkey Business Editor
The Editor Style Wizard
The editor's Style Wizard is the most powerful tool for working with content in the editor. With the Style Wizard, you can perform precise content editing operations, style and design content to perfection, and do it all in seconds.
Launching the Style Wizard
To open the Style Wizard, in the editor, simply click the Style Wizard toolbar icon, or use the keyboard shortcut ( ALT-W ).
The Style Wizard User Interface
The Style Wizard is divided into 3 main sections:
The Targeting Screen
The Targeting Screen displays Selectors for the elements in your composition.
Each Selector represents an element, and provide you a way to Select & Target it, so you can design and style it. This is particularly useful for elements that are otherwise invisible on the screen.
Click anywhere in the editor and the Targeting Screen will be updated with selectors for the elements in that location in your composition.
Moving your mouse over the selectors will display a Target Preview Outline for the content the selector represents.
Click any of the selectors here to select, and target it for Styling or Editing. Selected content are encased within the Target Selection Outline.
The Actions Screen
Once you make a selection, the controls here allow you to perform precise Editing operations, such as copy, paste, delete, and creating new content containers, before or after selected content in the editor.
Move your mouse slowly over the controls here and a helpful description of the tool will be displayed.
The Styling Screen
Once you make a selection, the controls here allow you to design and style, quickly and precisely. You can use our Style Presets or dial in your own Custom Styles.
Using Style Presets
Use Style Presets for quick design and styling operations. We have a wide range of Presets for everything from Texts to Animations. Simply select a Preset Group, and click any preset to apply it to the selection. Click again to undo.
Using Custom Styles
Switch to the Custom settings screen to make precise custom style changes.
With Custom Styles, you can easily change
- Text - font size and line-height
- Colors - text and background color
- Background - image
- Dimensions - width and height
- Paddings - left, right, top, and bottom
- Margins - left, right, top and bottom
- Borders - size, style and color
- Outlines - size, style and colors
- Shadows - for text and box containers
- Classes - add new dynamic style classes on the fly..
Watch & Learn