Submit a ticket My Tickets
Welcome
Login  Sign up
Open navigation

How to Add Images to your Pages (Image Widgets) and Vector Graphics (SVG) Widgets

To add an Image type or Vector Graphic Widget to any section of your pages:


1. Go to Site Builder Edit School Site.

2. Choose the page you want to edit from the Pages Manager.

3. Click on the +icon/Widget and select your desired template.

Galleries Widget

To add a Galleries widget, you can follow the previously mentioned 1-2 steps and then select the Galleries widget. 

To further edit the Galleries settings, click on Edit Media Gallery to adjust the below fields on the right sideform:

  • Appearance: You can display and switch the widget's layout and choose among many templates.
  • Media Gallery: You are able to delete a media item, you can edit the screen options (Change the image, screen type, screen size, and background), add captions to the images, or even re-order the Media items.

Notes

  • Click on the +Add Section if you want to add a Galleries Section. 
  • You can also choose for a Popup slideshow to appear when the Media Gallery is clicked.

Image Widget

To add an Image widget, you can follow the previously mentioned 1-2 steps and then select the Image widget.

  • Image: You can change the image by clicking on the change button.
  • Size: Here you can change the width and heights of the image.
  • Alt: You can also add an alternative text for your image. For more information about accessibility features, you can click here

Illustrations Widget

To add an Illustrations widget, you can follow the previously mentioned 1-2 steps and then select the Illustrations widget.

  • Image: You can change the image by clicking on the change button.
  • Size: Here you can change the width and heights of the image.
  • Alt: You can also add an alternative text for your image. 

Screen Widget

To add a Screen widget, you can follow the previously mentioned 1-2 steps and then select the Screen widget.

  • General: You can change the Screen Type and Size, click on the change button to get a visual depiction, or you can just select from the list of Screen Types. For Screen Size, you can select either Full, Large, Normal, or Small.
  • Background: Choose a background for the screen from Color, Image, Video, Embed, or SVG. Detailed information on the background options, can be found in this article.
  • Overlay: You can choose to set an overlay color and its opacity.
  • Screen Caption: You can also add a Screen Caption, for catchy texts.

Vector Graphics (SVG) Widget

To add an SVG widget, you can follow the previously mentioned 1-2 steps and then select the Vector Graphics widget.

  • SVG Image: You can change the image by clicking on the change button.  You have access to the SVG library where you can choose among more SVG template widgets or add your own from your device. You can also change the Image position and background color.
  • Frame Appearance: Here you can change the Size, Shape, and Opacity of the SVG image.
  • Alt: You can also add an alternative text for your SVG image.


General Note: After adding a widget, you may want to make alterations to the widgets' general settings, actions, and layout settings in the editing Sideform.

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.