https://github.com/prismicio/prismic-toolbar

An embeddable UI for Prismic content and previews directly on your website.
https://github.com/prismicio/prismic-toolbar

Last synced: 2 months ago
JSON representation

An embeddable UI for Prismic content and previews directly on your website.

• Host: GitHub
• URL: https://github.com/prismicio/prismic-toolbar
• Owner: prismicio
• Created: 2016-07-07T05:52:31.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2024-06-17T12:39:33.000Z (7 months ago)
• Last Synced: 2024-06-17T14:02:19.877Z (7 months ago)
• Language: JavaScript
• Homepage:
• Size: 10.7 MB
• Stars: 12
• Watchers: 19
• Forks: 19
• Open Issues: 30
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Prismic toolbar

The prismic toolbar enables content writers to:

 - Identify Prismic content on the page

 - Preview unpublished changes (drafts and releases)

 - Perform A/B tests (experiments)

## How to use it?

Include the following script on every page of your site (including the `404` page).

Remember to replace `YOUR_REPO_NAME` with the name of your Prismic repository.

```

```

## How to develop

- Start your toolbar locally:

```script

npm start

```

- Serve toolbar assets:

```script

npm run serve

```

It will serve assets at `http://localhost:8081/prismic-toolbar/[version]`. Where

version is current `package.json` version.

- Change the path of the script to point to `http://localhost:8081/prismic-toolbar/[version]/prismic.js` from your public folder

By default the toolbar will communicate with `prismic.io` so the local

`[version]` must match the version served by prismic.

### With a proxy

If you are using a proxy in front of the development server, you must set the

`CDN_HOST` environment variable, so the script will be loaded through the proxy.

Example:

```script

CDN_HOST=http://wroom.test npm start

```

Then from your project, load the prismic script like this:

```

```

Note that the repo name should be qualified with your proxy domain for the

communication to work.

## How to deploy

- Deploy on prod:

```

npm run build:prod

```