Text and Images

To add, and customize, text and image elements, open the Content editor and select the Basic Content item.

Select a text/image element and then drag and drop it onto the website page. See Add an Element for more information.

Basic Content

img

Edit text

The text portion of an element is initially created with placeholder text which you will want to customize. To edit the placeholder text, double-click on on the text to open the Edit Content window.

img

Type over the placeholder text and use the toolbar to format the text.

img

Make changes to the text as needed, then click the Save changes button. Click the Cancel button to close the Edit Content window without making any changes.

Formatting Tip

When formatting text, be mindful people will be viewing the website on different sized devices, including phones and tablets, with different sized screens. It is best to avoid using hard-coded font sizes, since what may look big on a high resolution desktop monitor will look enormous on a smaller screen. Instead, use the predefined styles which will be scaled automatically based on the screen size, and to maintain a relative size to each other, without becoming too large.

HTML Editing

If you are familiar with HTML, and web design, you can switch the editor into HTML mode by clicking on the </> icon at the end of the formatting bar of the editor.

This will allow you to add HTML elements (excluding script tags) to the content.

To exit html editor mode, click the </> icon again.

img

Add an image next to text

To add an image within a text block, click the picture icon on the toolbar.

img

The Insert Image window will appear.

Either click Choose Files to browse for a file on your computer, or enter the web address of an online image, that you can use.

img

The image will appear in the Edit Content window. Click the image to see its toolbar.

Use the toolbar to adjust the size and alignment of the image, for example, the Float Right button moves the image to the right of the text.

img

Click Save Changes when finished.

img

Editing Existing Images

To re-open the image specific settings of an existing image to edit, double-click on the image itself.

Last Updated: 6/19/2019, 8:02:23 PM