Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ibrahimbougaoua/filawidget
Filawidget offers a powerful, customizable solution for managing dynamic content in Laravel projects using FilamentPHP.
https://github.com/ibrahimbougaoua/filawidget
Last synced: about 2 months ago
JSON representation
Filawidget offers a powerful, customizable solution for managing dynamic content in Laravel projects using FilamentPHP.
- Host: GitHub
- URL: https://github.com/ibrahimbougaoua/filawidget
- Owner: ibrahimBougaoua
- License: mit
- Created: 2024-08-23T14:53:34.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-09-09T14:55:02.000Z (4 months ago)
- Last Synced: 2024-09-09T21:35:27.146Z (3 months ago)
- Language: PHP
- Homepage:
- Size: 520 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/FUNDING.yml
- License: LICENSE.md
Awesome Lists containing this project
README
# Customizable solution for managing dynamic content in Laravel projects using FilamentPHP.
[](https://packagist.org/packages/ibrahimbougaoua/filawidget)
[](https://github.com/ibrahimbougaoua/filawidget/actions?query=workflow%3Arun-tests+branch%3Amain)
[](https://github.com/ibrahimbougaoua/filawidget/actions?query=workflow%3A"Fix+PHP+code+style+issues"+branch%3Amain)
[](https://packagist.org/packages/ibrahimbougaoua/filawidget)
**Filawidget** is a dynamic content and widget management package for **FilamentPHP**, providing an easy-to-use drag-and-drop interface to manage widgets, widget areas, and hierarchical pages. The package is designed to enhance the customization of page layouts and widgets in Laravel projects.
## Support us
[](https://buymeacoffee.com/ibrahimbougaoua)
## Key Features
### Widget Management
- **Create and Customize Widgets**: Users can create widgets with custom fields, types, and configurations. Each widget can have a set of configurable fields and is tied to a specific widget area.
- **Drag-and-Drop Interface**: An easy-to-use drag-and-drop interface allows users to organize widgets within areas dynamically, rearranging widget order effortlessly.
- **Active/Inactive Widgets**: Manage the status of widgets, setting them as active or inactive based on visibility requirements.
### Widget Areas
- **Multiple Widget Areas**: Define different widget areas (e.g., sidebars, footers) to which widgets can be assigned.
- **Drag-and-Drop Layout Customization**: Users can rearrange the order of both widget areas and the widgets within them using drag-and-drop functionality, ensuring customizable page layouts.
- **Active/Inactive Widget Areas**: Control the visibility of widget areas, marking them as active or inactive depending on layout preferences.
### Page and Subpage Management
- **Hierarchical Pages**: Manage pages and subpages in a hierarchical structure with parent-child relationships. Pages can be organized into different levels of hierarchy, facilitating complex website structures.
- **Page Status**: Set pages as active or inactive based on publishing needs, allowing for controlled visibility across the website.
- **Drag-and-Drop Page Reordering**: Reorder pages and subpages easily through a drag-and-drop interface, ensuring flexibility in page hierarchy and content organization.
### Dynamic Field Configuration
- **Custom Fields for Widgets**: Add custom fields to widgets, such as text, images, or other input types, through a dynamic and configurable system.
- **JSON-Based Field Options**: Provide flexible options for fields, enabling validation rules, default values, and other configurations in JSON format.
### Widget Types
- **Custom Widget Types**: Create different types of widgets with specific functionalities, allowing for a wide range of content management options.
- **Field Association with Widget Types**: Assign different sets of fields to widget types, ensuring each widget type has the necessary input fields for customization.
### Order Management
- **Customizable Widget and Page Orders**: Users can update the order of widgets, pages, and widget areas. Each item can be repositioned dynamically, offering complete control over the structure.
- **Automated Order Updates**: Use the built-in functionality to update the order of widgets and pages across the system automatically.
### Note :
Screenshots from the client project.
Widgets
[
](https://www.youtube.com/watch?v=KyedlYpU5i0)
Pages
[
](https://www.youtube.com/watch?v=KyedlYpU5i0)
Preview
[
](https://www.youtube.com/watch?v=KyedlYpU5i0)
Frontend
[
](https://www.youtube.com/watch?v=KyedlYpU5i0)
## Installation
You can install the package via composer:
```bash
composer require ibrahimbougaoua/filawidget
```
You can publish and run the migrations with:
```bash
php artisan vendor:publish --tag="filawidget-migrations"
php artisan migrate
```
You can publish the config file with:
```bash
php artisan vendor:publish --tag="filawidget-config"
```
This is the contents of the published config file:
```php
return [
'should_register_navigation_appearance' => true,
'should_register_navigation_pages' => true,
'should_register_navigation_widgets' => true,
'should_register_navigation_widget_areas' => true,
'should_register_navigation_fields' => true,
'should_register_navigation_widget_types' => true,
'show_home_link' => true,
'show_quick_appearance' => true,
];
```
Optionally, you can publish the views using
```bash
php artisan vendor:publish --tag="filawidget-views"
```
Available fields of filament that can use it for create dynamic widget.
```bash
----------------------------------------
| Field Type | Description |
|-------------------|------------------|
| Text | Text Field |
| Textarea | Textarea Field |
| Number | Number Input |
| Select | Select Dropdown |
| Checkbox | Checkbox |
| Radio | Radio Button |
| Toggle | Toggle Switch |
| Color Picker | Color Picker |
| Date Picker | Date Picker |
| Date Time Picker | Date Time Picker |
| Time Picker | Time Picker |
| File Upload | File Upload |
| Image Upload | Image Upload |
| Rich Editor | Rich Text Editor |
| Markdown Editor | Markdown Editor |
| Tags Input | Tags Input |
| Password | Password Input |
----------------------------------------
```
## Usage
```php
// AdminPanelProvider
use IbrahimBougaoua\Filawidget\FilaWidgetPlugin;
public function panel(Panel $panel): Panel
{
return $panel
->plugins([
FilaWidgetPlugin::make(),
]);
}
```
```php
// Areas
use IbrahimBougaoua\Filawidget\Services\AreaService;
$areas = AreaService::getAllAreas();
$areasWithOrderedWidgets = AreaService::getAllAreasWithOrderedWidgets();
$area = AreaService::getWidgetByIdentifier("Sidebar");
```
```php
// Widgets
use IbrahimBougaoua\Filawidget\Services\WidgetService;
$widgets = WidgetService::getAllWidgets();
$widget = WidgetService::getWidgetBySlug("latest-posts");
```
```php
// Pages
use IbrahimBougaoua\Filawidget\Services\PageService;
$pages = PageService::getAllPages();
$page = PageService::getPageBySlug("about-us");
$counts = PageService::counts();
```
```php
use IbrahimBougaoua\Filawidget\Services\AreaService;
use IbrahimBougaoua\Filawidget\Services\PageService;
// Route
Route::get('/', function(){
$pages = PageService::getAllPages();
$areas = AreaService::getAllAreas();
return view('welcome',[
'pages' => $pages,
'areas' => $areas,
]);
});
// Welcome Blade
Filament Widgets
.widget-card {
margin-bottom: 20px;
}
.widget-header {
font-size: 1.25rem;
font-weight: bold;
background-color: #f8f9fa;
padding: 10px;
border-bottom: 1px solid #dee2e6;
}
@foreach ($areas as $area)
@forelse ($area->widgets as $widget)
@empty
@endforelse
@endforeach
```
## Testing
```bash
composer test
```
## Changelog
Please see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.
## Contributing
Please see [CONTRIBUTING](CONTRIBUTING.md) for details.
## Security Vulnerabilities
Please review [our security policy](../../security/policy) on how to report security vulnerabilities.
## Credits
- [Ibrahim Bougaoua](https://github.com/ibrahim bougaoua)
- [All Contributors](../../contributors)
## License
The MIT License (MIT). Please see [License File](LICENSE.md) for more information.