The Widget Editor allows you to create and configure custom dashboard widgets that display real-time data, charts, and interactive elements on your personal dashboard.
Overview
The Widget Editor is a powerful tool that lets you build custom widgets using a code-based approach. You can create visual elements, charts, counters, and interactive components that appear on your dashboard.
How to Access
- Log in to your account
- Navigate to your Dashboard
- Click on the Widget Editor option in the sidebar
- The widget editor will open in your main content area
Prerequisites
- Admin role or permission to manage widgets
- Basic understanding of HTML/CSS is helpful but not required
Step-by-Step Guide
Step 1: Create a New Widget
Click the New Widget button to start creating a widget. A modal will appear where you can enter the widget name and select the widget type.
Step 2: Configure Widget Properties
Each widget type has different configuration options:
- Chart Widget: Select data source, chart type, colors
- Counter Widget: Set the value, label, and icon
- Text Widget: Enter custom HTML content
- Table Widget: Define columns and data source
Step 3: Save and Preview
Click Save to store your widget. Use the Preview button to see how it will look on your dashboard.
Step 4: Add to Dashboard
Once saved, you can drag and drop the widget to position it on your dashboard grid.
Common Use Cases
- Display website analytics summary
- Show real-time notification counts
- Create custom welcome messages
- Monitor system status indicators
Troubleshooting
Issue: Widget not displaying
Solution: Check that the widget is enabled and assigned to your dashboard layout.
Issue: Code editor not loading
Solution: Clear your browser cache and refresh the page. Ensure JavaScript is enabled.
Related Articles
- How to Manage Dashboards
- How to Set Up Your Personal Dashboard
Quick Reference
| Route | widget-codepen.index |
| Permission | Admin access required |
| Category | Getting Started |