Placing the preview by hand
The preview renders automatically on the product page. When you need it somewhere else, such as inside a product tab, further down a description, or on a product template built in the Site Editor, use the shortcode or the block. Both render through the same code as the automatic placement, so the preview looks the same wherever it appears.
Shortcode
Section titled “Shortcode”[document_preview product="123"]productis the product ID to render previews for. It defaults to the current product, so inside a product context the attribute can be left off.
The shortcode outputs nothing when the product has no documents.
The block is named Document Preview (woo-document-preview/preview) and appears in the block inserter under the WooCommerce category.
- It has one setting, the product ID (
productId), which defaults to the current product. - It supports wide and full alignment.
In the editor, a block pointing at a product with no documents shows a short note explaining there is nothing to preview yet. On the front end that same case renders nothing.
Loading assets elsewhere
Section titled “Loading assets elsewhere”Preview styles and the modal script load on product pages, and on any page whose content contains the shortcode or the block. If you render the shortcode from a template rather than from post content, opt the page in with the wcdp_load_assets filter so the buttons are styled.