jQuery UI Dialog - Animation

Placing Image, Text, and Shapes

Using the drop downs from the Page Designer toolbar, place an Image box (shows as a blue box), a text box (shows as a box with Lorum Ipsum placeholder), or a shape box (shows as a gray box) on the page. Each drop down has multiple selections.


Once an object is placed on a page, click to select it for moving, resizing, and formatting.


Select Images to place in an image box

  • Click the right side Images button to access available images from the Image Library.
  • Images must be in a Portrait or Activity category.
  • Use the drop down menu to select an image category.
  • To place a single image, drag it from the Image thumbnails and drop it onto an image box (blue) placed on the page.


Moving and Resizing Elements

To move an element

  • Click on or mouse-over the box
  • Your cursor becomes a 4-headed arrow
  • Click and drag your mouse to move the box

To resize an element

  • Click on or mouse-over the orange handles around the outside of the box
  • Your cursor becomes a double arrow
  • Click and drag your mouse to resize




Zooming / Cropping Images

Once an image is placed, it can be manipulated using the formatting tools. Formatting does NOT modify the original image. Any image effects are only active on the current page.


To zoom in or out on an image

  • Double click on an image to activate the zoom slider
  • Slide the bar left or right or click on the plus and minus icons
  • Click the red circle X to close the zoom/crop tool or press the ESC key

To crop an image

  • Double click on the image to highlight it.
  • Click again and hold the mouse button to make a 4-headed arrow.
  • Click and hold the mouse button to drag the main colored portion of the image into focus. The grayscale portion is cropped (shown here in yellow highlight).

Use the zoom/crop in combination to get exactly the part of the image you want to use.


UNIFORM SIZED BABY PORTRAITS - Use the zoom feature to increase the face area of baby photos and crop feature to remove extras like high chairs, baby gates, additional siblings.

ABSENT STUDENTS - Use with students who were absent for portrait day. Zoom / crop a selected candid to manually drop into their class portrait page.




Have more questions? Submit a request