Page 510 - Xara Designer Pro X17

510 Web Graphics and Websites

Border
Add a border to the panes of your menus by entering a border width in pixels.

Animation
By default menus will open instantly, but here you can choose to have the menu
animating as it opens.

Transparency
You can choose to have your menus semi-transparent, so that your page can be seen
through the menu panes. Enter the level of transparency you would like as a percentage.

Horizontal offset / Vertical offset
You can offset the menu panes horizontally or vertically from the buttons. Just enter the
number of pixels of offset required.

Updating your NavBar across all pages
As described above, if you have the SITE NAVIGATION BAR option turned on for a NavBar
then all changes that you make to the bar on one page are automatically applied to all
the other pages too, including the location of the bar on the page.
However if you don’t have that option turned on, set the navigation bar object to be a
repeating object (right click and choose "REPEATING OBJECT" > "REPEAT ON ALL PAGES")
that appears on every page and all changes you make to any instance of the object
automatically update on all pages.

See Repeating objects (on page 109) for more information.

On canvas editing
You can edit your button labels directly on the canvas using the TEXT TOOL. Just
go into the TEXT TOOL and click in the label text to start editing it. You can also
change the button links directly on canvas – just click on a button in the
SELECTOR TOOL and then click EDIT in the link pop-up that appears.
All changes you make to the NavBar are automatically applied to the other copies of that
bar on other pages.
Changing the font on NavBar buttons

You can change the font used for the button labels on a NavBar easily. Select the bar by
clicking on it. Then go into the TEXT TOOL and select from the font list on the left of the
TEXT TOOL INFOBAR. As you move the mouse pointer over the different fonts in the list,
the NavBar updates immediately so you can see how that font would look. Select the
required font. If your bar has a mouseover state, it is also updated to use the same font.

Similarly you can change the size of the font using the font size control which is next to
the font selection list.