Skip to Content

8 - Create a Work Zone Site and Embed Your App

Create a site for accessing your application using SAP Build Work Zone, standard edition, as part of the SAP Build CodeJam.
You will learn
  • How to create an SAP Build Work Zone site
  • How to embed your shopping app in your site
thecodesterDaniel WroblewskiSeptember 29, 2025
Created by
thecodester
December 12, 2024
Contributors
thecodester
neelamegams

Prerequisites

  • Step 1

    To enable you to reach SAP Build Work Zone from the SAP Build Loby, you need to add a role to your user.

    1. Go back to the BTP Cockpit.

      Go to Security > Users.

      Click on your user with Custom IAS tenant.

      Open user
    2. In the side panel, click the 3 dots, and then click Assign Role Collection.

      Assign role collection
    3. Search for the Launchpad_Admin role, select it, and click Assign Role Collection.

      Launchpad_Admin role

      You must log out of SAP Build and log back in for the new role collection to take effect.

  • Step 2
    1. In the SAP Build lobby, click Create > Create.

      Open Work Zone
    2. Select Business Site, and then click Next.

      Build site

      If you get a Not Subscribed indicator, make sure you have the LaunchpadAdmin role and log off and log back into SAP Build.

      Not subscribed

      Log off with the “avatar” at the top right (yours will have your initials).

      Logg out
    3. Select Admin Console, and then click Open.

      Open Admin console

      The Admin Console opens.

      Admin console
  • Step 3
    1. Click Create Site.

      Create site
    2. Enter Purchasing as the site name, and click Create.

      Create

      The site settings screen opens in a new tab.

    3. Click Edit in the top-right corner.

      Edit
    4. Under Display, select Spaces and Pages - New Experience.

      Select new experience
    5. Click Save.

    6. Go back to the site directory in the previous browser tab.

      You will see your new site tile.

      New site tile
  • Step 4
    1. Open the Channel Manager.

      Open channel manager
    2. Click the Update Content icon.

      Update content

      It will show Updating … and take a few minutes to update. When Updated is displayed, continue to the next step.

  • Step 5
    1. Open the Content Manager.

      Open content manager
    2. Click Content Explorer.

      Open content explorer
    3. Click HTML5 Apps.

      HTML5 Apps
    4. Select your ShoppingApp, and then click Add.

      You will get a success essage at the bottom of the page.

      Select app
    5. Use the breadcrumb to go back to the Content Manager.

      Navigate back

      There you will see your app.

      App is added
  • Step 6
    1. In the Content Manager, click on the Everyone role.

      Open everyone
    2. Click Edit.

      Edit everyone
    3. In the Assignment Status column for your app, toggle the switch to on (green).

      Turn on app

      It should then look like this:

      App on
    4. Click Save.

  • Step 7
    1. Go back to the Content Manager main page with the breadcrumb.

      Click Create, and then Page.

      Create page
    2. Set the title to Overview.

      Set title
    3. Click Add Section.

      Add section

      Call the section Purchasing.

      Create section
    4. Click Add Widget.

      Add widget

      Select your ShoppingApp, and then click Add (1).

      Add app
    5. Click Save for the page.

    You get a preview of the page.

    Preview
  • Step 8
    1. Go back to the Content Manager with the breadcrumb.

      Click Create, and then Space.

      Create space
    2. Set the title to Home.

      Set space title
    3. In the Pages tab, for your page, toggle the Assignment Status column to assign (green).

      Add page to space
    4. Click Save.

  • Step 9
    1. Go back to the Content Manager with the breadcrumb.

      Double-click Everyone to open it.

      Open Everyone
    2. Click Edit.

    3. Under Spaces, toggle the Assignment Status column for your new space, so it is on (green).

      Add space to Everyone
    4. Click Save.

  • Step 10
    1. Go to the Site Directory.

      Open Site Directory
    2. Open your site.

      Open site

      You’ll see your site, space, page, and app.

      Preview
    3. Click the tile, and your app should open.

      You will see at the top the navigation from SAP Build Work Zone to return you to your site.

      App preview with navigation

    When you click on the "Business Site" tile while creating a project from SAP Build Lobby, which of the following options do you see?

Back to top