Launch Week Day 3 🚀 Customization

It’s Day 3 of the Noloco Launch Week. So far this week we’ve announced huge changes to the Noloco Build Mode and Data Tables, if you missed those updates, be sure to go back and check them out.

Each day this week we will be announcing something new on Noloco. Today’s theme is Customization.

Customize your Navigation Style

From today, you can customize the navigation bar in your app, with the choice of top navigation or side navigation.

Since the inception of Noloco’s app builder, we’ve offered a customizable side-nav, which has served our users well. However, we understand the importance of flexibility around design preferences and app structures. With the new top-nav option, you can now select the navigation style that best fits your app’s design and requirements.

Flexibility:
Tailor your app’s look and feel to match your brand or design vision more closely. Whether you prefer the classic side-nav or the sleek top-nav, you have the power to choose.

Simplicity:
The new top nav is perfect for apps with a fewer number of pages, offering a cleaner and more straightforward navigation experience that can make your app feel more intuitive and accessible.

How to Make the Switch:
To change your app’s navigation style to a top-nav, simply go to your Settings, open the Navigation settings, and select “Top.” It’s that easy to refresh your app’s navigation and give it a modern twist.

Customize your app with a new Component

Introducing the latest addition to our app development toolkit: the ‘Notice’ component, now available on Record Pages and Blank pages.

Why Use the Notice Component?

The Notice component stands out for its ability to highlight critical information, alerts, or instructions on your app’s pages. With the flexibility to choose from four distinct variants, you can align the notice’s appearance with the message’s intent and your app’s theme.

Variants for Every Need: Choose a variant that fits your message:

  • Primary: Matches your app theme for general notices.
  • Secondary: A neutral option for less simple messages or callouts.
  • Success: Green, ideal for positive updates or completion messages.
  • Warning: Orange, perfect for cautionary advice.
  • Danger: Red, for urgent alerts.

Take full control over your Notice’s content, and customize the title, subtitle, and icon to match the message you want to convey.

Actionable Notices:

Enhance your notices with custom action buttons, turning alerts into interactive prompts for your users.

The Notice component in action

  • Project Management:
    Alert users to overdue projects with a warning notice and a button to contact the client directly.

  • Process Updates:
    Inform users they’ve completed all necessary steps on a page with a success notice, indicating no further action is required.

  • Application Status:
    Use a primary or secondary notice to communicate that an application is being processed, adding clarity to the procedure.

Address Autocomplete

Super-charge your address fields with Google Maps Suggestions. With suggestions from Google Maps, you can speed up form filling, reduce errors, and improve data accuracy by suggesting addresses as you type.

address-field-auto-complete

Setup Guide:

Open form field settings and change the “Display as” option to “Google Maps Autocomplete.” Just make sure you have setup your Google Maps API key

Examples of Use:

Customer Onboarding Forms:
Quickly capture accurate address information as new customers sign up.

Delivery Apps:
Ensure precise delivery locations by allowing drivers and customers to use autocomplete for addresses.

Address Autocomplete set up?
When I open form field settings and look at the “Display as” options “Google Maps Autocomplete” is not one of the options. I have setup my Google Maps API key and confirmed that that the domain is allowed to send API requests.

Hi Charlie, are you using a Noloco Address field?

I don’t know what a noloco address field is. My data is coming from Postgresql

At the moment the Address Autocomplete is only available on Noloco Address fields, which is a special field to hold structured addresses.

We do plan on bringing it to standard text fields soon, which will mean you can use it with Postgres etc.

1 Like