-
Notifications
You must be signed in to change notification settings - Fork 4.7k
Description
What
When users create and edit navigation overlays, the UI doesn't clearly communicate what type of template part they're working with.
Currently, when creating navigation overlays using the Navigation block's "create" functionality, the UI displays:
- In the breadcrumb: "Overlay · Template Part"
- In the template parts list: "Overlay 1", "Overlay 2", "Overlay 3"
The generic term "Overlay" doesn't indicate that this is specifically a navigation overlay. Users can't tell from the UI alone what type of overlay they're editing or what it's used for. This is part of the broader language consistency issue tracked in #74939.
User Feedback (from Call for Testing):
"Having the template part default name just being 'overlay' doesn't feel super clear that it is a navigation overlay."
Why
Clear UI labels help users understand what they're working with and reduce confusion. This is especially important for navigation overlays since:
- Context matters: Users need to understand they're editing a navigation-specific component, not a generic overlay
- Discovery: When users see "Overlay 1" in their template part list or breadcrumb, it's unclear what it contains or what it's for
- Multiple overlays: Users may create several navigation overlays for different purposes - unclear labels make them hard to distinguish
- Consistency: The UI should align with:
- The feature name "Navigation Overlays"
- The control labels recently updated in Navigation Overlay: Update overlay control labels #74690
- The language used throughout the rest of the interface
- Avoiding confusion: Generic labels like "Overlay" could apply to many different types of overlays; being specific improves clarity
When the UI clearly shows "Navigation Overlay" instead of just "Overlay", users can immediately understand what they're working with and successfully manage their navigation overlays.
How
Explore approaches to make the UI more clearly communicate what type of template part users are working with:
Possible approaches:
- Update the default naming pattern to be more descriptive (e.g., prefix with "Navigation" so new template parts are named "Navigation Overlay 1", "Navigation Overlay 2", etc. instead of just "Overlay 1", "Overlay 2")
- Enhance the breadcrumb display to provide additional context beyond just the template part name
- Add visual indicators (icons, badges, or labels) in the UI to distinguish navigation overlays from other template parts
- Update the template parts list view to show template part types or categories more prominently
Considerations:
- The UI should be immediately clear to users without requiring additional investigation
- Any solution should maintain consistency with recent work like Navigation Overlay: Update overlay control labels #74690
- Names/labels should still be editable by users after creation
- The approach should work well when users create multiple navigation overlays
- Consider how the solution fits with the broader language consistency effort in Navigation Overlays: Use consistent language #74939
Related work:
- This builds on Navigation Overlay: Update overlay control labels #74690 which updated overlay control labels
- This helps address the language consistency issue in Navigation Overlays: Use consistent language #74939
- Consider reviewing other places where overlay naming appears for consistency
User Stories
As a user creating a navigation overlay, I want the UI to clearly show "Navigation Overlay" in the breadcrumb and template part list, so I immediately understand what I'm editing without having to guess or investigate.
As a site builder managing multiple template parts, I want navigation overlay template parts to be clearly labeled as "Navigation Overlay 1" and "Navigation Overlay 2", so I can easily identify them in my template parts list without having to open and inspect each one.
As a WordPress user new to navigation overlays, I want the UI to consistently use clear "Navigation Overlay" terminology, so I can build a clear mental model of what this feature is and how it works.
As a user who creates multiple overlays for different purposes, I want the UI labels to be specific enough that I can distinguish navigation overlays from other potential overlay types, so I can manage my site's template parts effectively.