We are pleased to introduce you to the new Ladies Lounge 18 website. The next ICF Women’s Conference will take place in Zurich and several satellite locations across Europe. We embarked on bold new directions for the development of the website — in line with the BRAVE theme.
With the growth of the Ladies Lounge from a single-site event to a multi-site event, the demands and challenges to the website have also increased. A simple HTML website no longer cuts it.
Our goal with the development of the new site was it to present the different locations — with different languages and partly different content — under once uniform umbrella — while at the same time minimising the administrative effort. In addition to the new bold look and feel, this year’s website is now simpler and easier and the information is accessible with fewer clicks.
Some highlights of the new website
- All contents are maintained in one place only, even if they are displayed several times on the website
- Content can be edited directly inline with a double-click:
- Multi-language in the frontend and backend
- 100% customised data model for content creators:
- Dynamic Rights: Editors can edit their locations in all available languages and the other content only in their own language
- Easy login with Google account via OAuth2:
- 100% control over the generated code and total freedom in choosing the frontend solution
- Clean separation of content (data) and presentation
- Only about 3 weeks development time
This is made possible by Processwire, the CMF (Content Management Framework), which is used in the background. It massively simplifies the development and administration effort compared to the predecessor system.
« With Processwire, we‘ve found a solution that offers just that: the greatest possible flexibility and yet a very flat learning curve. »
The search for a suitable system
Or range of functions vs. complexity
It’s hard to find a system that combines flexibility and scope with simplicity, both in maintainance and development. The search for such a system is difficult. By and large, the open source world offers you the following options:
It is usually like that; The functionality of a system also increases the training and operating effort — or the system is easy to use, but is powerless, and must be reporposed for high demands beyond its limits.
Quite different Processwire : You do not have to learn a new native language, you don’t have to fight plugin hell and mess around with the loop, you don’t have to torment yourself with system-generated front-end code or even learn an entierly new, old PHP framework .
Rather than tweaking and configuring a system beyond it’s limits, Processwire lays a solid foundation for tailoring a new website scratch in the shortest possible time. It provides all the resources needed to be quick and effective in the implementation, and strikes the perfect balance between simplicity and functionality. An extensive but not crowded plugin selection complements specific needs, and thanks to the intelligent API, missing features can be added quickly.
« In the few months since we discovered Processwire, we are regularly amazed by the simplicity with which we get to our destination. »
All basic requirements are met:
- Custom Content Types
- Flexible and extensible rights-management
- Multilanguage
- Intuitive backend
- Well curated Plugin Directory
- Actually working front-end editing
- Simple templating with 100% frontend freedom
In addition, Processwire has an exceptionally friendly and helpful community. As a rule of thumb, questions are answered constructively in a few hours . The development progresses in brisk steps , the code is extremely easy to understand and simple. Processwire has a supremely powerful yet simple API , and for important things there are (not 1000) but certainly one module which at least serves as a good starting point for further development. Last but not least, the documentation is easy to understand, extensive and clever .
Our experience shows, that you can find a quick and simple solution with Processwire, even for things like extending the rights-management — most of the time a highly complex task with other systems.
This is also reflected positively in the user interface. The otherwise so “simple” WordPress crumbles when coping with more complex tasks. It sumbles over its apparent simplicity and suddenly becomes complex:
The Processwire way
Unlike many other systems, Processwire does not maintain individual generic pages, but tailor-made content types. You do not create a page for a location where you manually create three columns and put pictures in them — which could be pictures of speakers or the location, you never know — but you edit a record of the type “Location” and connect it with one or more records of the type “Speaker”.
Each of these datasets (called Processwire Pages, analogous to Nodes in Drupal) has specific input fields that are customized for the type. This is made possible by a system consisting of the following basic components:
- A page is authored content, for example the event location “Zurich” or “Pastor Lia” as a guest speaker. Such a “page” is always based on a template which defines the type of a page, such as location , speaker or price table
- A template is the blueprint of a single page. Templates are the basic building blocks of a Processwire website. Each template is a collection of fields in itself . They also regulate things like permissions and it can be defined in what context and how often they can occur. For example, you can define that only one page of the type “Teaser” can exist in the entire system and that pages of the type Speaker can only be created as children of locations .
- Fields are the individual input fields that a template consists of, eg: a text field, a link field or an upload field for images. If templates are molecules, then Fields are the atoms. Each field can / must be configured individually. These configurations can then again be overwritten by templates — extremely powerful. If a field is missing, for example for inputing time, this can easily be retrofitted with modules.
- Template files then regulate the output of a page of a specific template. It’s like a controller — but it can also be the view directly — depending on your template strategy. Here, the entered content can be accessed via the Processwire API with simple selectors :
// get one page of the type location
$location = $pages->find('template=Location, name=zurich');// get global speakers
$speakers = $pages->find('template=Speaker, global=1');// join with local speakers $speakers->append($location->speaker_relation);
// display name of global and local speakers
foreach ($speakers as $speaker) {
echo "<h1>$speaker->firstname $speaker->lastname </ h1>";
}When developing a new web page, first we ask what content types are needed and how they are built. For example, a Speaker content requires a name field, a job title, and a list of social media links, whereas Location content requires an address and directions .
Our setup resulted in the following customized content types:
- Invitation: Invitation Text with picture
- Teaser: Picture & Video Element
- Location: Event location, time-controlled incl. Ticket link and information
- Speaker: Global and local
- Program with daily schedule
- Prices: Timed
This is how the content type “Speaker” is displayed for the german editor:
This approach allows the editor to edit content in only one place — even if it appears to the user in multiple locations on the webpage. The date of an event, for example, is edited in the backend only once in the daily schedule content type, but displayed on the website both at the location itself, as well as on the ticket modal. Since the system knows the type of content, we can also react to it dynamically — a location without a ticket link, for example, can be displayed differently than one that already has a sales outlet.
Our experience with Processwire
The good
Processwire is the first CMS since time immemorial that is really fun to use (almost) from start to finish— whether API, documentation, community, modules or backend interface. Every few hours you will be pleasantly surprised and a sense of achievement is never far away. The learning curve is very flat and you’ll find your way quickly arround the system. Even modules can be created quickly without much experience.
Processwire is not over-engineered and uses no-frills PHP code — and that’s where the power steams from: simplicity = easy to understand = less code = save = easy maintanance = faster development …
Even complex modules in Processwire usually only consist of a few hundred lines of code — often much less. And if “hooks” cause wordpress-damaged developers a cold shiver, Hooks in Processwire are a powerful tool to expand the core. The main developer Ryan is a child prodigy — active, eloquent and helpful.
Processwire modules are stable even across major releases as the code base is so clean, simple and small.
There is a GraphQL Plugin — anyone said Headless-CMS?!
Image and file handling is a pleasure:
echo "<img src='{$speaker->image->size(400, 600)->url}' alt='{$speaker->fullname}' />";I could go on all day …
The not soooo good
The definition of the fields and templates is stored in the database, so the separation between content and system is not guaranteed. This complicates clean development with separate live- and development-environments. However, there is a migration module that looks promising — another module, which is expected to write these configurations into the file system, unfortunately nuked our system.
I thought it was hard to get absolute URLs out of the system — Ha! What a fool I was. So much for the topic of positive surprise. (Maybe you noticed, the point actually belongs to the top.)
But while we’re at it — that I thought it would not work, was due to a somewhat incomplete documentation in a few instances. Although it is far better than many others, it still lacks useful hints at one point or another. As in the example above, however, the friendly community quickly helps here.
processwire.com looks a bit old-fashioned. You notice the high level to moan with Processwire.
No free Tesla coming along.
Conclusion
Processwire is for anyone who is upset about any Typo3, WordPress and Drupal lunacy — a fresh breeze of air, clear water, a pure joy.
It’s great as a CMF and Headless CMS, and we keep asking ourselves — why is it not more widely known?
If you value simple but clean code, flexibility, stability, speed, fast development times and maximum freedom, you should definitely take a look at it.
You have to like — or at least not hate PHP — and come to terms with the fact that the system is not over-engineerd to excess. If that’s okay with you, everything is possible — with GraphQL you can even build a completely decoupled frontend.
We are convinced of the simplicity of Processwire and will implement future sites from now on using it as a foundation.
Helpful links & resources
- Documentation overview
- API documentation and selectors
- API cheatsheet pretty handy, not quite complete for version 3.0
- Captain Hook Overview of Hooks
- Blog , mostly weekly updates, Ryan is a rocket …
- Weekly.PW newsletter a week, exciting
- Wireshell command line interface for Processwire
- There is a module generator
- Nice article about Processwire
- Demo page to see
Plugins & Techniques that we used
- Custom Frontend Setup with Uikit 3 and SCSS, and Markup Regions
- Uikit Backend Theme ( github )
- Oauth2 login modules
- In-house development Login with E-Mail
- Pro Fields for repeater matrix fields (infos, price tables, daily routines)
- Wire upgrade to update plugins and the core
- Wire Mail Mandrill to send mails
- FunctionalFields for translatable front-end texts that are not part of a content type (headings, button labels, etc.)
- Runtime markup for dynamic backend fields (combination of first and last name)
- Tracy debugger for fast debugging
- Textformatter OEmbed to convert Vimeo and Youtube links into embed codes
