Photoswipe galleries, a new file manager and improved themes

Christmas is so very nearly upon us, but still the Publii team are hard at work like Santa's elves, adding the finishing touches to the latest beta release, which coincidentally is now available! Tucked away in this release is a new gallery feature, a completely revised file manager, plus some pretty awesome new customizations for experienced users including script embedding.

In keeping with tradition, allow us to say: if you're just looking to get started with the beta and want to find all the new things for yourself, you can grab the latest Publii package from the frontpage and it will get you updated. Otherwise, stick around and learn what gifts the Publii team come bearing...

Galleries powered by Photoswipe

How many photos did you take today? Since we no longer have to run around with an oversized polaroid camera to get instant photos, they've become a sort of language all their own. If photos are an important part of your site, you'll appreciate the new gallery feature added to Publii in this beta.

Publi Gallery based on Photoswipe

Gallery Settings

Gallery pages are created using Photoswipe, a Javascript solution that has the key qualities that the Publii team look for in a feature. Speed is one such aspect; Photoswipe supports lazy loading of images, preloading thumbnails as placeholders, and when things aren't working as fast as they should, a loading icon to let users know that things are still working behind the scenes.

Otherwise, it's got the features you'd expect from a site gallery; touch-enabled controls allow for easy browsing and zooming on smartphones and tablets, and there's options for setting the number of columns, enabling share buttons, inserting image alt text and captions and plenty more. You'll find the insert gallery button in the Publii WYSIWYG editor. while the advanced options can be found in the theme advanced settings accessible from the left sidebar.

Gallery live preview

In the next release, we will add the option to choose gallery style, you will be able to have a grid or masonry pictures layout.

File Manager Tool

Convenience is a big part of Publii, and the new file manager introduced in this beta will make dealing with your files easier. In the file manager you can see all of your website's files, as you would expect. When clicking on a file, Publii will open the file for in your system's default software e.g. if Sublime Text is your default program for opening CSS files, then clicking on a CSS file in the File Manager will open it in Sublime Text automatically. 

Publii fles manager

The File Manager can be found in the Tools section of the Publii interface. Also, since the .htaccess editor was added purely for modifying a single file, it will be removed from the Tools section; f you need to modify the .htaccess in future you can do so via the file manager.

Theme loading and aesthetic updates

The theme provides the backbone of your site aesthetic, so it's important that it is as fast and smooth possible. For this beta release we have updated all of our themes with a new version of the lazysizes script (which controls lazy-loading of images) and optimized the image-loading process so that a smaller, quick-loading version of each image is loaded first so the user get to your content quicker, then the large version of each image is loaded as the user scrolls down the page.

Additionally, some themes such as TechNews or Taste had a issue with page reflow; that is, the page would move content around as each element was loaded, so it looked like the text or other elements were jumping around as the individual parts loaded and resized. To fix this, an aspect ratio was added to the image container, so the page will no longer need to resize elements. 

Mercury Static theme isotope masonry effect

Finally, the Mercury theme now uses an isotope.js masonry effect; this means that all of the of the cards (the article previews visible on the frontpage, tag pages etc...) animate much more smoothly. There's also been lots of smaller adjustments to the CSS for each theme to quash bugs and tighten-up the designs.

Mercury live preview

Empty tag rendering disabled

Since you can add tags separately from posts, there's a chance that you will inadvertently add tags without adding any posts to it. This isn't an issue for Publii, but it can have quite the negative effect on your SEO. To combat this, Publii will now render tag pages on your site if there are no posts associated with it. This also has a small side benefit, as the total time for Publii to generate your site for uploading will be decreased.

Empty tag link notifications

Since empty tags will no longer be rendered by Publii, this could cause broken links if you've got a tag page linked in the main menu. To help you catch these errors, Publii now includes a notification in the Menu Manager to let you know if a link points to an empty tag.

Prefix support in Google Cloud Storage configuration

For users uploading their site to Google Cloud Storage, the new Publii beta includes support for prefixes. This will allow you to upload the site to a subdirectory if needed, rather than using the default.

Other Improvements

Just as you would expect, we've not just been adding new features during the beta; we've also been making little changes to the existing features to make Publii even better:

  • The website list now updates on every location change, so if you're setting up Publii on a second machine to edit your existing site you won't have to restart Publii after defining the file location; it will refresh immediately.
  • The inline editor toolbar is now hidden once the Ctrl+C shortcut is pressed.
  • Improved editor configuration; most characters ((i.e. non-english characters) will no longer be changed into HTML entities.
  • Addedd Clean-CSS - fast and efficient CSS optimizer.
  • For developers: Added new helpers, reverse and orderby, which will allow developers to better control item lists.

Bugfixes

Bugs are annoying, so every release we try to squash as many as we can. Software bugs, that is. We quite like real bugs. This beta includes the following bugfixes:

  • Fixed issue with loading SVG images in the theme preview.
  • Fixed og:image URL in some cases.
  • Fixed issue with incorrect message display during confirmation of website deletion.
  • Fixed HTML lang attribute values.
  • Fixed issue with refreshing the article list in the internal linking popup.
  • Fixed some issues with internal linking.
  • Fixed issue with links to prev/next posts.

And so we come to the end of the new bits and pieces added in this beta. Don't forget that if you need a bit of help with Publii, have some suggestions for features that'd be nice to see in future, or just fancy telling us what you think of the app, you can do so by dropping in to our Community Page. And with that, we'll see you in the New Year with some more snazzy additions to Publii!

Thank you

Our sincere thanks this month to our donators: Rudy Norff, Wanderschäfer, tuWEBFACIL; your support means a lot to us and will help keep us in coffee as we continue adding to Publii!