SAP

Manage my Account SAP Devs YouTube ↗ Learnings ↗ Community ↗ Provide Feedback ↗
Logout
⤢ Open full site

Rich Media and Tables

Demonstrate every rich-media directive — `:::figure`, `:image`, `::compare`, `::diagram`, image hotspots, screencast `::cast`, and sortable/filterable tables — in a realistic "Deploy a CAP Application to SAP BTP Cloud Foundry" authoring context.

Overview

You will learn

  • ✔How to group images with :::figure and reference an inline :image
  • ✔How to show before/after comparisons with ::compare and architecture with ::diagram
  • ✔How to annotate a screenshot with image hotspots and embed a screencast with ::cast
  • ✔How to mark a table sortable and filterable
SAP Developer S SAP Developer November 6, 2026
Created on November 6, 2026
Contributors

More from SAP Developer Advocates

See all 6 tutorials by SAP Developer Advocates →

Prerequisites

  • An SAP BTP trial or productive account
  • The Cloud Foundry CLI installed (cf --version ≥ 8)
  • The @sap/cds-dk package installed globally (npm i -g @sap/cds-dk)
  • A modern browser (Chrome, Edge, or Firefox)

Steps

Step 1 Step 1: Understand the BTP Cockpit Layout
—

Before you deploy, familiarise yourself with the main areas of the SAP BTP Cockpit. Two views are most important: the Global Account overview and the Subaccount detail.

BTP Cockpit global account screen
BTP Cockpit global account screen
BTP Cockpit subaccount detail screen
BTP Cockpit subaccount detail screen

SAP BTP Cockpit — global account and subaccount views

In the global account view you manage entitlements across all subaccounts. Drill into a subaccount to see its spaces, service instances, and routes.

To reach the subaccount overview, click Go to subaccount button next to the subaccount name, or click the name itself.

Step 2 Step 2: Log In and Select a Target Space
+
Step 3 Step 3: Understand the Deployment Architecture
+
Step 4 Step 4: Build and Deploy
+
Step 5 Step 5: Verify the Deployment
+

Resources

Discussion

Share feedback on this tutorial or join the conversation in SAP Community.

Submit detailed feedback Discuss in Community
Steps
Step 1 of 5
1. Step 1: Understand the BTP Cockpit Layout 2. Step 2: Log In and Select a Target Space 3. Step 3: Understand the Deployment Architecture 4. Step 4: Build and Deploy 5. Step 5: Verify the Deployment