Place your first features
A feature is one screen in your app. You build the app by dragging features from the left sidebar onto a navigation bar. By the end of this page your app will have a working bottom navigation.
The sidebar
Section titled “The sidebar”Available Features lists everything you can place. Each card shows the feature’s name and, underneath, the WordPress plugin it is built from.
A card is greyed out when its plugin is not active on the connected site. That is not a Memberside limit — the screen has nothing to read. Install and activate the plugin, reload the builder, and the card becomes draggable.
Where features can go
Section titled “Where features can go”Five zones, each a tab across the top of the canvas.
| Zone | What it is | How many |
|---|---|---|
| Bottom Nav | The tab bar at the bottom of the screen | Up to 8 |
| Top Nav | A tab strip under the app’s header | No limit |
| Upper Nav | A header bar stacked above the top nav | Up to 3, and none on Free |
| Side Nav | The drawer that opens from a menu button | No limit |
| Background | Screens you reach by tapping something, not by navigating | One of each |
Bottom navigation is capped at eight because Flutter’s tab bar degrades past that, not because of your plan. Top and side navigation have no cap.
Place three features
Section titled “Place three features”- Open the Bottom Nav tab on the canvas.
- Drag Directory from the sidebar onto the bar.
- Drag Profile next to it.
- Drag Settings next to that.
Three is enough to prove the app works end to end: a list of members, one member’s profile, and the signed-in member’s own account.
Dragging features onto the bottom navigation
record → src/assets/media/place-first-features.mp4
Reordering and removing
Section titled “Reordering and removing”Drag a placed tab left or right to reorder it. Drag it off the bar to remove it. Removing a feature discards its settings, so if you are experimenting, reorder rather than remove and re-add.
Settings on a placed feature
Section titled “Settings on a placed feature”Select a placed tab to open its settings. Three tabs:
- Appearance — the title and description shown at the top of the screen, plus per-screen styling.
- Features — what this screen does: which form it uses, which directory, how many columns, what happens after sign-in.
- Restrictions — which member roles can see the tab.
Every feature has a Title and Description setting under Appearance. Both are optional, and both are worth setting — an untitled screen reads as unfinished.
Background features
Section titled “Background features”Some screens have no place in navigation because you never navigate to them directly. Tapping a post in the feed opens Single Post; tapping a comment thread opens Activity Thread. Add these on the Background tab.
Only one of each background feature is allowed. Adding a second is refused with “already added — only one is allowed”.
If a background feature is missing, the tap that should open it does nothing. That is the most common cause of “the feed works but posts do not open”.
When it does not work
Section titled “When it does not work”| Symptom | Cause | Fix |
|---|---|---|
| A card is greyed out | Its backing plugin is inactive on the connected site | A feature is greyed out |
| Two chat features and one refuses to drop | An app uses one chat backend or the other | Remove the first before placing the second |
| Upper Nav will not accept a tab | Upper navigation is not included on Free | See Plans and limits |
| Tapping a post does nothing | The Single Post background feature is not placed | Add it on the Background tab |
Preview your app against your real site.