2.0.3 • Published 5 months ago
@payload-bites/image-search v2.0.3
Image search
Search for images from the comfort of your own CMS using various image providers.
https://github.com/user-attachments/assets/b99bb160-788f-4689-9e40-005a6fe0bced
Compatibility table
| Payload version | Image search version |
|---|---|
| v3.18.0 or earlier | Incompatible |
| v3.19.0 to v3.23.0 | v1.x |
| v3.24.0 or later | v2.x |
Quick start
- Install the plugin:
pnpm add @payload-bites/image-search- Add environment variables:
| Name | CORS URL | Description |
|---|---|---|
| API_KEY_UNSPLASH | https://images.unsplash.com | The key you configured to use the Unsplash API |
| API_KEY_PEXELS | https://images.pexels.com | The key you configured to use the Pexels API |
| API_KEY_PIXABAY | https://pixabay.com | The key you configured to use the Pixabay API |
!IMPORTANT At least one API key is required to use this plugin.
- Add the plugin to your
payload.config.ts:
/// ....
import { imageSearchPlugin } from "@payload-bites/image-search";
export default buildConfig({
// ...
plugins: [
// ...
imageSearchPlugin({
// ...
}),
],
});Defaults
For defaults, refer to defaults.ts.
Options
For options, refer to types.ts.
Providers
A provider is an online image library that allows you to view and download images for use in your own projects. In order to use them, you must register an API key with the provider and assign it to its respective environment variable in your project.
Liability
Before using any provider, ensure you have reviewed and agreed to their terms and usage policies. Contributors to this plugin are not responsible for how these images are used.
Roadmap
- Image search bulk upload (awaiting custom component implementation by Payload team - discussion).
- Translations.
- Custom access control for provider endpoints.