ProcessWire Weekly #603

Latest core updates: File Regions for the Markup Regions output system

In his latest weekly update Ryan talks about a new feature addition for the Markup Regions output system, labeled File Regions.

If you've been following our weekly updates, this is something we already briefly talked about last week, but regardless: File Regions are an extension for Markup Regions, used for populating content for CSS and JavaScript files from your PHP templates. If you are familiar with e.g. Vue Single-File Components, this is a similar concept.

File Regions enable you to populate CSS and JS files with Markup Regions. [...] Especially on a project where there are multiple developers, it simplifies a lot to be able to build features as self contained components, while still using the traditional route for site-wide stuff.

— Ryan

File Regions is a seamless extension for Markup Regions, and has a minimal learning curve. In order to use it, you just add a JavaScript or CSS link to your markup, like this:

<link rel="stylesheet" href="main.css">

... and then populate the contents of the file in one of your template files, or wherever you're using Markup Regions:

<style id="hello-world" pw-file="main.css">
.hello-world { color: red; }
</style>

You can also leave pw-file empty (<style id="test" pw-file>), in which case it essentially works as a shorthand for either "main.css" or "main.js". There's more to this feature for those using SCSS or LESS, and there are some considerations regarding cleaning up of generated CSS and JS files, all covered in the Markup File Regions docs page.

That's all for our core updates section this week, but be sure to check out the weekly update from Ryan for more details. Thanks!

New module: SnowfallAnimation

SnowfallAnimation is a brand-new third-party ProcessWire module that was created by Jürgen Kern and released just in time for the winter season. The module does exactly what the name suggests: it adds a snowfall animation to your website.

While much of the heavy lifting (as far as that applies to snowflakes) is handled by the Snowfall.js JavaScript library from Andrey Yurkevich, this module provides quite a bit of configurability. Among other things you can define how many snowflakes you want, how big they should be, what color they are (avoid yellow snow, folks), and how fast they fall. There is even an option to make snowflakes show up on specific days of (every) year.

If you'd like to give this module a try, you can clone or download the module's source from the SnowfallAnimation GitHub repository. Big thanks to Jürgen for creating this module and sharing it with us!

Site of the week: Dauphine Orleans Hotel

Our latest site of the week is that of Dauphine Orleans Hotel, a New Orleans based hotel established in the 1800s. The hotel has seen a lot of history and been through quite a few twists and turns, making it a historical landmark — and, according to local legends, the hotel is known for ghostly encounters.

New Orleans’ historic Dauphine Orleans Hotel is a serene escape within the French Quarter with open-air courtyards and a haunted history. Established in the 1800s, this Creole cottage-style hotel stands as a historic landmark and boasts years of storied history and a haunted personality.

The Dauphine Orleans Hotel website features a beautiful design sprinkled with some transition effects for a bit of added flair, and there's quite a lot of content on it as well: information about the hotel, their haunted history, available rooms and amenities, and so on. All in all this is a full-featured hotel website that is both easy to use and enjoyable to browse, so absolutely no complaints there.

As for some behind the scenes details, the front-end of the Dauphine Orleans Hotel website is powered by the Uikit front-end framework, with plenty of custom work on top of it. Meanwhile, a couple of the non-core ProcessWire modules that we could spot in action on this site include commercial Pro modules ProCache and FormBuilder.

Congratulations to the client, Dauphine Orleans Hotel, for their ProcessWire powered website, as well as the team behind the project for a job well done — splendid work from everyone involved!

Stay tuned for our next issue

That's it for the 603rd issue of ProcessWire Weekly. We'll be back with more news, updates, and content Saturday, 29th of November. As always, ProcessWire newsletter subscribers will get our updates a few days later.

Thanks for staying with us, once again. Hope you've had a great and productive week, and don't forget to check out the ProcessWire forums for more interesting topics. Until next week, happy hacking with ProcessWire!