netlify-cms-widget-inline-select

Widget for radios and inline multi-checkboxes in Netlify CMS.

Usage no npm install needed!

<script type="module">
  import netlifyCmsWidgetInlineSelect from 'https://cdn.skypack.dev/netlify-cms-widget-inline-select';
</script>

README

netlify-cms-widget-inline-select

npm version Node.js CI License: MIT code style: prettier

Inline radio + multi-checkboxes select widget. Check out the demo!

preview

Install

npm i netlify-cms-widget-inline-select

or

yarn add netlify-cms-widget-inline-select

Setup

import { InlineSelectControl, InlineSelectPreview } from 'netlify-cms-widget-inline-select';

CMS.registerWidget('inline-select', InlineSelectControl, InlineSelectPreview);

How to use

Add to your Netlify CMS configuration:

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)
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
fields:
  - name: checkboxes_select
    label: Favorite frameworks
    widget: inline-select
    multiple: true
    options: ['React', 'Angular', 'Vue', 'Other']