---
title: "Academy Article"
canonical_url: "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn"
locale: en
meta:
  "og:title": "Academy Article"
---

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

- [Hosting and operations](https://academy.laioutr.com/en/bereiche/hosting-and-operations)

- [Laioutr Cloud](https://academy.laioutr.com/en/leitfaeden/laioutr-cloud)

- [Deliver images through the Laioutr CDN](https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn)

# Deliver images through the Laioutr CDN

The Laioutr CDN stores a project's images in a dedicated store and delivers them from the project's own hostname. Size and format are adapted at the edge on request, and delivered images stay cached for a long time.

## Before you start

<dl>

<dt>Plan</dt>
<dd>Image CDN package of the Laioutr CDN</dd>

<dt>Role</dt>
<dd>Access to Integrations in Cockpit to enable it</dd>

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

Last reviewed on October 15, 2026

The **Laioutr CDN** is the managed store and delivery path for images, video, audio and files that editors upload in Studio. It works with every hosting option: Laioutr Cloud, a hyperscaler, native hosting or a self-managed server.

- **Dedicated store**: every project has its own storage, with no namespace shared with other projects.
- **Own hostname**: images are served from `{projectId}.cdn.laioutr.cloud` by default; a branded hostname such as `cdn.example.com` is possible.
- **Edge transformations**: images are resized, re-encoded and delivered in a format the browser supports, on request.
- **Long-lived caching**: a delivered object stays in the edge and browser cache, so a repeat view puts no load on the origin.

In Studio and Cockpit, the CDN appears as a media library with a picker, next to any other connected library. It is enabled through the **Laioutr CMS** integration.

## Step by step

1. 1 ### Step 1: Enable the integration Open **Integrations** in Cockpit and enable **Laioutr CMS**.
2. 2 ### Step 2: Redeploy Redeploy the storefront. The integration card shows the delivery hostname once it is live.
3. 3 ### Step 3: Use images Upload images to the media library in Studio and pick them in sections.

## Frequently asked questions

Does the storefront have to run on Laioutr Cloud?

No. The Laioutr CDN is available with every hosting option.

Can a custom hostname be used?

Yes. Instead of the default address, a branded hostname such as `cdn.example.com` can be attached.

Which files besides images does the CDN deliver?

Videos, audio and files such as PDFs, spreadsheets or 3D models, which are delivered by URL with a readable download name.

## Related

- [Manage media in Cockpit and Studio](https://academy.laioutr.com/en/artikel/manage-media-in-cockpit-and-studio)5 min

  Images, videos and audio files are managed centrally in the Media Library under Content in Cockpit. In Studio, the media picker selects files from every connected library, such as the shop system, and uploads new ones where the library allows it.
- [Deliver videos through the Video CDN](https://academy.laioutr.com/en/artikel/deliver-videos-through-the-video-cdn)6 min

  Editors upload videos to the Laioutr CDN media library in Studio and pick them in a section. The CDN delivers them from the project's hostname with an automatically generated poster, and optionally also adaptively as HLS and DASH.
- [Performance: caching and Orchestr](https://academy.laioutr.com/en/artikel/performance-caching-and-orchestr)6 min

  Laioutr speeds up storefronts with three cache layers: the Orchestr entity cache on the server, the HTTP cache at the edge and a store in the browser. Together they keep repeated requests from putting load on backends.
- [Images and video, popups, notifications and in-page navigation](https://academy.laioutr.com/en/artikel/images-video-popups-notifications-in-page-navigation)7 min

  Media + Text and Media Preview show images and videos, PopUp presets present info, newsletter and offers, and toasts and alert dialogs give automatic feedback. Category Card Grid and Slider lead into product ranges within the page.

## Learn it in a lesson

- [Manage and deliver media](https://academy.laioutr.com/en/lektionen/frontend-manager-manage-media)8 min
- [Domains, CDN and logs](https://academy.laioutr.com/en/lektionen/developer-domains-cdn-and-logs)10 min
- [Add images and videos](https://academy.laioutr.com/en/lektionen/go-live-add-images-and-videos)6 min

## [Laioutr Cloud](https://academy.laioutr.com/en/leitfaeden/laioutr-cloud)

Search this guide

1. [Hosting and edge delivery](https://academy.laioutr.com/en/artikel/hosting-and-edge-delivery)4 min
2. [Connect a custom domain](https://academy.laioutr.com/en/artikel/connect-a-custom-domain)6 min
3. [Password-protect the storefront until launch](https://academy.laioutr.com/en/artikel/password-protect-the-storefront-until-launch)5 min
4. [Deliver images through the Laioutr CDN](https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn)4 min
5. [Deliver videos through the Video CDN](https://academy.laioutr.com/en/artikel/deliver-videos-through-the-video-cdn)6 min
6. [Protect forms from bots and spam](https://academy.laioutr.com/en/artikel/protect-forms-from-bots-and-spam)7 min
7. [Deliver the storefront as a progressive web app](https://academy.laioutr.com/en/artikel/deliver-the-storefront-as-a-progressive-web-app)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/deliver-images-through-the-laioutr-cdn#webpage",
      "name": "Academy Article",
      "url": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn",
      "@type": [
        "WebPage",
        "FAQPage"
      ],
      "breadcrumb": {
        "@id": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn#breadcrumb"
      },
      "isPartOf": {
        "@id": "https://academy.laioutr.com/#website"
      },
      "mainEntity": [
        {
          "@id": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn#/schema/question/1"
        },
        {
          "@id": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn#/schema/question/2"
        },
        {
          "@id": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn#/schema/question/3"
        }
      ],
      "potentialAction": [
        {
          "@type": "ReadAction",
          "target": [
            "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn"
          ]
        }
      ]
    },
    {
      "@id": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn#breadcrumb",
      "@type": "BreadcrumbList",
      "itemListElement": [
        {
          "@type": "ListItem",
          "name": "Home",
          "item": "https://academy.laioutr.com/en",
          "position": 1
        },
        {
          "@type": "ListItem",
          "name": "Hosting and operations",
          "item": "https://academy.laioutr.com/en/bereiche/hosting-and-operations",
          "position": 2
        },
        {
          "@type": "ListItem",
          "name": "Laioutr Cloud",
          "item": "https://academy.laioutr.com/en/leitfaeden/laioutr-cloud",
          "position": 3
        },
        {
          "@type": "ListItem",
          "name": "Deliver images through the Laioutr CDN",
          "item": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn",
          "position": 4
        }
      ]
    },
    {
      "@id": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn#/schema/question/1",
      "@type": "Question",
      "inLanguage": "en",
      "name": "Does the storefront have to run on Laioutr Cloud?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>No. The Laioutr CDN is available with every hosting option.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn#/schema/question/2",
      "@type": "Question",
      "inLanguage": "en",
      "name": "Can a custom hostname be used?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Yes. Instead of the default address, a branded hostname such as <code>cdn.example.com</code> can be attached.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/en/artikel/deliver-images-through-the-laioutr-cdn#/schema/question/3",
      "@type": "Question",
      "inLanguage": "en",
      "name": "Which files besides images does the CDN deliver?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Videos, audio and files such as PDFs, spreadsheets or 3D models, which are delivered by URL with a readable download name.</p>"
      }
    }
  ]
}
```