### Install Package via Composer Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/installation.md Use this command to install the package using Composer. ```bash composer require mohamedsabil83/filament-forms-tinyeditor ``` -------------------------------- ### Comprehensive Form Example with TinyEditor Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Demonstrates integrating multiple TinyEditor instances with various configurations within a single Filament resource form. Includes basic and advanced settings. ```php use Filament\Forms\Components\Section; use Filament\Forms\Components\TextInput; use Filament\Forms\Components\Toggle; use Filament\Forms\Form; use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; class PostResource extends Resource { public static function form(Form $form): Form { return $form ->schema([ Section::make('Basic Information') ->schema([ TextInput::make('title') ->required() ->maxLength(255), TinyEditor::make('excerpt') ->simple() ->label('Short Description') ->maxLength(500) ->placeholder('Brief summary of the post...'), ]), Section::make('Content') ->schema([ TinyEditor::make('content') ->profile('default') ->showMenuBar() ->toolbarSticky(true) ->minHeight(400) ->maxHeight(800) ->fileAttachmentsDisk('public') ->fileAttachmentsDirectory('posts') ->fileAttachmentsVisibility('public') ->language(fn () => app()->getLocale()) ->required() ->label('Full Content'), ]), Section::make('SEO') ->schema([ TinyEditor::make('meta_description') ->simple() ->maxLength(160) ->label('Meta Description'), ]) ->collapsed(); ]); } } ``` -------------------------------- ### Install Filament Forms TinyEditor Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Install the package via Composer. Optionally publish the configuration file and link storage for image uploads. ```bash composer require mohamedsabil83/filament-forms-tinyeditor php artisan filament:assets php artisan vendor:publish --tag="filament-forms-tinyeditor-config" php artisan storage:link ``` -------------------------------- ### Define Custom Editor Profile Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Example of a custom editor profile configuration within the package's config file. Defines plugins and toolbar buttons for a specific editor instance. ```php 'simple' => [ 'plugins' => 'directionality emoticons link wordcount', 'toolbar' => 'removeformat | bold italic | rtl ltr | link emoticons', ] ``` -------------------------------- ### Add Custom TinyMCE Configurations Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Example of adding custom configurations to a TinyMCE editor profile within the package's config file. This allows for advanced TinyMCE settings like image advanced tab. ```php 'simple' => [ 'plugins' => 'directionality emoticons link wordcount', 'toolbar' => 'removeformat | bold italic | rtl ltr | link emoticons', 'custom_configs' => [ 'image_advtab' => true ] ], ``` -------------------------------- ### Publish Configuration File Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/installation.md Optionally publish the configuration file for customization. ```bash php artisan vendor:publish --tag="filament-forms-tinyeditor-config" ``` -------------------------------- ### Publish Filament Assets Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/installation.md Run this command if you are using Filament Forms standalone and need to publish assets. ```bash php artisan filament:assets ``` -------------------------------- ### Initialize TinyEditor Component Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Basic initialization of the TinyEditor component. Ensure the component is imported before use. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; TinyEditor::make('content') ``` -------------------------------- ### Link Storage for Images Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/installation.md This command may be necessary to display images stored in the application. ```bash php artisan storage:link ``` -------------------------------- ### Simple Editor Mode Configuration Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Utilize the `simple()` method for a minimal editor with basic formatting. This mode includes specific plugins and a limited toolbar. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; TinyEditor::make('content') ->simple() ->label('Comment') ->placeholder('Write your comment...') ->required(); // Simple mode includes these plugins: autoresize, directionality, emoticons, link, wordcount // Simple toolbar: removeformat | bold italic | rtl ltr | link emoticons ``` -------------------------------- ### Configure Reusable Content Templates Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Define reusable content templates by configuring the 'templates' array in the config file. This allows users to insert pre-defined content into the editor. ```php // config/filament-forms-tinyeditor.php return [ 'profiles' => [ 'template' => [ 'plugins' => 'autoresize template', 'toolbar' => 'template | bold italic | link', 'upload_directory' => null, ], ], 'templates' => [ 'email' => [ [ 'title' => 'Welcome Email', 'description' => 'Standard welcome email template', 'content' => '
Thank you for joining us.
Best regards,
The Team
Issue #{{issue}}
By using this service, you agree to our Terms of Service.
', ], ], ], ]; ``` -------------------------------- ### Configuring Editor Height Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Control the editor's height using `minHeight()` and `maxHeight()`. For disabled or preview modes, `previewMinHeight()` and `previewMaxHeight()` can be used. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; // Set minimum and maximum height TinyEditor::make('content') ->minHeight(300) ->maxHeight(600) ->label('Article Body'); // For disabled/preview mode, set preview heights TinyEditor::make('content') ->minHeight(400) ->maxHeight(800) ->previewMinHeight(200) ->previewMaxHeight(500) ->disabled(); ``` -------------------------------- ### Usage with Template Profile Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Apply a pre-configured template profile to a TinyEditor instance. Ensure the profile and template names match your configuration. ```php // Usage with template profile TinyEditor::make('email_content') ->profile('template') ->template('email') ->label('Email Content'); ``` -------------------------------- ### Enable Sticky Menubar Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Makes the menubar of the TinyMCE editor stick to the top of the viewport when scrolling. Set to true to enable sticky behavior. ```php TinyEditor::make('content')->toolbarSticky(true) ``` -------------------------------- ### Enabling Menu Bar and Sticky Toolbar Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Show the full TinyMCE menu bar using `showMenuBar()` and enable a sticky toolbar for long content with `toolbarSticky(true)`. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; // Show the full menu bar (File, Edit, View, Insert, Format, Tools, Table, Help) TinyEditor::make('content') ->showMenuBar() ->label('Document Editor'); // Make toolbar sticky when scrolling long content TinyEditor::make('content') ->showMenuBar() ->toolbarSticky(true) ->minHeight(600) ->label('Long Form Content'); ``` -------------------------------- ### Use Simple Editor Variant Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Applies a predefined simple configuration to the TinyMCE editor. Useful for basic text formatting needs. ```php TinyEditor::make('content')->simple() ``` -------------------------------- ### Applying a Custom Profile to TinyEditor Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Apply a pre-configured profile to a TinyEditor instance using the `profile()` method in your form schema. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; TinyEditor::make('content') ->profile('blog') ->label('Blog Post Content'); ``` -------------------------------- ### Configure Image Upload Settings Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Customizes image upload behavior for the TinyMCE editor by specifying storage disk, directory, and file visibility. Uses methods from the HasFileAttachments trait. ```php TinyEditor::make('content')->fileAttachmentsDisk('local')->fileAttachmentsVisibility('public')->fileAttachmentsDirectory('uploads') ``` -------------------------------- ### Configure Image Uploads for TinyMCE Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Specify the storage disk, directory, and visibility for image uploads in the TinyMCE editor. Use 'public' disk and directory for accessible images. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; // Configure image upload destination TinyEditor::make('content') ->fileAttachmentsDisk('public') ->fileAttachmentsDirectory('article-images') ->fileAttachmentsVisibility('public') ->label('Article with Images'); // Using S3 storage TinyEditor::make('content') ->fileAttachmentsDisk('s3') ->fileAttachmentsDirectory('uploads/posts') ->fileAttachmentsVisibility('public') ->label('Cloud-stored Content'); ``` -------------------------------- ### Show Editor Menubar Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Enables the display of the menubar in the TinyMCE editor. The menubar provides access to file, edit, insert, view, format, tools, and help menus. ```php TinyEditor::make('content')->showMenuBar() ``` -------------------------------- ### Define Custom TinyMCE Configurations Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Extend TinyMCE functionality by defining custom configurations within the `custom_configs` array in the `filament-forms-tinyeditor.php` configuration file. ```php // config/filament-forms-tinyeditor.php return [ 'profiles' => [ 'advanced' => [ 'plugins' => 'advlist autoresize codesample image imagetools link lists media table wordcount', 'toolbar' => 'undo redo | formatselect | bold italic | image link | codesample', 'upload_directory' => 'uploads', 'custom_configs' => [ 'image_advtab' => true, 'image_caption' => true, 'link_default_target' => '_blank', 'codesample_global_prismjs' => true, 'allow_html_in_named_anchor' => true, 'image_class_list' => [ ['title' => 'None', 'value' => ''], ['title' => 'Responsive', 'value' => 'img-fluid'], ['title' => 'Thumbnail', 'value' => 'img-thumbnail'], ['title' => 'Rounded', 'value' => 'rounded'], ], 'link_class_list' => [ ['title' => 'None', 'value' => ''], ['title' => 'Primary Button', 'value' => 'btn btn-primary'], ['title' => 'External Link', 'value' => 'external-link'], ], ], ], ], ]; // Usage TinyEditor::make('content') ->profile('advanced') ->label('Advanced Content Editor'); ``` -------------------------------- ### Apply Custom Editor Profile Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Applies a named editor profile to a TinyEditor instance. Ensure the profile is defined in the configuration file. ```php TinyEditor::make('content')->profile('your-profile-name') ``` -------------------------------- ### Custom Profile Configuration in config file Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Define custom toolbar profiles in the `config/filament-forms-tinyeditor.php` file. These profiles specify enabled plugins, toolbar layout, and upload directories. ```php // config/filament-forms-tinyeditor.php return [ 'profiles' => [ 'default' => [ 'plugins' => 'advlist autoresize codesample directionality emoticons fullscreen hr image imagetools link lists media table toc wordcount', 'toolbar' => 'undo redo removeformat | formatselect fontsizeselect | bold italic | rtl ltr | alignjustify alignright aligncenter alignleft | numlist bullist | forecolor backcolor | blockquote table toc hr | image link media codesample emoticons | wordcount fullscreen', 'upload_directory' => null, ], 'minimal' => [ 'plugins' => 'autoresize link lists', 'toolbar' => 'bold italic underline | bullist numlist | link', 'upload_directory' => 'minimal-uploads', ], 'blog' => [ 'plugins' => 'advlist autoresize codesample image imagetools link lists media table wordcount', 'toolbar' => 'undo redo | formatselect | bold italic | alignleft aligncenter alignright | bullist numlist | image link media | codesample', 'upload_directory' => 'blog-images', ], ], ]; ``` -------------------------------- ### Add External TinyMCE Plugins Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Integrate external TinyMCE plugins not included in the core bundle by specifying their paths using `setExternalPlugins()`. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; // Add external plugins with their URLs TinyEditor::make('content') ->setExternalPlugins([ 'powerpaste' => 'https://cdn.example.com/tinymce/plugins/powerpaste/plugin.min.js', 'mentions' => '/js/tinymce/plugins/mentions/plugin.min.js', ]) ->profile('default') ->label('Enhanced Editor'); ``` -------------------------------- ### Set Minimum Editor Height Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Sets the minimum height for the TinyMCE editor in pixels. The editor will resize automatically up to this minimum height. ```php TinyEditor::make('content')->minHeight(300) ``` -------------------------------- ### Basic TinyEditor Usage in Filament Form Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Integrate the TinyEditor component into your Filament form schema by using the `make()` method with the field name. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; // In a Filament Resource or Form public static function form(Form $form): Form { return $form ->schema([ TinyEditor::make('content') ->label('Article Content') ->required(), ]); } ``` -------------------------------- ### Configure TinyMCE URL Handling Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Control how TinyMCE handles URLs for links and images. Use `setRelativeUrls(false)` to disable relative URL conversion and `setRemoveScriptHost(false)` to retain the protocol and host. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; // Use absolute URLs (disable relative URL conversion) TinyEditor::make('content') ->setRelativeUrls(false) ->setRemoveScriptHost(false) ->setConvertUrls(false) ->label('Content with Absolute URLs'); // Set document base URL for relative paths TinyEditor::make('content') ->documentBaseUrl('https://example.com/') ->setRelativeUrls(true) ->label('Content'); // Default URL settings (all true): // - relativeUrls: true (converts URLs to relative) // - removeScriptHost: true (removes protocol and host) // - convertUrls: true (normalizes URLs) ``` -------------------------------- ### Set TinyMCE Editor Language Source: https://context7.com/mohamedsabil83/filament-forms-tinyeditor/llms.txt Set the editor interface language using the `language()` method. Supports over 50 languages and can dynamically detect user preferences. ```php use Mohamedsabil83\FilamentFormsTinyeditor\Components\TinyEditor; // Force Arabic interface TinyEditor::make('content') ->language('ar') ->label('المحتوى'); // Force French interface TinyEditor::make('content') ->language('fr') ->label('Contenu'); // Dynamic language based on user preference TinyEditor::make('content') ->language(fn () => auth()->user()->preferred_language ?? 'en') ->label('Content'); // Supported languages include: ar, az, bg, bn, ca, cs, cy, da, de, dv, el, eo, es, et, eu, // fa, fi, fr, ga, gl, he, hr, hu, hy, id, is, it, ja, kab, kk, ko, ku, lt, lv, nb, nl, // oc, pl, pt, ro, ru, sk, sl, sq, sr, sv, ta, tg, th, tr, ug, uk, vi, zh, zh_TW ``` -------------------------------- ### Set Maximum Editor Height Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Sets the maximum height for the TinyMCE editor in pixels. The editor will resize automatically down to this maximum height. ```php TinyEditor::make('content')->maxHeight(300) ``` -------------------------------- ### Set Editor Language Source: https://github.com/mohamedsabil83/filament-forms-tinyeditor/blob/2.x/docs/usage-and-customization.md Forces the TinyMCE editor to use a specific language for its UI elements and toolbar button labels. Useful for overriding the default locale. ```php TinyEditor::make('content')->language('ar') ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.