Try WSO2 Cloud for Free
Sign in
||
Skip to end of metadata
Go to start of metadata

In WSO2 Identity Cloud, you can add your own custom themes to the User Portal. This involves easily changing the color of the theme and the company logo on the header. Identity Cloud provides you with a user interface to upload or delete themes from the Admin Portal.

In this tutorial, you configure custom themes for the User Portal using Identity Cloud Admin Portal.

Before you begin

Before configuring custom themes, create a customized theme as a .zip file by maintaining the following file structure and file names. Also make sure your company logo image is in .png format.
|--- css/
      |--- appm-left-column-styles.css
      |--- appm-main-styles.css

|--- img/
      |-- logo.png


For a sample custom theme ZIP file, download and view user-portal-theme.zip.

Now, let's begin.

  1. Log in to the Admin Portal and click User Portal Themes from left menu.
  2. Provide a Theme Name, click Browse to upload the .zip file (the .zip file that you created including CSS files and your logo), and click Save. The theme is applied to the User Portal.
  3. Navigate to the User Portal by either clicking the user portal link in the message or the Go to User Portal button on upper right corner of the page.

    You can see your new theme is applied in the User Portal
     

If you need to change the theme, delete the current theme and upload a new theme. You can also download the current theme from the Admin Portal and do any changes and upload it back.

Note: If you are doing any changes to the contents of the downloaded user-portal-theme.zip file (i.e., replacing the logo), make sure you compress the contents to make the .zip file before uploading.



  • No labels