---
title: "Academy Article"
canonical_url: "https://academy.laioutr.com/en/artikel/check-live-data-in-studio"
locale: en
meta:
  "og:title": "Academy Article"
---

[Go to home](https://academy.laioutr.com/en)

- [Apps](https://academy.laioutr.com/en/bereiche/apps)

- [Using apps](https://academy.laioutr.com/en/leitfaeden/using-apps)

- [Check live data in Studio](https://academy.laioutr.com/en/artikel/check-live-data-in-studio)

# Check live data in Studio

The Studio preview shows real data from connected apps. On dynamic pages such as the product detail page, the Preview Data field selects which product the preview shows.

## Before you start

<dl>

<dt>Plan</dt>
<dd>Any Laioutr plan</dd>

<dt>Role</dt>
<dd>Access to Studio in the project</dd>

<dt>Duration</dt>
<dd>5 min</dd></dl>

### Prerequisites

- Commerce or CMS app installed and configured
- Environment deployed after the settings were saved

Last reviewed on October 15, 2026

Once an app is set up, Studio shows whether the connection works: product lists, product detail pages, categories and menus fill with real names, prices and images from the connected system. Orchestr delivers the data in the unified data model, and Sections and Blocks render it.

A dynamic page such as the **Product Detail Page** is one page configuration for many products. When the app supports it, the page properties show a **Preview Data** field naming the product, article or recipe currently in the preview. A searchable list switches to another entry. The choice lasts for the current Studio session only and never changes the storefront.

Link fields use the app data too: pick the page type first, then a concrete page from a searchable list with thumbnails, instead of copying a slug out of the shop admin.

## Step by step

1. 1 ### Step 1: Open Studio

   Open Studio from the project sidebar and check in the top bar which environment is being edited.
2. 2 ### Step 2: Select a dynamic page

   Open a dynamic page in the layer tree, for example the **Product Detail Page**. Studio picks a first product automatically.
3. 3 ### Step 3: Check Preview Data

   Select the page and open the **Preview Data** field in the properties panel. Use the search to pick another product.
4. 4 ### Step 4: Check a section

   Select a section with shop data, such as a product list, and check its query in the properties panel, for example the selected category.
5. 5 ### Step 5: Test a link field

   In a link field, choose a page type and then a concrete page from the list. If the page is missing, use **Enter params manually**.

## Check the result

The preview shows product names, prices and images that match the shop admin, and **Preview Data** names the product currently visible.

## Frequently asked questions

Why is the Preview Data field missing?

The app providing the page type does not list its pages. The page still previews; the instance is then set through the preview URL.

Does the Preview Data choice change the live page?

No. The choice lasts for the Studio session only and is never saved into the project configuration.

The preview shows no shop data. What should be checked?

Under **Configuration**, all app sections must show **Complete**, the connection test must succeed, and the environment must have been deployed after saving.

## Related

- [Fill sections with shop data](https://academy.laioutr.com/en/artikel/fill-sections-with-shop-data)7 min

  Sections with a data field show products, categories or posts from connected systems. The team picks a data query in Studio, sets input, limit and sorting, and Orchestr delivers the data at render time.
- [Page type recipes: home, product listing, product detail, content](https://academy.laioutr.com/en/artikel/page-type-recipes-home-listing-detail-content)6 min

  The main page types have proven recipes: which path applies, which data the page loads and which sections it typically contains. This overview helps to build a complete and consistent storefront.
- [Enter credentials and test the connection](https://academy.laioutr.com/en/artikel/enter-credentials-and-test-the-connection)5 min

  App credentials are entered per environment under Configuration, checked with Test connection and stored with Save settings. They take effect with the next deployment.
- [Studio at a glance](https://academy.laioutr.com/en/artikel/studio-at-a-glance)5 min

  Studio is the visual editor in Cockpit: the team builds pages from sections and blocks, sees every change in a live preview of the real storefront and publishes when everything is right.
- [Design the product detail page and spec sheet](https://academy.laioutr.com/en/artikel/design-the-product-detail-page-and-spec-sheet)7 min

  In Studio, the product detail page is one template for all products: the image gallery on the left, the buy box made of blocks such as title, price, variant selection and add to cart on the right, and an optional spec sheet below. Images, variants, prices and specifications come from the commerce app through Orchestr.

## Learn it in a lesson

- [What apps deliver and where they are configured](https://academy.laioutr.com/en/lektionen/foundations-what-apps-deliver)9 min
- [Check real data in Studio](https://academy.laioutr.com/en/lektionen/go-live-check-real-data-in-studio)5 min
- [Connect commerce apps](https://academy.laioutr.com/en/lektionen/developer-connect-commerce-apps)12 min

## [Using apps](https://academy.laioutr.com/en/leitfaeden/using-apps)

Search this guide

1. [Find, install and configure apps](https://academy.laioutr.com/en/artikel/find-install-and-configure-apps)6 min
2. [Enter credentials and test the connection](https://academy.laioutr.com/en/artikel/enter-credentials-and-test-the-connection)5 min
3. [Check live data in Studio](https://academy.laioutr.com/en/artikel/check-live-data-in-studio)5 min

## Structured Data

```json
{
  "@context": "https://schema.org",
  "@graph": [
    {
      "@id": "https://academy.laioutr.com/#website",
      "@type": "WebSite",
      "inLanguage": "en",
      "name": "Default",
      "url": "https://academy.laioutr.com/",
      "translationOfWork": {
        "@id": "https://academy.laioutr.com/#website"
      }
    },
    {
      "@id": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio#webpage",
      "name": "Academy Article",
      "url": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio",
      "@type": [
        "WebPage",
        "FAQPage"
      ],
      "breadcrumb": {
        "@id": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio#breadcrumb"
      },
      "isPartOf": {
        "@id": "https://academy.laioutr.com/#website"
      },
      "mainEntity": [
        {
          "@id": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio#/schema/question/1"
        },
        {
          "@id": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio#/schema/question/2"
        },
        {
          "@id": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio#/schema/question/3"
        }
      ],
      "potentialAction": [
        {
          "@type": "ReadAction",
          "target": [
            "https://academy.laioutr.com/en/artikel/check-live-data-in-studio"
          ]
        }
      ]
    },
    {
      "@id": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio#breadcrumb",
      "@type": "BreadcrumbList",
      "itemListElement": [
        {
          "@type": "ListItem",
          "name": "Home",
          "item": "https://academy.laioutr.com/en",
          "position": 1
        },
        {
          "@type": "ListItem",
          "name": "Apps",
          "item": "https://academy.laioutr.com/en/bereiche/apps",
          "position": 2
        },
        {
          "@type": "ListItem",
          "name": "Using apps",
          "item": "https://academy.laioutr.com/en/leitfaeden/using-apps",
          "position": 3
        },
        {
          "@type": "ListItem",
          "name": "Check live data in Studio",
          "item": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio",
          "position": 4
        }
      ]
    },
    {
      "@id": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio#/schema/question/1",
      "@type": "Question",
      "inLanguage": "en",
      "name": "Why is the Preview Data field missing?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>The app providing the page type does not list its pages. The page still previews; the instance is then set through the preview URL.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio#/schema/question/2",
      "@type": "Question",
      "inLanguage": "en",
      "name": "Does the Preview Data choice change the live page?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>No. The choice lasts for the Studio session only and is never saved into the project configuration.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/en/artikel/check-live-data-in-studio#/schema/question/3",
      "@type": "Question",
      "inLanguage": "en",
      "name": "The preview shows no shop data. What should be checked?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Under <strong>Configuration</strong>, all app sections must show <strong>Complete</strong>, the connection test must succeed, and the environment must have been deployed after saving.</p>"
      }
    }
  ]
}
```
