Work with buttons, images, and shapes
Buttons add interactivity and open a URL that you supply. Images and shapes add color and interest to your site. Uploaded images are available from the gallery for reuse.
Each section has a grid to help you position components such as buttons, text blocks, and tables. The grid becomes visible when you drag a component on a section or reposition it.
image/png
.To work with buttons, images and shapes: open a page by clicking it in the Site pane and click Edit.
The following describe how to:
- Add an image, shape, or button
- Add an image
- Add a shape
- Arrange an overlapping shape
- Delete a button, image, or shape
Add a button
To add a button:
- Hover on the page to reveal the section buttons.
- Click Add Component to open the menu.
- Select Button.
- Drag the button to the appropriate location.
- Click the button to open the component toolbar.
- Click the edit icon.
- Add the link URL and configure whether the link should open in a new tab.
- Click the Button text to change the label.
Add an image
To add an image:
- Hover on the page to reveal the section buttons.
- Click Add Component to open the menu.
- Select Image.
- Drag the image to the drop zone or click the drop zone to browse for the image.
- Click the image to open the component toolbar.
- Click the edit icon.
- Upload an image or select from the gallery of previously uploaded images.
- Enter Alt text for screen readers.
After you upload an image, it is available in the gallery.
Add a shape
To add a shape:
- Hover on the page to reveal the section buttons.
- Click Add Component to open the menu.
- Select Shape.
- Re-size if necessary and drag the shape to the appropriate location.
- Click the shape to open the component toolbar.
- Click the edit icon.
- Select the shape and color.
- Toggle the Stretch button to completely fill the component or have space on each side.
Move a component forward or back
Moving a component forward or back changes its z-index. To move a component forward or back:
- Select a component to open the component toolbar.
- Click the move forward or back icon:
Delete a button, image, or shape
To delete a component:
- Select the component to open the component toolbar.
- Click the trash can icon.
The following describe how to work with: