Loading

Custom community fonts are not applied in Experience Builder

게시 일자: Oct 13, 2022
상세 설명
In Experience sites, it's possible to add a custom font to a site in order to have more control over the site's branding.  There is, however, a limitation when an Experience site has multiple domains (e.g. A custom domain and the site native Force.com subdomain with a path prefix).  

In this scenario, the custom font may be applied to the live site but not reflected when viewing the site in Experience Builder or vice versa.  The reason for this is that the font-face css used to apply the custom fonts requires specifying a relative url.  If the native Force.com subdomain has a path prefix associated with it, then the path prefix needs to be included in the url.  Most custom domains, however, do not have path prefix associated with them which is why the custom font is applied either on the live site or Experience Builder dependent on how the font-face url is written.

For example:
  1. ExperienceSite1 has two domains:
    • Native force.com subdomain with path prefix: https://example.force.com/Prefix
    • Custom domain: https://example.custom.com
  2. Following our documentation, a font-face is created and added to the Experience:
@font-face {
    font-family: 'exampleFont';
    src: url('/s/sfsites/c/resource/MyFonts/bold/exampleFont.woff') format('woff');
}
 
In the above scenario, because the font-face url does not use the native site path prefix, the font's will be applied correctly when viewing the live site using the custom domain as the custom domain does not have a path prefix associated with it.  In Experience Builder, however, the font will not be applied as Experience Builder also uses the path prefix specified by the native Force.com subdomain.

If the font-face url were to include the path prefix instead, then the reverse would occur where the custom font would not be applied to the live site when accessed using the custom domain but would apply correctly in Experience Builder.
솔루션
As noted above, this is a limitation with custom fonts with Experience Sites.  It's recommended that the url be written so the custom font is applied and reflected on the live site. 

In order to test font changes, it's recommended that they be tested first in a sandbox before being moved and applied to a live Production org.
Knowledge 기사 번호

000389103

 
로드 중
Salesforce Help | Article