diff --git a/docs/.vuepress/config/sidebar-developer.js b/docs/.vuepress/config/sidebar-developer.js index 629a076ab0..a9eae8faa5 100644 --- a/docs/.vuepress/config/sidebar-developer.js +++ b/docs/.vuepress/config/sidebar-developer.js @@ -214,6 +214,7 @@ const developer = [ ['/developer-docs/latest/development/admin-customization', 'Admin panel customization'], ['/developer-docs/latest/development/plugins-extension.md', 'Plugins extension'], ['/developer-docs/latest/development/plugins-development.md', 'Plugins development'], + ['/developer-docs/latest/development/custom-fields.md', 'Custom fields'], ['/developer-docs/latest/development/typescript.md', 'TypeScript'], ['/developer-docs/latest/development/providers.md', 'Providers'], ], diff --git a/docs/developer-docs/latest/developer-resources/plugin-api-reference/admin-panel.md b/docs/developer-docs/latest/developer-resources/plugin-api-reference/admin-panel.md index f44f9b6881..69fbfe71b9 100644 --- a/docs/developer-docs/latest/developer-resources/plugin-api-reference/admin-panel.md +++ b/docs/developer-docs/latest/developer-resources/plugin-api-reference/admin-panel.md @@ -49,6 +49,7 @@ Within the register function, a plugin can: * [create a new settings section](#createsettingsection) * define [injection zones](#injection-zones-api) * [add reducers](#reducers-api) +* register the admin panel part of [custom fields](/developer-docs/latest/development/custom-fields.md#registering-a-custom-field-in-the-admin-panel) #### registerPlugin() @@ -180,6 +181,7 @@ The Admin Panel API allows a plugin to take advantage of several small APIs to p | Declare an injection zone | [Injection Zones API](#injection-zones-api) | [`registerPlugin()`](#registerplugin) | [`register()`](#register) | | Add a reducer | [Reducers API](#reducers-api) | [`addReducers()`](#reducers-api) | [`register()`](#register) | | Create a hook | [Hooks API](#hooks-api) | [`createHook()`](#hooks-api) | [`register()`](#register) | +| Register the admin panel part of a custom field | APIs for custom fields (see [custom fields documentation](/developer-docs/latest/development/custom-fields.md)) | `app.customFields.register()` | `register()` | | Add a single link to a settings section | [Settings API](#settings-api) | [`addSettingsLink()`](#addsettingslink) | [`bootstrap()`](#bootstrap) | | Add multiple links to a settings section | [Settings API](#settings-api) | [`addSettingsLinks()`](#addsettingslinks) | [`bootstrap()`](#bootstrap) | | Inject a Component in an injection zone | [Injection Zones API](#injection-zones-api) | [`injectComponent()`](#injection-zones-api) | [`bootstrap()`](#register) | diff --git a/docs/developer-docs/latest/developer-resources/plugin-api-reference/server.md b/docs/developer-docs/latest/developer-resources/plugin-api-reference/server.md index b7c03bd8dd..281a9d9072 100644 --- a/docs/developer-docs/latest/developer-resources/plugin-api-reference/server.md +++ b/docs/developer-docs/latest/developer-resources/plugin-api-reference/server.md @@ -28,7 +28,7 @@ To tap into the Server API, create a `strapi-server.js` file at the root of the ### register() -This function is called to load the plugin, even before the application is actually [bootstrapped](#bootstrap), in order to register [permissions](/developer-docs/latest/plugins/users-permissions.md) or database migrations. +This function is called to load the plugin, before the application is [bootstrapped](#bootstrap), in order to register [permissions](/developer-docs/latest/plugins/users-permissions.md), the server part of [custom fields](/developer-docs/latest/development/custom-fields.md#registering-a-custom-field-on-the-server), or database migrations. **Type**: `Function` diff --git a/docs/developer-docs/latest/development/backend-customization/models.md b/docs/developer-docs/latest/development/backend-customization/models.md index abd3d3f1dd..03fa143f08 100644 --- a/docs/developer-docs/latest/development/backend-customization/models.md +++ b/docs/developer-docs/latest/development/backend-customization/models.md @@ -104,8 +104,9 @@ Many types of attributes are available: - scalar types (e.g. strings, dates, numbers, booleans, etc.), - Strapi-specific types, such as: - - `media`, for files uploaded through the [Media library](/user-docs/latest/content-types-builder/configuring-fields-content-type.md#media) + - `media` for files uploaded through the [Media library](/user-docs/latest/content-types-builder/configuring-fields-content-type.md#media) - `relation` to describe a [relation](#relations) between content-types + - `customField` to describe [custom fields](#custom-fields) and their specific keys - `component` to define a [component](#components-2) (i.e. a data structure usable in multiple content-types) - `dynamiczone` to define a [dynamic zone](#dynamic-zones) (i.e. a flexible space based on a list of components) - and the `locale` and `localizations` types, only used by the [Internationalization (i18n) plugin](/developer-docs/latest/plugins/i18n.md) @@ -118,7 +119,7 @@ The `type` parameter of an attribute should be one of the following values: | Date types | | | Number types | | | Other generic types | | -| Special types unique to Strapi | | +| Special types unique to Strapi | | | Internationalization (i18n)-related types

_Can only be used if the [i18n plugin](/developer-docs/latest/plugins/i18n.md) is installed_| | #### Validations @@ -494,6 +495,35 @@ The `tableName` key defines the name of the join table. It has to be specified o ::::: +#### Custom fields + +[Custom fields](/developer-docs/latest/development/custom-field.md) extend Strapi’s capabilities by adding new types of fields to content-types. Custom fields are explicitly defined in the [attributes](#model-attributes) of a model with `type: customField`. +Custom fields' attributes also accept: + +Custom fields' attributes also show the following specificities: +- a `customField` attribute whose value acts as a unique identifier to indicate which registered custom field should be used. Its value follows: + - either the `plugin::plugin-name.field-name` format if a plugin created the custom field + - or the `global::field-name` format for a custom field specific to the current Strapi application +- and additional parameters depending on what has been defined when registering the custom field (see [custom fields documentation](/developer-docs/latest/development/custom-fields.md)). + +```json +// path: ./src/api/[apiName]/[content-type-name]/content-types/schema.json + +{ + // … + "attributes": { + "attributeName": { // attributeName would be replaced by the actual attribute name + "type": "customField", + "customField": "plugin::color-picker.color", + "options": { + "format": "hex" + } + } + } + // … +} +``` + #### Components Component fields create a relation between a content-type and a component structure. Components are explicitly defined in the [attributes](#model-attributes) of a model with `type: 'component'` and accept the following additional parameters: diff --git a/docs/developer-docs/latest/development/custom-fields.md b/docs/developer-docs/latest/development/custom-fields.md new file mode 100644 index 0000000000..44bf2a9f8d --- /dev/null +++ b/docs/developer-docs/latest/development/custom-fields.md @@ -0,0 +1,340 @@ +--- +title: Custom fields reference - Strapi Developer Docs +description: Learn how you can use custom fields to extend Strapi's content-types capabilities. +sidebarDepth: 3 +canonicalUrl: https://docs.strapi.io/developer-docs/latest/development/custom-fields.html +--- + +# Custom fields + +Custom fields extend Strapi’s capabilities by adding new types of fields to content-types and components. Once created or installed, custom fields can be used in the Content-Type Builder and Content Manager just like built-in fields. + +The present documentation is intended for custom field creators: it describes which APIs and functions developers must use to create a new custom field. The [user guide](/user-docs/latest/plugins/introduction-to-plugins.md#custom-fields) describes how to install and use custom fields from Strapi's admin panel. + + + + +It is recommended that you develop a dedicated [plugin](/developer-docs/latest/development/plugins-development.md) for custom fields. Custom-field plugins include both a server and admin panel part. The custom field must be registered in both parts before it is usable in Strapi's admin panel. + +Once created and used, custom fields are defined like any other attribute in the model's schema. An attribute using a custom field will have its type represented as `customField` (i.e. `type: 'customField'`). Depending on the custom field being used a few additional properties may be present in the attribute's definition (see [models documentation](/developer-docs/latest/development/backend-customization/models.md#custom-fields)). + +::: note NOTES +* Though the recommended way to add a custom field is through creating a plugin, app-specific custom fields can also be registered within the global `register` [function](/developer-docs/latest/setup-deployment-guides/configurations/optional/functions.md) found in `src/index.js` and `src/admin/app/js` files. +* Custom fields can only be shared using plugins. +::: + +## Registering a custom field on the server + +::: prerequisites +!!!include(developer-docs/latest/development/snippets/custom-field-requires-plugin.md)!!! +::: + +Strapi's server needs to be aware of all the custom fields to ensure that an attribute using a custom field is valid. + +The `strapi.customFields` object exposes a `register()` method on the `Strapi` instance. This method is used to register custom fields on the server during the plugin's server [register lifecycle](/developer-docs/latest/developer-resources/plugin-api-reference/server.md#register). + +`strapi.customFields.register()` registers one or several custom field(s) on the server by passing an object (or an array of objects) with the following parameters: + +| Parameter | Description | Type | +| ------------------------------ | ------------------------------------------------- | -------- | +| `name` | The name of the custom field | `String` | +| `plugin`

(_optional_) | The name of the plugin creating the custom fields | `String` | +| `type` | The data type the custom field will use | `String` | + +::: note +Currently, custom fields cannot add new data types to Strapi and must use existing, built-in Strapi data types described in the [models' attributes](/developer-docs/latest/development/backend-customization/models.md#model-attributes) documentation. Special data types unique to Strapi, such as relation, media, component, or dynamic zone data types, cannot be used in custom fields. +::: + +::: details Example: Registering an example "color" custom field on the server: + +```js +// path: ./src/plugins/my-custom-field-plugin/strapi-server.js + +module.exports = { + register({ strapi }) { + strapi.customFields.register({ + name: 'color', + plugin: 'color-picker', + type: 'text', + }); + }, +}; +``` + +::: + +## Registering a custom field in the admin panel + +::: prerequisites +!!!include(developer-docs/latest/development/snippets/custom-field-requires-plugin.md)!!! +::: + +Custom fields must be registered in Strapi's admin panel to be available in the Content-type Builder and the Content Manager. + +The `app.customFields` object exposes a `register()` method on the `StrapiApp` instance. This method is used to register custom fields in the admin panel during the plugin's admin [register lifecycle](/developer-docs/latest/developer-resources/plugin-api-reference/admin-panel.md#register). + +`app.customFields.register()` registers one or several custom field(s) in the admin panel by passing an object (or an array of objects) with the following parameters: + +| Parameter | Description | Type | +| -------------------------------- | ------------------------------------------------------------------------ | --------------------- | +| `name` | Name of the custom field | `String` | +| `pluginId`

(_optional_) | Name of the plugin creating the custom field | `String` | +| `type` | Existing Strapi data type the custom field will use

❗️ Relations, media, components, or dynamic zones cannot be used. | `String` | +| `icon`

(_optional_) | Icon for the custom field | `React.ComponentType` | +| `intlLabel` | Translation for the name | [`IntlObject`](https://formatjs.io/docs/react-intl/) | +| `intlDescription` | Translation for the description | [`IntlObject`](https://formatjs.io/docs/react-intl/) | +| `components` | Components needed to display the custom field in the Content Manager (see [components](#components)) | +| `options`

(_optional_) | Options to be used by the Content-type Builder (see [options](#options)) | `Object` | + +::: details Example: Registering an example "color" custom field in the admin panel: + +```jsx +// path: ./src/plugins/color-picker/strapi-admin.js + +register(app) { + app.customFields.register({ + name: "color", + pluginId: "color-picker", // the custom field is created by a color-picker plugin + type: "string", // the color will be stored as a string + intlLabel: { + id: "color-picker.color.label", + defaultMessage: "Color", + }, + intlDescription: { + id: "color-picker.color.description", + defaultMessage: "Select any color", + } + icon: ColorIcon, + components: { + Input: async () => import(/* webpackChunkName: "input-component" */ "./Input"), + } + options: { + base: [ + /* + Declare settings to be added to the "Base settings" section + of the field in the Content-Type Builder + */ + { + sectionTitle: { // Add a "Format" settings section + id: 'color-picker.color.section.format', + defaultMessage: 'Format', + }, + items: [ // Add settings items to the section + { + /* + Add a "Color format" dropdown + to choose between 2 different format options + for the color value: hexadecimal or RGBA + */ + intlLabel: { + id: 'color-picker.color.format.label', + defaultMessage: 'Color format', + }, + name: 'options.format', + type: 'select', + value: 'hex', // option selected by default + options: [ // List all available "Color format" options + { + key: 'hex', + value: 'hex', + metadatas: { + intlLabel: { + id: 'color-picker.color.format.hex', + defaultMessage: 'Hexadecimal', + }, + }, + }, + { + key: 'rgba', + value: 'rgba', + metadatas: { + intlLabel: { + id: 'color-picker.color.format.rgba', + defaultMessage: 'RGBA', + }, + }, + }, + ], + }, + ], + }, + ], + advanced: [ + /* + Declare settings to be added to the "Advanced settings" section + of the field in the Content-Type Builder + */ + ], + validator: args => ({ + format: yup.string().required({ + id: 'options.color-picker.format.error', + defaultMessage: 'The color format is required', + }), + }) + }), + }, + }); +} +``` + +::: + +### Components + +`app.customFields.register()` must pass a `components` object with an `Input` React component to use in the Content Manager's edit view. + +::: details Example: Registering an Input component + +```js +// path: ./src/plugins/my-custom-field-plugin/strapi-admin.js + +register(app) { + app.customFields.register({ + // … + components: { + Input: async () => import(/* webpackChunkName: "input-component" */ "./Input"), + } + // … + }); +} +``` + +::: + +::: tip +The `Input` React component receives several props. The [`ColorPickerInput` file](https://github.com/strapi/strapi/blob/features/custom-fields/examples/getstarted/src/plugins/mycustomfields/admin/src/components/ColorPicker/ColorPickerInput/index.js#L10-L21) in the Strapi codebase gives you an example of how they can be used. +::: + + +### Options + +`app.customFields.register()` can pass an additional `options` object with the following parameters: + +| Options parameter | Description | Type | +| -------------- | ------------------------------------------------------------------------------- | ----------------------- | +| `base` | Settings available in the _Base settings_ tab of the field in the Content-type Builder | `Object` or `Array of Objects` | +| `advanced` | Settings available in the _Advanced settings_ tab of the field in the Content-type Builder | `Object` or `Array of Objects` | +| `validator` | Validator function returning an object, used to sanitize input. Uses a [`yup` schema object](https://github.com/jquense/yup/tree/pre-v1). | `Function` | + +Both `base` and `advanced` settings accept an object or an array of objects, each object being a settings section. Each settings section could include: + +- a `sectionTitle` to declare the title of the section as an [`IntlObject`](https://formatjs.io/docs/react-intl/) +- and a list of `items` as an array of objects. + +Each object in the `items` array can contain the following parameters: + +| Items parameter | Description | Type | +| --------------- | ------------------------------------------------------------------ | ---------------------------------------------------- | +| `name` | Label of the input.
Must use the `options.settingName` format. | `String` | +| `description` | Description of the input to use in the Content-type Builder | `String` | +| `intlLabel` | Translation for the label of the input | [`IntlObject`](https://formatjs.io/docs/react-intl/) | +| `type` | Type of the input (e.g., `select`, `checkbox`) | `String` | + + + +::: details Example: Declaring options for an example "color" custom field: + +```jsx +// path: ./src/plugins/my-custom-field-plugin/strapi-admin.js + +register(app) { + app.customFields.register({ + // … + options: { + base: [ + { + intlLabel: { + id: 'color-picker.color.format.label', + defaultMessage: 'Color format', + }, + name: 'options.format', + type: 'select', + value: 'hex', + options: [ + { + key: '__null_reset_value__', + value: '', + metadatas: { + intlLabel: { + id: 'color-picker.color.format.placeholder', + defaultMessage: 'Select a format', + }, + hidden: true, + }, + }, + { + key: 'hex', + value: 'hex', + metadatas: { + intlLabel: { + id: 'color-picker.color.format.hex', + defaultMessage: 'Hexadecimal', + }, + }, + }, + { + key: 'rgba', + value: 'rgba', + metadatas: { + intlLabel: { + id: 'color-picker.color.format.rgba', + defaultMessage: 'RGBA', + }, + }, + }, + ], + }, + ], + advanced: [ + { + sectionTitle: { + id: 'global.settings', + defaultMessage: 'Settings', + }, + items: [ + { + name: 'required', + type: 'checkbox', + intlLabel: { + id: 'form.attribute.item.requiredField', + defaultMessage: 'Required field', + }, + description: { + id: 'form.attribute.item.requiredField.description', + defaultMessage: "You won't be able to create an entry if this field is empty", + }, + }, + { + name: 'private', + type: 'checkbox', + intlLabel: { + id: 'form.attribute.item.privateField', + defaultMessage: 'Private field', + }, + description: { + id: 'form.attribute.item.privateField.description', + defaultMessage: 'This field will not show up in the API response', + }, + }, + ], + }, + ], + validator: args => ({ + format: yup.string().required({ + id: 'options.color-picker.format.error', + defaultMessage: 'The color format is required', + }), + }), + }, + }); +} +``` + +::: + + +::: tip +The Strapi codebase gives an example of how settings objects can be described: check the [`baseForm.js`](https://github.com/strapi/strapi/blob/main/packages/core/content-type-builder/admin/src/components/FormModal/attributes/baseForm.js) file for the `base` settings and the [`advancedForm.js`](https://github.com/strapi/strapi/blob/main/packages/core/content-type-builder/admin/src/components/FormModal/attributes/advancedForm.js) file for the `advanced` settings. The base form lists the settings items inline but the advanced form gets the items from an [`attributeOptions.js`](https://github.com/strapi/strapi/blob/main/packages/core/content-type-builder/admin/src/components/FormModal/attributes/attributeOptions.js) file. +::: diff --git a/docs/developer-docs/latest/development/plugins-development.md b/docs/developer-docs/latest/development/plugins-development.md index 09587101ed..9b0dbd70fc 100644 --- a/docs/developer-docs/latest/development/plugins-development.md +++ b/docs/developer-docs/latest/development/plugins-development.md @@ -65,6 +65,10 @@ Strapi provides a [command line interface (CLI)](/developer-docs/latest/develope Plugins created using the preceding directions are located in the `plugins` directory of the application (see [project structure](/developer-docs/latest/setup-deployment-guides/file-structure.md)). +::: tip +Check [this blog post](https://strapi.io/blog/how-to-create-a-strapi-v4-plugin-publish-on-npm-6-6) to learn how to publish your Strapi plugin on npm. +::: + ## Add features to a plugin Strapi provides programmatic APIs for plugins to hook into some of Strapi's features. @@ -72,3 +76,8 @@ Strapi provides programmatic APIs for plugins to hook into some of Strapi's feat Plugins can register with the server and/or the admin panel, by looking for entry point files at the root of the package: - `strapi-server.js` for the Server (see [Server API](/developer-docs/latest/developer-resources/plugin-api-reference/server.md)), - `strapi-admin.js` for the admin panel (see [Admin Panel API](/developer-docs/latest/developer-resources/plugin-api-reference/admin-panel.md)). + +::: strapi Custom fields plugins +Plugins can also be used to add [custom fields](/developer-docs/latest/development/custom-fields.md) to Strapi. +::: + diff --git a/docs/developer-docs/latest/development/snippets/custom-field-requires-plugin.md b/docs/developer-docs/latest/development/snippets/custom-field-requires-plugin.md new file mode 100644 index 0000000000..7828ce9979 --- /dev/null +++ b/docs/developer-docs/latest/development/snippets/custom-field-requires-plugin.md @@ -0,0 +1 @@ +Registering a custom field through a plugin requires creating and enabling a plugin (see [Plugins development](/developer-docs/latest/development/plugins-development.md#create-a-plugin)). diff --git a/docs/developer-docs/latest/plugins/email.md b/docs/developer-docs/latest/plugins/email.md index 00eafa7207..3c4fc8d572 100644 --- a/docs/developer-docs/latest/plugins/email.md +++ b/docs/developer-docs/latest/plugins/email.md @@ -121,4 +121,4 @@ module.exports = { } } } -``` \ No newline at end of file +``` diff --git a/docs/developer-docs/latest/setup-deployment-guides/configurations/optional/functions.md b/docs/developer-docs/latest/setup-deployment-guides/configurations/optional/functions.md index d6ba58a529..58b0680280 100644 --- a/docs/developer-docs/latest/setup-deployment-guides/configurations/optional/functions.md +++ b/docs/developer-docs/latest/setup-deployment-guides/configurations/optional/functions.md @@ -15,7 +15,8 @@ It can be used to: - [extend plugins](/developer-docs/latest/development/plugins-extension.md#extending-a-plugin-s-interface) - extend [content-types](/developer-docs/latest/development/backend-customization/models.md) programmatically -- load some [environment variables](/developer-docs/latest/setup-deployment-guides/configurations/optional/environment.md). +- load some [environment variables](/developer-docs/latest/setup-deployment-guides/configurations/optional/environment.md) +- register a [custom field](/developer-docs/latest/development/custom-fields.md) that would be used only by the current Strapi application. ## Bootstrap diff --git a/docs/package.json b/docs/package.json index d1e2ecb945..dfc3b5664a 100644 --- a/docs/package.json +++ b/docs/package.json @@ -1,6 +1,6 @@ { "name": "strapi-docs", - "version": "4.3.5", + "version": "4.4.0-alpha.0", "main": "index.js", "scripts": { "dev": "yarn create:config-file && vuepress dev", diff --git a/docs/user-docs/latest/assets/content-types-builder/fields-selection.png b/docs/user-docs/latest/assets/content-types-builder/fields-selection.png index 6d8b4ca52f..b3841a48d9 100644 Binary files a/docs/user-docs/latest/assets/content-types-builder/fields-selection.png and b/docs/user-docs/latest/assets/content-types-builder/fields-selection.png differ diff --git a/docs/user-docs/latest/content-manager/writing-content.md b/docs/user-docs/latest/content-manager/writing-content.md index 06767c7021..0d4a77bb89 100644 --- a/docs/user-docs/latest/content-manager/writing-content.md +++ b/docs/user-docs/latest/content-manager/writing-content.md @@ -30,6 +30,10 @@ To write or edit content: | Media | 1. Click the media area.
2. Choose an asset from the [Media Library](/user-docs/latest/media-library/introduction-to-media-library.md) or from a [folder](/user-docs/latest/media-library/organizing-assets-with-folders.md) if you created some, or click the **Add more assets** button to add a new file to the Media Library.

💡 It is possible to drag and drop the chosen file in the media area. | | JSON | Write your content, in JSON format, in the code textbox. | | UID | Write a unique identifier in the textbox. A "Regenerate" button, displayed on the right of the box, allows to automatically generate a UID based on the content-type name. | +::: note +Filling out a [custom field](/user-docs/latest/content-types-builder/configuring-fields-content-type.md#custom-fields) depends on the type of content handled by the field. Please refer to the dedicated documentation for each custom field hosted on the [Marketplace](https://market.strapi.io). + +::: ### Components diff --git a/docs/user-docs/latest/content-types-builder/configuring-fields-content-type.md b/docs/user-docs/latest/content-types-builder/configuring-fields-content-type.md index 21404e4836..ff327ec9c6 100644 --- a/docs/user-docs/latest/content-types-builder/configuring-fields-content-type.md +++ b/docs/user-docs/latest/content-types-builder/configuring-fields-content-type.md @@ -13,16 +13,19 @@ canonicalUrl: https://docs.strapi.io/user-docs/latest/content-types-builder/conf Content-types are composed of one or several fields. Each field is designed to contain specific kind of data, filled up in the Content Manager (see [Writing content](/user-docs/latest/content-manager/writing-content.md)). -In the Content-type Builder, fields can be added at the creation of a new content-type or component, or afterward when a content-type or component is edited or updated. The following documentation lists all existing regular fields but also tackles the specificities of components and dynamic zones. For each, you will find a definition, explanation of the form they take once in the Content Manager, and instructions to configure them. +In the Content-type Builder, fields can be added at the creation of a new content-type or component, or afterward when a content-type or component is edited or updated. The following documentation lists all existing regular fields but also tackles the specificities of custom fields, components, and dynamic zones. For each, you will find a definition, explanation of the form they take once in the Content Manager, and instructions to configure them. ::: note -Depending on what content-type or component is being created or edited, not all fields -including components and dynamic zones- are always available. +Depending on which content-type or component is being created or edited, not all fields — including components and dynamic zones — are always available. ::: + Field selection ## Regular fields +Regular fields are Strapi's default, built-in types of fields. Regular fields are listed in the _Default_ tab when selecting a field for a content-type. + ### Text The Text field displays a textbox that can contain small text. This field can be used for titles, descriptions, etc. @@ -392,6 +395,13 @@ The UID field displays a field that sets a unique identifier, optionally based o :::: + +## Custom fields + +Custom fields are a way to extend Strapi’s capabilities by adding new types of fields to content-types or components. Once installed (see [Marketplace](/user-docs/latest/plugins/installing-plugins-via-marketplace.md) documentation), custom fields are listed in the _Custom_ tab when selecting a field for a content-type. + +Each custom field type can have basic and advanced settings. The [Marketplace](https://market.strapi.io/) lists available custom fields, and hosts dedicated documentation for each custom field, including specific settings. + ## Components Components are a combination of several fields. Components allow to create reusable sets of fields, that can be quickly added to content-types, dynamic zones but also nested into other components. diff --git a/docs/user-docs/latest/plugins/installing-plugins-via-marketplace.md b/docs/user-docs/latest/plugins/installing-plugins-via-marketplace.md index 40757a4351..5664f99783 100644 --- a/docs/user-docs/latest/plugins/installing-plugins-via-marketplace.md +++ b/docs/user-docs/latest/plugins/installing-plugins-via-marketplace.md @@ -1,6 +1,6 @@ --- -title: Installing plugins via the Marketplace - Strapi User Guide -description: Instructions to install new plugins in a Strapi application via the Marketplace. +title: Using the Marketplace - Strapi User Guide +description: Instructions to install new plugins and providers in a Strapi application via the Marketplace. canonicalUrl: https://docs.strapi.io/user-docs/latest/plugins/installing-plugins-via-marketplace.html --- @@ -9,14 +9,15 @@ canonicalUrl: https://docs.strapi.io/user-docs/latest/plugins/installing-plugins The Marketplace is where users can find additional plugins to customize Strapi applications, and additional [providers](./introduction-to-plugins.md#providers) to extend plugins. The Marketplace is located in the admin panel, indicated by ![Marketplace icon](../assets/icons/marketplace.svg) _Marketplace_. In the Marketplace, users can browse or search for plugins and providers, link to detailed descriptions for each, and submit new plugins and providers. ::: strapi In-app Marketplace vs. Market website -The Marketplace in the admin panel only displays v4 plugins, but all plugins for all Strapi versions are discoverable in the [Strapi Market](https://market.strapi.io). +The Marketplace in the admin panel only displays v4 plugins, but all plugins for all Strapi versions are discoverable in the [Strapi Market](https://market.strapi.io). Keep in mind that v3 and v4 plugins are not cross-compatible, but that providers are compatible both with v3 and v4 plugins. ::: + ![The Marketplace interface](../assets/plugins/installed-providers.png) -The Plugins and Providers tabs display each plugin/provider on individual cards containing: +The Plugins and Providers tabs display each package on individual cards containing: - their name, sometimes followed by either of the following badges: - ![maintained by Strapi icon](../assets/icons/official-market.svg) to indicate it is made by Strapi, @@ -25,6 +26,7 @@ The Plugins and Providers tabs display each plugin/provider on individual cards - a **Learn more** button for additional information, including detailed implementation instructions - a **Copy install command** button to copy the installation command to the local clipboard. For any installed plugins and providers, this button is replaced by an indicator that it is already installed. + In the top right corner of the Marketplace, the **Submit your plugin** button redirects to the Strapi Market where it is possible to submit your own plugin and provider. ::: tip diff --git a/docs/user-docs/latest/plugins/introduction-to-plugins.md b/docs/user-docs/latest/plugins/introduction-to-plugins.md index e5a34ce22f..c22d7d32cb 100644 --- a/docs/user-docs/latest/plugins/introduction-to-plugins.md +++ b/docs/user-docs/latest/plugins/introduction-to-plugins.md @@ -34,3 +34,9 @@ Currently, the only plugins designed to work with providers are the: * [Email plugin](/developer-docs/latest/plugins/email.md), and * Media Library plugin (implemented via the [Upload plugin](/developer-docs/latest/plugins/upload.md)). + +## Custom fields + +Some plugins can add _custom fields_ to Strapi. Custom fields are a way to extend Strapi’s capabilities by adding new types of fields to content-types or components. + +Once added to Strapi (see [Marketplace](/user-docs/latest/plugins/installing-plugins-via-marketplace.md)), custom fields can be created in the [Content-type Builder](/user-docs/latest/content-types-builder/configuring-fields-content-type.md#custom-fields) and used in the [Content Manager](/user-docs/latest/content-manager/writing-content.md). diff --git a/docs/user-docs/latest/settings/managing-global-settings.md b/docs/user-docs/latest/settings/managing-global-settings.md index 7c34896156..a45ea6594a 100644 --- a/docs/user-docs/latest/settings/managing-global-settings.md +++ b/docs/user-docs/latest/settings/managing-global-settings.md @@ -131,3 +131,7 @@ To create a new API token: ::: caution For security reasons, API tokens are only shown right after they have been created. When refreshing the page or navigating elsewhere in the admin panel, the newly created API token will be hidden and will not be displayed again. ::: + +## Configuring other plugins + +Installed plugins can add their own settings sub-sections. These sections are found at the bottom of the list of sub-sections, below the settings for pre-installed Strapi plugins. Settings for 3rd party plugins are described in the plugin's documentation on the [Marketplace](https://market.strapi.io).