Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
Miscellaneous Features
In Macaw, you can add multiple pages to your project, even duplicating pages so you don’t have to start from scratch. To access most of the options for pages, you need to right-click on a page name in the Pages menu allowing for renaming, deleting, and more (see Figure 12).
)
Figure 12 Add pages
You also have access to form elements that are really useful for mocking up the design of a form. The same formatting options available for text frames are also available for form fields. In the Inspector panel, where you find the formatting for the fields, is also a set of input options for setting a name and type of the fields.
Here’s one interesting note: The form tag is not included in the code that is generated, which makes the form useless when you publish. But people have already figured a way around that using the Outline panel (see Figure 13).
)
Figure 13 Form elements
The Outline panel on the right side of the workspace seems deceptively simple at first. It shows the structure of your page elements and how they relate to each other (parent-child relationships). You can change the relationships of design content by dragging them in the panel, but the hidden power is renaming objects. If you were to create an element on the page using the Element tool (for instance), in the Outline panel you could rename it as UL for an unordered list.
In Figure 14, I created an element on the page and placed it beneath the form elements.
)
Figure 14 Add an element to the page
In the Outline panel, I double-clicked the name of the new div.element object and changed the name to form (see Figure 15). This will be the form element I talked about previously, allowing your form to work eventually.
)
Figure 15 Change tags in the Outline panel
I selected the form elements in the Outline panel and dragged them on top of the form object to nest them within (see Figure 16).
)
Figure 16 Rearrange content in the Outline panel
A few other features are worth mentioning, including the ability to add global styles (see Figure 17) to your content. This is CSS styling you create that can be applied to your content in a number of ways. It can be a great way to maintain formatting consistency across your content and pages.
)
Figure 17 Create a Global Style
Another feature is the Library panel (see Figure 18). When you import images onto the page (or into the Library), a reference to the image is saved in the Library panel. This way you can easily reuse an image elsewhere and keep track of what you’ve imported. The Library panel can also store components. Components are reusable, saved content that you create by selecting content on the page and choosing Elements > Create Component.
)
Figure 18 Work with the Library panel