This essential feature allows developers and content editors to review content changes in real-time before publishing them. With the preview functionality, you can ensure that your content is polished and accurate, while maintaining a seamless user experience across your website or application. This guide will walk you through the benefits and the necessary steps to implement the preview function, helping you to optimize your content management workflow and deliver flawless content every time.

To check during your work if everything is displayed as you imagine it, there is the preview function in caisy. If your blueprints are connected to a frontend URL, an “Eye”-icon (1) appears in the upper right corner next to the “Publish”-button. If you click on it, your document will be displayed in a new browser window in the given layout.

For the preview to be possible, the respective blueprint must be linked to a frontend. To do this, go to the “Settings”-section (1), select the “Development” tab (2) and then “Preview” (3). Here you can either create a new preview (“Create Preview”-button (4) in the upper right corner, edit (5) or delete (6) an existing preview.

If you want to create a new preview, first select the “Blueprint” (1) that should be displayed in the preview. You can search for the “Blueprint” (2), filter the blueprints by “Tags” (3) or simply scroll through the list (4). Once you have found and selected the desired blueprint, a new entry will be created (5). Here you enter the preview URL (6) to which your blueprint should be connected. 

To ensure that clicking the “Eye”-icon in your document doesn't always navigate you to the homepage of your website, you have the option of adding a “Token” (1), e.g. the slug, to your URL. Now, when you click on the “Eye”-icon in your document, exactly the page you are working on will be displayed. When you have set everything, don't forget to give your preview a name (2).

You can change an existing preview in the same way, e.g. by changing the URL, using a different token or redefining the name of your preview.