THE BLOG

Sign Up

ProPhoto 6.18.0

by Jared HendersonPosted in ProPhoto

Today we’re pushing out a pretty major free feature update to ProPhoto, version 6.18.0. This feature release includes:

  • New “Carousel” gallery style
  • Video backgrounds for blocks
  • Responsive video embed widget
  • Built-in ProPhoto page cache
  • Customizable max-widths for form field elements
  • Performance/speed improvements
  • Bugfixes

Carousel Galleries

New in this release is an entirely new variation of ProPhoto galleries: Carousel. This functionality has long been requested and is the subject of one of our most up-voted GitHub issues.

Carousel galleries constrain images to a single height and line images up side-by-side, allowing more than one image to be seen at once. The current image is always in the center of the carousel, but one or more images to the left and right can be seen, depending on the viewport size and height settings. Here’s an example of what it might look like:

Carousel images are pretty flexible, and support most all of the existing gallery controls and customizations, including fullwindow/fullscreen, dot and thumbnail navigation, and more. The height and some other settings of your carousel galleries are also configurable at responsive breakpoints, to help you dial in the appearance of these galleries at all screen sizes.

Video backgrounds

In your ProPhoto customizer, blocks have a new background option: Video.

Video backgrounds are supported in two formats: videos uploaded to your WordPress Media Library, and embedded from YouTube or Vimeo. Video backgrounds can be used to create effects similar to that from the design Resurrection from our design store, but without any advanced know-how.

With .mp4 files that you upload, ProPhoto has the most control — we can emulate the “cover” behavior of background images with your video, ensuring that your background videos are sized to cover the block no matter the size. With YouTube and Vimeo, we can do almost as good. If your block is set to “window height” ProPhoto is able to keep the video sized just large enough to always cover the full-size of the block, showing as much of the video as possible. If you’re using YouTube or Vimeo and have your block height set to “auto”, the sizing of the video will be an approximation — for these scenarios sometimes uploading the video as an .mp4 is required for best results.

Video Widget

Also new in the video arena is a new video widget type.

We added this widget type as a convenience for embedding videos from services like YouTube and Vimeo responsively — that is, that adapts to look good at all screensizes. By default, the “embed” codes you get from YouTube and Vimeo aren’t suited for responsive websites. So, we’ve been pointing our users to a simple website service called Embed Responsively, which adds some wrapping markup and css to make video embeds responsive. This trick works pretty well, but is a bit of a hassle and generates HTML that is technically invalid, so it’s not 100% ideal. Our new video widget makes this unnecessary, handling all of that for you behind the scenes. Just add a URL from YouTube or Vimeo, and ProPhoto will take care of embedding it in a way that is responsive.

Built-in Page Cache

Another feature we’re really excited about is a built-in ProPhoto page cache. Enabling this new feature should give you some pretty impressive speed gains for your ProPhoto site, especially if you’re on a slow or overburdened shared server that is not performing well.

Page cache works by writing to files on disk copies of the HTML generated by your ProPhoto/WordPress pages. Then, on subsequent visits to your site, ProPhoto checks if it has a static file page cache for that same page, and if it does, it can serve it from cache, skipping vast amounts of work that WordPress and ProPhoto usually have to do to assemble your page from all of your customizations.

To enable page cache, go to “ProPhoto” > “Settings” > “Site Settings” > “Misc”, and choose “enabled” from the ProPhoto Page cache area.

Once it’s enabled, after 1 or sometimes 2 requests to a given page of your site, ProPhoto will start serving cached content, and you should notice a discernable increase in page load speeds.

If you want to double check that your pages are being served from cache, you can view the page source in your favorite browser, or use a tool like Chrome’s developer tools to examine the response headers sent by ProPhoto. When your page is being served from cache, there will be a comment in the HTML markup, and (if you know where to look) you’ll see a ‘X-ProPhoto-Cache: HIT’ header.

Form field widths

Also new in 6.18.0 is the ability to set custom max-width pixel values for individual ProPhoto form elements:

This allows an extra layer of customizability to ProPhoto forms, and is the first of several more form customization features we have in the works.

More Performance Improvements

This release also includes two other significant performance improvements for P6. First we changed our PHP autoload strategy to a more efficient one, which should have a very small but worthwhile effect on the page load speed of nearly every request.

Second, we trimmed out some files that were never being used by producction customer sites which should allow auto-updates to process faster and be less prone to failure.

What’s Next

As always, there’s more gory details including several bugfixes detailed in our changelog.

In addition to all that is in this update, we’re already well on our way to releasing more new features right around the corner — likely within 2 weeks. The next feature release will include most of what’s left in the Sebastian milestone on our Roadmap, including Viewport visibility animation, Leveraging featured images, Copy/paste blocks/rows/columns (hopefully), and more.

Hang with us!