Page 441 - Xara Web Designer Premium

Website Widgets 441

Copy the code from the widget provider to your system clipboard, just as you copy text in
a word processor. Sometimes the widget provider may even provide a ‘copy’ button
which copies the code for you.

Then in Xara Web Designer Premium go into the SELECTOR TOOL and then do a normal
paste operation (Ctrl+V). You’ll see that Xara Web Designer Premium recognizes the
HTML code and immediately starts to render a placeholder image, just as it does when
inserting a widget from the ONLINE CONTENT CATALOG. The placeholder appears on your
page, usually with the most appropriate size for the widget. You can then preview your
page to see your working widget!

You can also paste widget code into both the head and body of your page using the
Placeholder tab (on page 317) of the Web Properties dialog.

NOTE: If you are in the TEXT TOOL when you paste the code, it will be pasted as text
instead of producing a placeholder! And once you’ve pasted the contents of the clipboard
as text once, it will continue to paste as text even if you switch to the SELECTOR TOOL and
paste again. If you get into this position, return to the widget website and copy the code
again. Then do the paste while in the SELECTOR TOOL.

Adding a Cookie Consent banner

Adding a cookie consent banner to your website is easy.

Most third party applications for creating Cookie consent banners allow you to create and
customize a banner and then generate code for you to paste into the HTML head of your
web document. You can do this using the HTML CODE (HEAD) button on "UTILITIES" > "WEB
PROPERTIES" > "WEBSITE" tab.

Follow the guide at help.xara.com https://help.xara.com/article/446-adding-a-cookie-
consent-banner to learn more.

Resizing widgets

You can resize the placeholder images for MP4 movies and animated GIFs to similarly
resize the content as it appears on your page, because this type of content is scalable.
Most of the Locally Editable Widgets are also resizable, but some are not and won’t allow
you to drag the resize handles of the placeholder image.

Some Web Editable Widgets will allow you to resize them even though the widget
content won’t scale. For these widgets the placeholder object merely determines the
bounds of the area in which the widget can render, so making the placeholder too small
for the widget will mean that the widget gets cropped in your web page. The placeholder
image gets regenerated whenever you resize it, so it will reflect any cropping of the
widget too, as shown in this example.