Preview content changes in your website

Today, I am glad to ship a new prismic.io feature: prismic Preview Bar. It allows you to preview your Writing Room changes and it integrates seemlessly into your website in any technology or design. You can preview planned releases, saved or unsaved drafts without publishing them.

You can test it by yourself in our public Les Bonnes Choses demo. Go to the Writing Room, choose a document version (or create one) and click on the preview icon, it will open Les Bonnes Choses demo website with the Preview Bar displayed in the right bottom corner. The website now is previewing the concerned document/release.

Also you can try to draft a new document in your project

When you click on the preview button, you are immediately directed to the website:

And hey, it appears in the search as well!

The Preview Bar also allows you to open a Preview Panel in your website displaying the different documents concerned by the preview, choose a document to navigate to the concerned page and close the preview mode whenever you're done.

prismic Preview Bar plays very well along our strategy, we want to leverage great user experiemce to content writers while allowing developers to focus on building great websites and without spending too much time on the plumbing. This is why we've made it very easy to integrate into any website and in any technology.

All you need to do is drop the prismic.js in your HTML, and pass along the preview token into the developement kit. Full details of the integration can be found in Integrating prismic Preview Bar in your website.

Our Preview Bar is one of the tools that we're integrating into our prismic Button, more tools and features to follow so stay tuned.