ProcessWire Weekly #395

In the 395th issue of ProcessWire Weekly we'll cover the latest core updates, check out the MJLM to HTML module, and more. Read on!

Welcome to the latest issue of ProcessWire Weekly. In this issue we'll check out the latest core updates included in ProcessWire version 3.0.190, and also dig into a brand new third party module called MJML to HTML.

Our latest site of the week is that of a Portuguese health clinic, Clínica TRUST. This site was a co-project by Go Design and Supertiny Agency — stay tuned for more details!

Thanks to all of our readers for being here with us again, and as always, any feedback is most welcome – please don't hesitate to drop us a line if there's anything in your mind you'd like to share with us. Enjoy our latest issue and have a great weekend.

Latest core updates: ProcessWire 3.0.190

In the latest post at the processwire.com blog Ryan talks about ProcessWire 3.0.190, the latest development version of ProcessWire, available via the dev branch at GitHub. The post also covers version 6 of the PageAutosave + LivePreview module, and version 22 of the commercial ProFields Table module.

What's new in ProcessWire 3.0.190?

ProcessWire 3.0.190 is, in fact, quite a sizeable release, containing fixes, optimizations, and some completely new features. If you've been following our weekly issues, you might be familiar with some updates officially included in this version.

Anyway, here's a short list of what's new in 3.0.90, when compared to 3.0.189:

  • New GUI feature for Repeaters for hiding the controls (delete, insert, clone, etc.) until the user hovers over the header bar. This option is enabled by default, but can be disabled case by case via field settings.
  • The color of Repeater Matrix headers can now be specified by including a color code (in hex format, such as #424242) in the item label setting.
  • PageAutocomplete now supports querying subfields (field.subfield).
  • $pages->find() now supports sorting items by ID with syntax like id.sort=2|1|3. Previously it was possible to specify the Page ID's to look for, but not the order they should be returned in.
  • $pages->add() now pulls a new copy if the added item from database to avoid situations where newly added page isn't yet fully initialized.
  • New $pages->raw()->col($id, $col) method returns the raw value for native pages table column for provided page ID, while $pages->raw()->cols($id, $cols) does the same for multiple columns, returning values as an array.
  • Template modified date is updated when fields are added via the "Send to template(s)" option.

In addition to the feature updates mentioned above, 3.0.190 also fixes a bunch of bugs (which you can read more about in the weekly update post from Ryan) and improves compatibility with PHP 8.1, which was released just over a week ago.

Module updates

This week's blog post also covers latest updates to a couple of modules: PageAutosave + LivePreview, and ProFields Table:

  • PageAutosave + LivePreview v6 adds an autosave on/off toggle, a confirm dialog when user clicks live preview but has autosave off, an option to save previous changes when autosave is switched on, and some new configuration settings
  • ProFields Table v22 adds new row cloning feature, and a "Toggle" column type. Additionally there are improvements to Uikit admin theme output, and some smaller fixes and improvements as well.

That's all for our core updates section this week. For more details on what's new in the latest version of the core, as well as v6 of the PageAutosave + LivePreview module and v22 of the ProFields Table module, check out the weekly blog post from Ryan. Thanks!

New module: MJML to HTML

MJML to HTML is a brand new third party module — in fact so new, that it's still in alpha stage, and thus not necessarily yet suitable for production sites. In a nutshell this is a module that converts page markup, authored in MJML, automatically to HTML via the free-to-use MJML REST API.

MJML, for those not familiar with the concept, is a markup language created by Mailjet for building responsive newsletters. The idea is that you can build your newsletter in a simplified markup, which then gets compiled into the messy, table infested horror that sadly enough is still required to make a newsletter look good in different email clients.

Here's a little sneak peek into what MJML markup might look like:

<mjml>
    <mj-body>
        <mj-section>
            <mj-column>
                <mj-image width="100px" src="/assets/img/logo-small.png"></mj-image>
                <mj-divider border-color="#F45E43"></mj-divider>
                <mj-text font-size="20px" color="#F45E43" font-family="helvetica">Hello World</mj-text>
            </mj-column>
        </mj-section>
    </mj-body>
</mjml>

This example, borrowed from the MJML live editor, is automatically compiled into 138 lines of layout tables, inline styles, CSS conditionals, Outlook specific XML, and so on. For instructions on getting started with the MJML to HTML module, the API key needed to use the MJML REST API, check out the MJML to HTML modules directory entry.

A few highlights from the README file for the module:

  • MJML output is cached to avoid repetitive API calls (unless there were errors or warnings while it was being generated). Cached output is automatically cleared when the page is saved or the template file has been modified.
  • A simple code viewer — only visible to superusers — is provided. The code viewer highlights lines with errors or warnings.
  • A button for quickly copying the code of the generated newsletter is added to the page, visible only to users with edit access. Additionally a shortcut is added under "View" in the page editor to open the code in a new tab.
  • The module has built-in multi-language support.

Big thanks to Romain Cazier for developing this module and sharing it with us — it's a welcome addition, especially for anyone interested in authoring their newsletters in ProcessWire and sending them out with the ProMailer module.

Site of the week: Clínica TRUST

Our latest site of the week is that of Clínica TRUST, a health clinic based in downtown Porto, Portugal. Clínica TRUST provides services related to Damage Assessment, Dental, Physiotherapy, Sports Medicine, Orthopedics, and many other areas of medical care.

Clínica Trust is a health clinic in downtown Porto offering services on multiple medical fields. The website is a collaboration between Supertiny and Go Design. Go designed it, Supertiny built it.

Clínica TRUST website was a co-project by GOdesign and Supertiny Agency: Godesign handled the design side, while Supertiny took care of the development side of things. Both agencies did splendid work, since the end result is a website that not just looks great, but also works well and loads fast.

While the design of this site is relatively straightforward, there are various graphical elements and typographic tricks that guarantee that it isn't by any means boring – the word that comes to mind is "friendly", and the site feels quite enjoyable to browse. As for behind the scenes details, there's not a lot we can tell — no full-fledged front-end framework but rather some custom elements, and no third party modules in sight.

You can find a brief case story for this project from the showcase area of our support forum, feel free to check it out for more details. Big thanks to Supertiny and GOdesign for sharing this project with us, and our congratulations to the client, Clínica TRUST!

Stay tuned for our next issue

That's all for the 395th issue of ProcessWire Weekly. We'll be back with more news, updates, and content Saturday, 11th of December. 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!

Post a comment