This repository was archived by the owner on Mar 18, 2025. It is now read-only.
File tree Expand file tree Collapse file tree 1 file changed +24
-0
lines changed Expand file tree Collapse file tree 1 file changed +24
-0
lines changed Original file line number Diff line number Diff line change @@ -112,3 +112,27 @@ specify an option callbacks, such as `server` that you need to:
112
112
</x-slot >
113
113
</x-file-pond >
114
114
```
115
+
116
+ ## Plugins
117
+
118
+ The ` file-pond ` component doesn't make use of any FilePond plugins itself, but you can easily install and implement your own plugins.
119
+
120
+ First, install the necessary JavaScript and CSS required by the plugin. A list of plugins [ can be found here] ( https://pqina.nl/filepond/plugins.html ) .
121
+
122
+ With the plugin's assets installed, you can make use of the ` plugins ` slot to initialize the plugin. The following example shows setting up the image
123
+ preview FilePond Plugin.
124
+
125
+ ``` html
126
+ <x-file-pond wire:model =" avatar" >
127
+ <x-slot name =" plugins" >
128
+ FilePond.registerPlugin(FilePondPluginImagePreview);
129
+ </x-slot >
130
+ </x-file-pond >
131
+ ```
132
+
133
+ If you're into using CDNs, you can add these lines to your layout file for the above example:
134
+
135
+ ``` html
136
+ <link href =" https://unpkg.com/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css" rel =" stylesheet" >
137
+ <script src =" https://unpkg.com/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.js" ></script >
138
+ ```
You can’t perform that action at this time.
0 commit comments