Support and Documentation

Images

Images (sometimes also called Web Images) are visual assets that enhance all Brightspot sites, and are used on nearly every page. Brightspot offers a shared image library, plus the ability to upload one-off images — images that are not shared to the library.

Here’s an overview of the most important fields on images and what they do.

Internal Name: This is the user-friendly file name for the image. This is what displays along with the image when the image is searched in Brightspot. (Note: this does not have to be unique, the uniqueness is enforced by Brightspot’s assignment of a unique ID to this object.)

File: Brightspot supports the addition of a file via a user’s local storage or by a URL. This is the only required field on an image.

Alt Text: The alt text defaults to the filename if the user does not provide an alt text.  There is an ability to overwrite this field. This descriptive text is used to power front-end screen reader functionality. Alt text is important for 508 compliance. The alt text appears in a blank box that would normally contain the image if the image does not display.

Caption: Image caption is used to maintain a caption describing the image when it is used inside an article, gallery, or promo modules. The caption field has a small rich text editor that can be used for simple formatting and hyperlinks. If an image has IPTC (Description/Caption) or EXIF (ImageDescription) metadata available, this field will be automatically populated with that text, and a user has the option to override this text.

Credit: Credit is used to maintain a credit of the image, and also includes a small rich text editor. Similar to Caption, if an image IPTC (Credit Line) or EXIF (Exif.Image.Artist) metadata available, this field will be populated with that text, and a user has the option to override this text.

In addition to the fields above, images also include fields for Source and Copyright Notice, which will also autopopulate with IPTC and EXIF data if available. There are also additional fields available for applying metadata to an image, including Tags, Date Taken, Date Uploaded, and Keywords.

Image Editor

The image editor in Brightspot provides the ability to set focus points, rotate, flip, adjust color, and manually adjust specific sizes for an image. Brightspot applies these changes to the front-end display of the image without ever altering the original image file that was uploaded.

Some of the key editing actions a user can take on an image are:

  • Setting Focus Points: An image’s focus point is the ideal vertical and horizontal center for an image. The image editor in Brightspot allows users to set a default focus point that all image sizes, used on the front end of the site, will be centered around. Additionally, a focus point can be set for a specific group of images that share similar aspect ratios. Brightspot provides Landscape, Portrait, and Square groups by default, but these groups may be customized as needed.

  • Rotate and Flip: The image editor allows a user to rotate or flip an image. Images can be rotated clockwise or counter-clockwise and flipped vertically or horizontally.

  • Color Adjustments: The image editor allows a user to make simple color adjustments to an image. The brightness and contrast of an image can be adjusted using sliders. Sepia, Invert, and Grayscale filters are also available.

  • Sizes: The image editor provides previews of how an image will appear in the different image sizes that are used on the front end of a site. It also allows a user to override the default or set focus point on an image and manually adjust these specific image sizes.

  • Additional Information: The image editor provides some additional information about an image that may be helpful. To view this information click on the icon that appears in the top-right corner of the image. These include:

    • Source Data: Displays metadata from the source image file, such as original height and width, resolution, and date taken. The available metadata depends on the device or application that created the image.

    • Original Image: Links to the original image that was uploaded to Brightspot and saved in the content delivery network.

    • Resized Images: Allows a user to view a preview of images in every possible size with a link to view and download the image at the selected size.

Uploading Images

After adding images to Brightspot, users can then repurpose those images in articles, galleries, and modules. A user can upload images to Brightspot from a local computer or link to existing images using the URL.

Images can be uploaded from the dashboard using the Bulk Upload widget, from the Image Edit Page, or by dragging and dropping them from the user’s desktop into a Rich-Text Field.

  • From Bulk Upload: To upload images using the Bulk Upload widget, a user can drag and drop images from the desktop into the widget, and the upload will begin automatically. This can also be done by opening the user's local file structure and selecting images.

  • From an Asset Page: To upload images from the Image Edit Page, a user can similarly either drag and drop an image into the asset or open local storage and begin the upload.