Preview Site

Overview

Extends the paradigm of the Preview link module to the concept of previewing more than one item of content, by way of a static site.

Features

• Content editors can create unlimited preview sites - each site consists of one or more pieces of draft content they wish to share with non-authenticated users to preview before publishing
• Each preview site is associated with a preview-site strategy which comprises
  • A generation strategy and
  • A deployment strategy
• Content editors can then trigger a build and deploy of their preview site, which will use the configured generator to build artefacts for the preview, and then the configured deployment strategy to deploy these artefacts
• Generation and deployment strategies are provided by plugins
• Ships with a Tome Static based generator by default, but because this is pluggable, you could write a different generation strategy if you had custom requirements
• Ships with a sub-module preview_site_s3 that supports deploying the generated files to S3
• Takes a best effort to make sure that the preview generated includes drafts of any related content-entities shown on the same page as the previewed entities - e.g. blocks, paragraphs etc - this integrates with Entity usage to identify related content

Requirements

Requires the following contributed module projects:

• Tome to power the default generation strategy
• Dynamic entity reference to power adding varied content-entities to a preview site
• Entity Usage to identify related content that may also have drafts required in the preview site

Configuration

• Enable the preview site and optional the preview site S3 sub-module
• If you're not enabling the S3 sub-module, you will need a module that provides a Deployment strategy plugin - at this stage that means custom code
• Visit /admin/structure/preview-site/strategies and add a new strategy - configuring the generation and deployment plugins as required
• Visit /admin/structure/preview-site/builds and add a new preview site build, adding the entities you wish to preview
• Save the build and then click Build and Deploy and let it process the generation and deployment
• When the process is complete, the link should take you to your built site

A note about S3

By default, S3 won't serve the index.html from inside a folder. Tome static works by creating an index.html for a given path.
E.g /some/pretty/path/on/your/site becomes {preview site uuid}/some/pretty/path/on/your/site/index.html
Configuring S3 to serve index.html will require custom configuration of your S3 bucket.
Note also that by default Preview Site will store the generated files in a sub-directory {preview site uuid}/ - but Tome generates all the links and URLs assuming the site is served from a relative URL. You may be able to resolve this with the Relative Path to Absolute URLs module, or alternatively, you can use a Lambda in front of S3 to route sub-domains to the folders. E.g. {preview site uuid}.yourdomain.com ➡️ yourdomain.com/{preview site uuid}. Configuration of one of these two options is left to the site owner/developer.

Known problems

Please use the issue queue to report issues.

• If you use a modern frontend toolchain such as webpack/rollup to bundle your JavaScript as ES modules, you will probably want the patch from #3230078: Add support for Javascript modules to ensure Tome Static includes any of your imported JS chunks.
• Media embedded via oembed is missing some styling - you may want to follow #3230547: \Drupal\media\Controller\OEmbedIframeController::render doesn't set a content-type header for that
• Not compatible with stage file proxy #3232035: Not compatible with stage_file_proxy