amidesfahani / filament-tinyeditor

a TineMce editor for Laravel Filament Forms
MIT License
46 stars 16 forks source link

Custom config for image plugin #66

Closed TheRealDarkCoder closed 1 week ago

TheRealDarkCoder commented 2 weeks ago

I am trying to implement image_caption to be true for the image plugin. https://www.tiny.cloud/docs/tinymce/latest/image/#image_caption

Where do i specify this?

I've tried setting it under filament-tinyeditor

   'extra' => [
        'toolbar' => [
            'fontsize' => '10px 12px 13px 14px 16px 18px 20px',
        ],
       'image_caption' => true
    ],

and also in the views

    <div wire:ignore x-ignore ax-load
        ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('tinyeditor', 'amidesfahani/filament-tinyeditor') }}"
        x-load-css="[@js(\Filament\Support\Facades\FilamentAsset::getStyleHref('tiny-css', package: 'amidesfahani/filament-tinyeditor'))]" x-load-js="[@js(\Filament\Support\Facades\FilamentAsset::getScriptSrc($getLanguageId(), package: 'amidesfahani/filament-tinyeditor'))]" x-data="tinyeditor({
             state: $wire.{{ $applyStateBindingModifiers("entangle('{$statePath}')", isOptimisticallyLive: false) }},
             ...
            image_caption: 'true',
            ...

None of which worked.

robinmalburn commented 2 weeks ago

I stumbled upon this whilst looking for support for something else; you can get this working using custom_configs as part of a profile in config/filament-tinyeditor.php, like below:

    'profiles' => [
        'default' => [
            'plugins' => 'accordion autoresize codesample directionality advlist link image lists preview pagebreak searchreplace wordcount code fullscreen insertdatetime media table emoticons',
            'toolbar' => 'undo redo removeformat | fontfamily fontsize fontsizeinput font_size_formats styles | bold italic underline | rtl ltr | alignjustify alignleft aligncenter alignright | numlist bullist outdent indent | forecolor backcolor | blockquote table toc hr | image link media codesample emoticons | wordcount fullscreen',
            'upload_directory' => null,
            'custom_configs' => [
                'image_caption' => true,
            ]
        ],
TheRealDarkCoder commented 1 week ago

I stumbled upon this whilst looking for support for something else; you can get this working using custom_configs as part of a profile in config/filament-tinyeditor.php, like below:

    'profiles' => [
        'default' => [
            'plugins' => 'accordion autoresize codesample directionality advlist link image lists preview pagebreak searchreplace wordcount code fullscreen insertdatetime media table emoticons',
            'toolbar' => 'undo redo removeformat | fontfamily fontsize fontsizeinput font_size_formats styles | bold italic underline | rtl ltr | alignjustify alignleft aligncenter alignright | numlist bullist outdent indent | forecolor backcolor | blockquote table toc hr | image link media codesample emoticons | wordcount fullscreen',
            'upload_directory' => null,
            'custom_configs' => [
                'image_caption' => true,
            ]
        ],

This works! Thanks.