On this page

Ever wish you had a library built-in to the Zipify Pages app that contains all of your uploaded Images and GIF files so that you can easily use them in your pages and blog posts? Well your wish has been granted! Introducing the all-new Image Library for Zipify Pages 📷 🎉 

This functionality allows you to upload Images/GIFs and then easily re-use them on your Pages and Blog Posts from the library without needing to upload them again later. To use it in a page/blog post just click into an Image element within a block and select your image or GIF from the Library! 

Working with Settings > Image Library

By navigating to the Settings > Image Library section of the app, you're able to do the following there:

  • Upload new Images/GIFs from your computer
  • Create Categories of Images/GIFs
  • Manage existing Images/GIFs

If you already have existing images added to your Image Library through the page builder, then you will see them listed there under the "All Images" category:

Using the Filtering options, you can filter by:

  • Recently Added
    Default state. It is also applied when moving from one Category to another, no matter which filter was applied before.
  • Recently Used
  • Most Used

*Note: For Used, we consider the Usage in the app, no matter whether it is a published page, blog article, template, etc or not.

Upload a new Image/GIF file from your computer

Click the Upload button and then select the file from your computer. Either double-click on the file or click on it, then click the "Open" button to initiate the upload process.

Note: The Image Library supports the following file types only:

  • JPG / JPEG
  • PNG
  • GIF

The MAX file size supported for Images is 5 Mb and for GIFs is 6.5 Mb

*Note: larger image/gif file sizes may decrease page load speed. It's recommended to use light-weight images when possible.

Create a new Category

You can create new Image Categories for organizational purposes! The number of new categories you can create is unlimited.

There are 2 ways to create a new Image Category:

  • Using Existing Images already added to the library
  • Making a new Category from scratch

*Note: Images can also be added to existing categories as well if you have any.

New Category from existing images in the Library

Select the image(s) you want added to a New/Existing Category

  • Click the "Select All" link to select all images at once
  • Click the "Deselect All" link to deselect all images at once
  • Multiple different images can be selected by clicking on them
  • To select a Range of images, click on the first image, hold the Shift key on your keyboard and then click on the last image

Once your image(s) have been selected, click the "Add to Category" button.

  • Select "Create New Category" from the dropdown to create a new category
  • If you already have a Category created that you want to add images to, select the Category Name from the dropdown instead
  • If it's a new Category, enter in the name into the "Category Name" field
  • Click the Confirm button

Depending on the action chosen, the new Category will be created or the selected images will be added to an existing category:

* Note: Image(s) from one category can be added to other categories as copies well.

By clicking on the "More Actions" menu, the following options are available for the Category:

  • Rename
  • Delete Category

Note: If "Delete Category" is chosen, only the Category itself will be deleted. Images from the Category will still be available in the Image Library.

New Category from scratch

Click into the "Categories" section and then click the "New Category" button:

Enter the new Category Name and then click the "Create" button:

Your new Image Category will be created. From there, you can either:

  • Upload new images to the category or you can
  • Add existing images from the Library

...by clicking on the corresponding button:

Deleting Images from the Library and/or Categories

When you delete an image(s) from the Image Library, it still remains stored in our database so they can be served up on any published pages where you might still be using them.

When deleting an image(s) from a Category, you have the following 2 options available:

  • Remove Permanently → delete both from the Categorie(s) (including other categories where this image is present) and from the Library
  • Delete from Category → delete only from the particular Category

Flow Diagram of Deletion process:

Exceptions

The following images are not added to the Image Library:

  • Default images from the Templates
  • Product images from Shopify
  • Favicon image from the Settings > General tab
  • Open Graph image in the publish/update page dropdown

Uploading and Changing Images in the Page Builder

To upload an image to the Image Library through the page builder, click on an Image element within a page block and then click the "Upload" button from the image library popup to select your image/gif file from your computer.

Note:  The image library supports the following image types only:

  • JPG / JPEG
  • PNG
  • GIF

The MAX file size supported for Images is 5 Mb and for GIFs is 6.5 Mb

*Note: larger image/gif file sizes may decrease page load speed. It's recommended to use light-weight images when possible.

Note: The fastest way to add multiple images is to click the "Change" button after uploading an image and then click the "Upload" button again. That will allow you to quickly select another image to upload, then repeat that process until you've loaded your library with the images you want included: 

Working with the Image Library in the Page Builder

When adding a new image to your page, you can select from "All Images" from the Library (default) or from a particular Category you've created through the dropdown menu:

Images can be filtered using one of the following presets:

  • Recently Added Images
  • Recently Used
  • Most Used

Image Cropping functionality has been extended and includes presets for popular aspect ratios as well as a "Free" mode to crop it the way you'd like to. You can also Rotate the image clockwise or counterclockwise as you see fit: 

You can apply Shape, Size and Border settings to your images before adding them to your page. Shape settings are separated from Border settings for better flexibility:

Images can be removed from the Library if no longer needed by clicking the delete button: 

Additional Notes and Features

The most important change is that we are now storing the original image when it's loaded to your Library. This means that you will always work with the unaltered image when selecting it from Library for use in a page/blog post.

This also allows us to create a set of optimized images (in different resolutions) in our back-end and automagically use the most optimal one for each screen resolution. This is the key to better page load speed. 

Images added to your pages from the Library also employ a Lazy Loading coding technique which defers the loading of off-screen images resulting in improved page load speed.

All new features described above are only available for images which have been added via the Library. To take advantage of the new functionality, you will need to re-add non-library image(s) into your existing page(s), otherwise it will continue to use the existing image with no optimizations and no access to the new crop/rotate interface. The Image Library was added to Zipify Pages in January 2019, so this only applies to our users who have been using the app since before then.

Did this answer your question?