How to add a new object to appear on all variants

If you create a new object, say a text column, a graphic or photo, this is initially not shared across the variants. But if you want to share it use the Utilities  Website variants menu or just right click on it, and select Variants  Share with all variants. If you do not want an item on the page to be shared across all variants just un-select this same option.  Technical note: If you have different variants of photos, say a different size, crop or fill position, then Xara has to create multiple versions of the photo for the published website. However this doesn’t have a significant performance overhead (it doesn’t slow down your website), as the web browser loads the correct version initially, and then, in the background, downloads the other variant images. So this means the initial version you’re looking at (be it mobile or desktop) will always download as fast as it can, but if you change your browser width or orientation, it will instantly switch to the other version.

How to have different text in each variant

Typically you want to share the same content in all your variants, just presented in an optimized fashion for the different widths. So normally text is shared, and that includes not just the words, but the style, color, font size etc.  See below to find out how to vary the text size in each variant. If you want to have different content in any variant, that is not shared, then you can either just create a new text item on one variant - by default this is not shared. Or you can stop sharing an item, including text, by right clicking and selecting Website variants  Stop sharing with variants.  You can’t have parts of the same text item not shared, say just a few words. Either the whole text item is shared (so when you update one, it updates other variants), or the whole text item is not shared (in which case edits appear only in that variant).

LiveShare - how to tell which objects are shared

When you select an object, those that are shared across the other variants have double parallel lines shown in the top right of the selection.   This photo has a double line marker, top right, which indicates it’s ‘live shared’ on one or more variants. You can resize, crop and adjust the fill as required,and that will stay local to each variant. but if you swap the picture, say by dragging a new one on top, then all variants will change.

NavBars. Repeating Objects

It’s likely that you will want a different NavBar design or layout on any narrow variants. NavBars on each variant are independent, so you can customize them as required. You might want a horizontal one for wide websites and a vertical one for narrow devices.