The media library

The media library contains the images and fonts you use in the designer.

Where: The Media panel in the designer (⌥6). The library also opens from Choose image and from the Logo field. In the admin it opens from a category's image field, see Categories.

You upload product images on the product, not here. See Products.

#Formats and limits

The storefront picks the copy that fits the screen. When the copies exist, visitors never get an original wider than 2048 px.

#Upload

1. Open the Media panel.
2. Press Upload file.
3. Choose the file.

The file shows first in the list. The filters All, Images and Fonts show all files, images only or fonts only.

#Use an image

The line above the list says what a click does:

• In the Media panel: a click puts the image on the selected section. Without a selection, the click copies the image's address.
• From Choose image or Logo: a click fills that field.
• From a row of a Categories section: the picture applies to that category in that section only.
• From a category's image field in the admin: a click picks the picture. It is saved when you press Save. A file you upload there belongs to the workspace, not to one storefront.

#Use a font

A font has the Copy URL button. Paste the address in place of COPIED-URL:

@font-face { font-family: "Brand Sans"; src: url("COPIED-URL") format("woff2"); }

The storefront's policy loads fonts only from the media library. A font from another address loads neither in the storefront nor on the canvas. See Your own CSS and head code.

#Alt text

1. Hold the pointer over the image.
2. Press Edit alt text.
3. Type what the image shows.
4. Press Enter to save, or Esc to cancel.

The alt text comes with the image when you choose it for a section. Screen readers read it. The publish dialog warns about images without a description.

#Delete a file

1. Hold the pointer over the file.
2. Press Delete asset.
3. Press Delete in the Delete this asset? dialog.

BunStack removes the file and its copies.

Warning: Sections that use the file's address show no image after the deletion. Open Preview and check the pages afterwards.

#Errors