Widget to display slug in admin ui

Clone or fork the repo, then install dependencies:

git clone --depth=1 https://github.com/netlify/netlify-cms-widget-starter.git netlify-cms-widget-<name>
cd netlify-cms-widget-<name>
npm install

To run a copy of Netlify CMS with your widget loaded for development, use the start script:

npm start

Your widget source is in the src directory, where there are separate files for the Control and Preview components.

You'll want to take a few steps before publishing a production built package to npm:

1. Customize package.json with details for your specific widget, e.g. name, description, author, version, etc.
2. For discoverability, ensure that your package name follows the pattern netlify-cms-widget-<name>.
3. Delete this README.md, rename README_TEMPLATE.md to README.md, and update the new file for your specific widget.
4. Rename the exports in src/index.js. For example, if your widget is netlify-cms-widget-awesome, you would do:

if (typeof window !== 'undefined') {
  window.AwesomeControl = Control
  window.AwesomePreview = Preview
}

export { Control as AwesomeControl, Preview as AwesomePreview }

5. Optional: customize the component and file names in src.
6. If you haven't already, push your repo to your GitHub account so the source available to other developers.
7. Create a production build, which will be output to dist:

npm run build

8. Finally, if you're sure things are tested and working, publish!

npm publish

The development (start) task provides a locally served preview of your widget in the CMS editor. This starter also includes a demo task for deploying this view live. Here's how to get your demo deployed using Netlify.

1. Assuming your repo is on GitHub, head over to Netlify and create a site from your repo.
2. The proper settings will be pre-filled based on what's in the netlify.toml file in this repo, so you can just click through to deploy.
3. Add your deployed site url to README.md, replacing the placeholder url in the demo link.

Note: Be sure to retain the "/demo" at the end of url, as that will automatically redirect to the editor view with your widget.

Once deployed, your demo should look like this, except with your custom widget.