https://github.com/karolis-sh/netlify-cms-widget-inline-select
Radio and multiple select checkboxes widget for Netlify CMS
https://github.com/karolis-sh/netlify-cms-widget-inline-select
cms gatsby multi-checkbox netlify netlify-cms radio react widget
Last synced: 21 days ago
JSON representation
Radio and multiple select checkboxes widget for Netlify CMS
- Host: GitHub
- URL: https://github.com/karolis-sh/netlify-cms-widget-inline-select
- Owner: karolis-sh
- License: mit
- Created: 2018-12-03T16:05:08.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2021-09-24T06:35:33.000Z (over 3 years ago)
- Last Synced: 2025-03-21T08:35:02.585Z (about 1 month ago)
- Topics: cms, gatsby, multi-checkbox, netlify, netlify-cms, radio, react, widget
- Language: JavaScript
- Homepage: https://netlify-cms-widget-inline-select.netlify.com/
- Size: 3.22 MB
- Stars: 12
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
- awesome-decap-cms - netlify-cms-widget-inline-select - Radio and multiple select checkboxes widget for Netlify CMS. (Custom Widget)
README
# netlify-cms-widget-inline-select
[![npm version][version-badge]][version]
[![License: MIT][license-badge]][license]
[![code style: prettier][code-style-badge]][code-style]
Inline radio + multi-checkboxes select widget. Check out [the demo](https://netlify-cms-widget-inline-select.netlify.com/demo)!
## Install
```shell
npm i netlify-cms-widget-inline-select
```
or
```shell
yarn add netlify-cms-widget-inline-select
```
## Setup
```js
import { InlineSelectControl, InlineSelectPreview } from 'netlify-cms-widget-inline-select';
CMS.registerWidget('inline-select', InlineSelectControl, InlineSelectPreview);
```
## How to use
Add to your Netlify CMS configuration:
```yaml
fields:
- name: radio_select
label: Radio select
widget: inline-select
options: ['left', 'center', 'right']
```
## Configuration
- `options` - selection list (you can also specify the `value` and `label` separately)
```yaml
fields:
- name: radio_select
label: Most recent framework
widget: inline-select
options:
- { value: react, label: React }
- { value: angular, label: Angular 1.x }
- { value: vue, label: Vue.js }
- { value: $, label: jQuery }
```
- `multiple` - ability to select multiple items
```yaml
fields:
- name: checkboxes_select
label: Favorite frameworks
widget: inline-select
multiple: true
options: ['React', 'Angular', 'Vue', 'Other']
```
[version-badge]: https://badge.fury.io/js/netlify-cms-widget-inline-select.svg
[version]: https://www.npmjs.com/package/netlify-cms-widget-inline-select
[license-badge]: https://img.shields.io/badge/License-MIT-yellow.svg
[license]: https://opensource.org/licenses/MIT
[code-style-badge]: https://img.shields.io/badge/code_style-prettier-ff69b4.svg
[code-style]: https://github.com/prettier/prettier
[unpkg-bundle]: https://unpkg.com/netlify-cms-widget-inline-select/lib/