SAP Knowledge Base Article - Public

3536696 - Inconsistency in external site theme with configured Branding

Symptom

The external site theme is not synchronized with the settings configured in the Branding theme.

Environment

SAP SuccessFactors Learning

Reproducing the Issue

  1. Configure a theme in Branding >
  2. Apply the theme to the new home pages >
  3. Observe that the theme is not applied correctly in external sites >
  4. Some links and buttons do not update as per the theme.

Cause

Product Management team has confirmed that Branding in sites are not currently supported with the New Learning Experience enabled. Some issues can be addressed by adding custom HTML in the custom footer of Learning. This KBA provides the step by step for to apply Theme Manager CSS to a Site.

Resolution

The HTML is customer-specific, so it needs to be recreated for each customer. You can add the contents of the .html file received from the steps below in the custom footer in Learning Branding.  It’s possible to provide the theme via a workaround using a custom footer by following these steps:

  1. We will need to retrieve some styling resources from two different URLs. To complete these steps, you’ll need the following information:
    • baseURL: The customer’s base URL for their SuccessFactors environment. Example:  https://hcm17preview.sapsf.com 
    • companyID: The customer’s company ID.
    • themeID: The theme ID for the theme to be applied to the Learning external site. The theme ID can be retrieved from the SuccessFactors Theme Manager, in BizX > Theme Manager > Theme Identifier.
  2. First, log into the customer’s internal SuccessFactors environment.
  3. Navigate to the following URL in the browser, replacing {baseURL}, {companyID} and {themeID} with your specified values: https://{baseURL}/public/ui-dcss/{companyID}/{themeID} /verp/ui/theming/resources/css/themes/global_variables.dcss 
  4. A text file should appear containing styling rules for the customer’s theme. Copy the entire file. 
  5. Paste the copied file contents into the custom_footer_template_v3.txt file where the text “/* Paste the result of Step 4 here */” appears. The pre-existing code at the top of the file should not be changed.
    • Note: The custom_footer_template_v3.txt file is attached to this KBA. Please open it with a text editor. 
  6. Next, navigate to this URL, replacing {baseURL}, {companyID} and {themeID} with the appropriate values: https://{baseURL}/public/theme-api/css/{companyID}/{themeID}/.dcss  
  7. Once again, a text file should appear. Copy the contents of the text file.  
  8. Paste the file contents into custom_footer_template_v3.txt where the text ““/* Paste the result of Step 7 here */” appears.  
  9. Log into the Learning admin UI >  
  10. Navigate to System Administration > Application Administration > Brands. Search for and edit the specific brand that should be updated > 
  11. Copy the contents of the custom_footer_template_v3.txt and paste it into the “footer” text field > 
  12. Click Apply Changes.  

See Also

Keywords

lms, learning, sf, successfactors, external, site, theme, branding, brand, inconsistency, custom, footer , KBA , LOD-SF-LMS-THM , Theme Related Issues , LOD-SF-LMS-EXT , Sites and External Users , LOD-SF-LMS , Learning Management System , Problem

Product

SAP SuccessFactors Learning all versions

Attachments

custom_footer_template_v3.txt