A default theme, provided by SAP, is assigned to each Portal site. You can create a custom theme in the UI Theme Designer, and then use the Theme Manager to import it so that you can assign this theme to the site, or make it available for user selection.
Step 1: Save the site URL
You will be needing the site URL later on and so we’ll start off by finding it and saving it.
-
Navigate to the Site Directory and find the Supplier Portal tile.
-
Hover over the tile.
-
Right-click the URL and select Copy link address.
-
Save this link - you’ll be needing it later.
Step 2: Access the UI theme designer tool
-
From the side panel of your Supplier Portal site, select Services and Tools.
-
Open the UI Theme Designer tool by hovering over the tile and clicking Configure.
Step 3: Create a theme
-
Click Create a New Theme.
-
Select SAP Belize as the Base Theme and click Step 2 to proceed.

-
Enter the following values:
Field |
Value |
Theme ID |
velotics |
Title |
velotics |
-
Click Create Theme.
A new theme named velotics
is created as a copy of the SAP Belize theme with the custom properties that you entered.
Step 4: Customize the theme
To design and modify the theme, you need to first define a Target Page that will serve as a canvas upon which you can perform these changes. You will then use the quick theming mode to easily change color scheme, background image, or logo.
-
Enter the Link to Application. This is the runtime URL of your site that you copied previously in Step 1.
-
Click Add to create the target page.
-
From the panel on the far right, select the paint brush icon to switch to quick theming.
-
Change the company logo by clicking on the right of the Company Logo field.
-
In the Assign Image dialog, open the file system browser.
-
Select the logo-velotics.png
image file from our resources. Notice that that image has been added to the list of available images.
-
Click the image to select it.
-
Click OK to apply your changes. Notice that the change has been applied and the icon has changed.
To apply the new theme to your Portal site, you will need to publish it from the UI Theme Designer and then apply it to your site from the Portal Theme Manager.
Step 5: Publish the theme
-
In the UI Theme Designer top level menu select Theme and then Save & Publish.
-
From the Save & Publish dialog, verify the theme parameters.
-
Click Save & Publish to publish the Velotics
theme.
Publishing the theme might take several moments.
Step 6: Apply the theme to your site
-
Go back to the Site Designer of your site.
-
From Services and Tools launch the Theme Manager.
-
Click OK on the message.
-
Notice that the velotics
theme that you created and published is available in the site’s Theme Manager.
-
Select the velotics
theme.
-
Click Assign to Site.
-
Click Publish to publish the latest changes.
-
Click Publish to only apply the changes. Select Publish and Open to publish your site and review the latest changes you have made to your site.
-
View your branded Site