ZOO 2.1 Frontend Submission

Today we are really excited to announce the BETA release of ZOO 2.1! The release comes with the most anticipated feature for ZOO: Frontend Submission! But it is not just another frontend submission. We really tried to raise the bar and take frontend submission to the next level in design, usability, simplicity and flexibility.

In this blog we put together a comprehensive walkthrough of all the new features. This helps you to explore all the new things we implemented in ZOO 2.1. Take some time, get yourself a coffee and enjoy reading :-) Here we go:

Frontend Submission

Your brand new frontend submission for ZOO allows you to create submissions for any content type of your ZOO apps. For example authors can submit articles or the latest movie reviews. It can also be used as a form builder for any kind of form, e.g. an application or contact form. Create multiple submission forms for your content types with different fields and layouts for your user groups. Not only submissions by registered users even public submissions are possible. Everything can easily be managed from the submission manager of the ZOO administration.

Submission Interface

We've put a lot of effort into the design of the submission interface to create a great user experience. The forms are well-designed, clearly arranged and simplified for all the different elements of ZOO. For example link, email and video elements now use simple input fields. Fields that currently have the focus are nicely highlighted. Required fields are marked with an asterisk. And help messages appear whenever the submission fails due to requirements not met. Of course users don't have to enter data twice if a submission fails. They'll only have to fill out the missing fields that are nicely emphasized.

Field Labels

We provide an elegant solution for labels in elements with more than one field. The label appears in a light gray inside the field even if the field has focus. It doesn't disappear until the user actually enters the first letter. These small things help the user to follow through the submission and give an overall better user experience.

More Options

Some elements like link, email, image and others can have some extra options. If you enable these options a little Show Options button appears in the submission interface. For example the extra options for a link element are a custom text, title, rel tag and whether the link should open in a new window.

Upload fields

One of our little highlights is the upload field of the image and download elements. The file upload field is by far the worst field to style, and it is difficult to get the same look in all browser. So we are proud to present a well-designed upload field which works in every browser. As icing on the cake it only displays the selected file name without the whole path which is normally really annoying.

Tooltips

You may remember that you can add a description for each element in ZOO when creating a new content type. These descriptions show up as tooltips for each element in the ZOO administration. They can also be enabled for the frontend submission form to give users some help to fill out the form.

Form Builder

Of course, we introduce a new submission layout where you can arrange your content elements via drag 'n drop from the administration backend. This makes creating your submission form a breeze! Just drag 'n drop the elements of the submittable type to the layout positions. This key feature makes ZOO very versatile and easy to use. For example, you can build an application or contact form with just a few clicks! The layout parameters allow you to define what elements are required when filling out the submission fields.

My Submissions

Ok, submitting content is the first part but what if you want to review or edit your submitted items in the frontend? Well, here we go :-) We implemented a "My Submission" Page that lists all items of an author. It has all the basic features like pagination, filtering items by type, editing and creating new items. You can also preview an item before editing without loading any new page. The preview looks exactly the same as the item view. Awesome!

Frontend Editing

You may ask how ZOO manages the different requirements of a frontend submission. Some people need submissions for registered users, some need public submissions like a simple contact form and others need frontend editing with administration permissions. With ZOO, you can do it all! ZOO allows you to create all kinds of submissions for different content types and user groups (public, registered and special) with different template layouts and fields. But a new key feature we like to introduce is the Trusted Mode which you can enable and disable for different submissions. Here is a short overview of the differences if the trusted mode is enabled or not:

Security

To make public submissions possible we had to provide some good security settings for the frontend submission. If the Trusted Mode is disabled no HTML editor is available and HTML is stripped from all fields. It is not possible to see any paths for example to the image and file folders. The image selection through the lightbox is disabled as well. Of course the Trusted Mode is always disabled for public submissions.

Upload Size

For each image and download element you can define a maximum upload size. If the file size is too big the user gets a help message.

Restricted File Types

Again for each image and download element you can define the valid file types that are allowed to upload.

Backend revamped

While designing and developing a beautiful frontend submission we came up with the idea to revamp the form fields in the ZOO administration as well. For example the item creation form looked a little messy in ZOO 2.0. So why not kill two birds with one stone? ZOO 2.1 now has the same polished form fields the new frontend submission has. All forms are now clearly arranged and the user interface is simplified! You will feel much more comfortable while working in the backend. Isn't this awesome?

Submission templates for all apps

Last but not least we created new submission layouts for all types of each app. For example the Movie Database app has a nice submission layout as do all the other apps. Each layout fits the design of the specific app. You don't have to do any extra work to create new layouts... You can start right away!

What's next?

The ZOO 2.1 BETA is exclusively available for members only who purchased the ZOO app bundle. As soon as ZOO 2.1 goes STABLE it will be released for the public. Members can go straight to the download section in the member area and take ZOO 2.1 BETA for a test drive! Be aware that it is a BETA version. It is not intended to be used on a production website just yet.