Files & Images

With YOOtheme Pro you can easily manage images, files and links as well as access the Unsplash image library with thousands of free images.

YOOtheme Pro seamlessly integrates the WordPress Media Manager and Link Picker. Images are resized automatically, and responsive images are auto-generated. YOOtheme Pro also offers lazy loading images for a high PageSpeed score and gives you access to Unsplash – an extensive library of free high-quality images.


Images

Image fields open the Media Manager and show a preview of the selected image. An external URL to an image can also be added directly in the field.

Image field

Width and Height

By default, a selected image is constrained to the container width. But there is also an option to set the Width and Height of an image.

Setting Description
None The original size is preserved.
Width or Height The image is resized, and the original proportions are preserved.
Width and Height The image is resized and evenly cropped to the new proportions.

Resized images are saved in the theme’s cache folder yootheme/cache. You can clear the cache folder to resize all images again.

Note Images are only generated if the GD module is activated on the web server.

Responsive Images

YOOtheme Pro generates up to six srcset images: 768px, 1024px, 1366px, 1600px, 1920px, 200%. The browser will automatically load an image which best fits its viewport and screen resolution. It's recommended to use a large image and set a smaller width or a height. This allows YOOtheme Pro to generate a high resolution image (up to 200%) for retina displays.

Next-gen Image Format

If enabled, YOOtheme Pro also generates all images in a WebP format and serves them to all supporting browsers including Chrome, Firefox and Edge. Other browsers will get the original JPEG and PNG formats. The WebP format has superior compression and quality characteristics compared to JPEG and PNG images. Images will load much faster and consume less cellular data. Enable the WebP feature in the Advanced settings of YOOtheme Pro.

Lazy Loading

If enabled, YOOtheme Pro only loads images as they enter the viewport. This speeds up page loading times and decreases traffic. Enable the Lazy Loading feature in the Advanced settings of YOOtheme Pro.


Link fields allow you to pick either an internal link with the native WordPress link picker, or a file with the Media Manager. You can also manually enter a URL, for instance, an external URL.

Link field

The WordPress link picker opens in a modal with a searchable list of posts and pages.

Link picker


Media Manager

The Wordpress media manager is seamlessly integrated into YOOtheme Pro and opens every time you want to pick an image or a file. It allows you to upload and manage files and images. Learn more in the official WordPress documentation. Additionally, YOOtheme Pro extends the WordPress media manager and adds a tab to browse the Unsplash image library.

Media manager


Unsplash Library

YOOtheme Pro integrates Unsplash – an extensive library of free high-quality images. Open it by clicking the Unsplash tab in the media manager. The navigation allows you to browse through photos, collections and users.

Unsplash library

When you click a photo, the media manager closes, and the photo will be shown in your layout. Note that the photo is externally linked and not downloaded to your server yet. When saving the layout, you will be prompted to choose to either download all the Unsplash photos used in this layout or to discard them. This way you can try out as many photos as you want till you finally find your favorite one.

According to the Unsplash license all Unsplash photos can be used for free, including commercial purposes, without asking permission.

Note Only users with an active Developer subscription have access to the Unsplash Library.

Photos

By default, the Editorial photos from Unsplash are shown. To search for a specific photo, start typing into the search field, and the list of photos will update instantly. Hovering the photo will show a link to the user's profile on the Unsplash website and a View Photos link which opens the photos and collections of this user in the media manager.

Collections

By default, the Editorial collections from Unsplash are shown. Start typing into the search field, and the list of collections will update instantly. The topic, the curated user and a number of photos can be found in the bottom of each collection. Clicking the user name allows you to see the photos and collections of this user directly in the media manager.

Users

By default, the YOOtheme user is shown. Clicking the user will show theme-specific collections from all YOOtheme Pro themes.

YOOtheme collection

YOOtheme Pro