Flat Page made it easy plugin screenshot
Dark mode ready
Multilingual support
Supports v5.x

Flat Page made it easy

Create and manage flat file pages with support for translations.

Tags: Panels Forms
Supported versions:
4.x 3.x
Panagiotis Koursaris avatar Author: Panagiotis Koursaris

Documentation

Latest Version on Packagist GitHub Tests Action Status GitHub Code Style Action Status Total Downloads

FilamentFlatPage is a plugin for Filament that allows you to easily create and manage flat file pages with support for translations. It provides a simple way to add configurable, translatable pages to your Filament admin panel without the need for a database.

#Compatibility

Plugin Version Filament Version
^0.1.0 Filament 4.x
^0.0.1 Filament 3.x

#Features

  • Easily create flat file pages with customizable forms
  • Requires no database; data is stored in JSON files
  • Multilingual support for creating translatable content via outerweb/filament-translatable-fields
  • Seamless integration with Filament admin panel

#Installation

You can install the package via composer:

composer require panakour/filament-flat-page

Optionally, you can publish the config file with:

php artisan vendor:publish --tag="filament-flat-page-config"

This will create a config/filament-flat-page.php file where you can set your preferred options:

return [
    'locales' => ['en', 'fr', 'el'],
];

If you want translatable fields, add the plugin to your Filament panel:

use Outerweb\FilamentTranslatableFields\TranslatableFieldsPlugin;

$panel->plugins([
    TranslatableFieldsPlugin::make()
        ->supportedLocales(config('filament-flat-page.locales')),
]);

Optionally, you can publish the views using

php artisan vendor:publish --tag="filament-flat-page-views"

#Usage

  1. Create a new page that extends FlatPage:
<?php

namespace App\Filament\Pages;

use BackedEnum;
use UnitEnum;
use Filament\Schemas\Components\Tabs;
use Filament\Schemas\Components\Tabs\Tab;
use Filament\Schemas\Components\Section;
use Filament\Forms\Components\Textarea;
use Filament\Forms\Components\TextInput;
use Panakour\FilamentFlatPage\Pages\FlatPage;

class Settings extends FlatPage
{

    protected static string | BackedEnum | null $navigationIcon = 'heroicon-o-cog-6-tooth';
    protected static string | UnitEnum | null $navigationGroup = 'Settings';
    protected static ?string $title = 'Settings';


    public function getSubheading(): ?string
    {
        return __('Manage your website settings');
    }

    public function getFileName(): string
    {
        return 'settings.json';
    }

    protected function getTranslatableFields(): array
    {
        return ['site_name', 'site_description', 'contact_address', 'contact_form_title', 'contact_form_content'];
    }

    protected function getFlatFilePageForm(): array
    {
        return [
            Tabs::make('Settings')
                ->tabs([
                    Tab::make('General')
                        ->icon('heroicon-o-computer-desktop')
                        ->schema([
                            Section::make('App Settings')
                                ->icon('heroicon-o-computer-desktop')
                                ->schema([
                                    TextInput::make('site_name')
                                        ->required()
                                        ->hint('Translatable field.')
                                        ->hintIcon('heroicon-o-language')
                                        ->label('Site Name'),
                                    Textarea::make('site_description')
                                        ->hint('Translatable field.')
                                        ->hintIcon('heroicon-o-language')
                                        ->label('Site Description')
                                        ->rows(3),
                                ]),
                        ]),

                    Tab::make('Contact')
                        ->icon('heroicon-o-envelope')
                        ->schema([
                            Section::make('Contact Information')
                                ->icon('heroicon-o-envelope')
                                ->schema([
                                    TextInput::make('contact_email')
                                        ->email()
                                        ->required()
                                        ->label('Contact Email'),
                                    TextInput::make('contact_phone')
                                        ->tel()
                                        ->label('Contact Phone'),
                                    Textarea::make('contact_address')
                                        ->hint('Translatable field.')
                                        ->hintIcon('heroicon-o-language')
                                        ->label('Address')
                                        ->rows(3),
                                ]),

                            Section::make('Contact Form')
                                ->schema([
                                    TextInput::make('contact_form_title')
                                        ->hint('Translatable field.')
                                        ->hintIcon('heroicon-o-language')
                                        ->label('Contact Form Title'),
                                    Textarea::make('contact_form_content')
                                        ->hint('Translatable field.')
                                        ->hintIcon('heroicon-o-language')
                                        ->label('Contact Form Content')
                                        ->rows(3),
                                ]),
                        ]),

                    Tab::make('Social Networks')
                        ->icon('heroicon-o-heart')
                        ->schema([
                            Section::make('Social Media Links')
                                ->icon('heroicon-o-heart')
                                ->schema([
                                    TextInput::make('facebook')
                                        ->url()
                                        ->label('Facebook URL'),
                                    TextInput::make('twitter')
                                        ->url()
                                        ->label('Twitter URL'),
                                    TextInput::make('instagram')
                                        ->url()
                                        ->label('Instagram URL'),
                                    TextInput::make('linkedin')
                                        ->url()
                                        ->label('LinkedIn URL'),
                                ]),
                        ]),
                ])
                ->columnSpan('full'),
        ];
    }

}
  1. Define your form schema in the getFlatFilePageForm() method.

  2. Specify the translatable fields in the getTranslatableFields() method.

  3. Set the filename for storing the flat file data in the getFileName() method.

#Using the FlatPage Facade

You can easily access your flat file data from anywhere in your application using the FlatPage facade:

use \Panakour\FilamentFlatPage\Facades\FilamentFlatPage;

// Get a non-translatable field
$contactEmail = FilamentFlatPage::get('settings.json', 'contact_email');

// Get a translatable field (uses current locale)
$siteName = FilamentFlatPage::get('settings.json', 'site_name');

// Get a translatable field in a specific locale
$siteNameGreek = FilamentFlatPage::get('settings.json', 'site_name', 'el');

// Get all
$allSettings = FilamentFlatPage::all('settings.json');

In Blade templates, you can use it like this:

<h1>{{ \Panakour\FilamentFlatPage\Facades\FilamentFlatPage::get("page.json", "title") }}</h1>
<p>Contact Email: {{ Panakour\FilamentFlatPage\Facades\FilamentFlatPage::get('settings.json', 'contact_email') }}</p>
<p>Site Name: {{ Panakour\FilamentFlatPage\Facades\FilamentFlatPage::get('settings.json', 'site_name', 'en') }}</p>

#Testing

There is a FlatPageTest.php file where you can run to check if tests are passing

composer test

#Changelog

Please see CHANGELOG for more information on what has changed recently.

#Contributing

Please see CONTRIBUTING for details.

#Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

#Credits

#Show your support

Give a ⭐️ if you like this project or find it helpful!

#License

The MIT License (MIT). Please see License File for more information.

The author

Panagiotis Koursaris avatar Author: Panagiotis Koursaris

A full-stack Software Engineer from Cyprus.

I am an experienced Software Developer with a strong background in the internet industry, working since 2012. My skills include PHP, Go programming language, relational database systems, and JavaScript frameworks such as React, Svelte, and Angular. I hold a computer science degree from the Technological Educational Institute of Western Macedonia.

Plugins
1
Stars
18