Hi! If you are here for the file relation widget, NetlifyCMS now supported this feature out of the box. Docs is a bit spare, feel free to open an issue if you get stuck (a) using this new feature or (b) migrating away from
ncw-file-relation
.
A collection of custom widgets for netlify-cms
⚠ Unstable: Under active development
npm package | description | docs |
---|---|---|
@ncwidgets/id | Generate a unique ID for new entries in a folder collection | |
@ncwidgets/file-relation | Dropdown select widget for a field inside a file collection (the default relation widget only works for folder collections) | docs |
@ncwidgets/reorder | Drag & drop to order entries in a folder collection | docs |
@ncwidgets/netlify-cms | Custom netlify-cms build with file-relation & id built in | see here |
import cms from 'netlify-cms-app'
import { Widget as IdWidget } from '@ncwidgets/id'
import { Widget as ReorderWidget } from '@ncwidgets/reorder'
import { Widget as FileRelationWidget } from '@ncwidgets/file-relation'
cms.registerWidget(IdWidget)
cms.registerWidget(ReorderWidget)
cms.registerWidget(FileRelationWidget)
cms.init()
@ncwidgets/netlify-cms
is a drop-in replacement* for netlify-cms
, but includes file-relation & id widget.
- <script src="https://unpkg.com/netlify-cms@^2.0.0/dist/netlify-cms.js"></script>
+ <script src="https://unpkg.com/@ncwidgets/netlify-cms@^0.7.0/dist/netlify-cms.js"></script>
*Note that @ncwidgets/netlify-cms
is not a fork. Since we only register additional custom widgets, it's very easy to keep the build up-to-date. It's also currently not a complete drop-in replacement — deprecated dist/cms.js
and cms.css
are not included.
Easiest way is to use the official netlify cms plugin. Please follow the instruction here.
npm i gatsby-plugin-netlify-cms netlify-cms-app
Configure gatsby-plugin-netlify-cms
:
// gatsby-config.js
module.exports = {
plugins: [
{
resolve: `gatsby-plugin-netlify-cms`,
options: {
manualInit: true,
modulePath: `${__dirname}/src/cms/cms.js`,
},
},
]
}
Then, install the widgets you need
npm i @ncwidgets/id
And register them
// src/cms/cms.js
import cms from 'netlify-cms-app'
import { Widget as IdWidget } from '@ncwidgets/id'
cms.registerWidget(IdWidget)
cms.init()
Please see this example demo: https://github.com/d4rekanguok/ncwidgets-hugo-example
Has an idea for a widget? Please feel free to send over a PR, or open an issue with the idea
tag.
This is a monorepo with yarn workspace & lerna.
# Setup
yarn
yarn bootstrap
# Launch the playground with
# all the custom widgets at localhost:
yarn playground:dev
# Build widgets
yarn build