Custom Fonts ᴺᴱᵂ
The SDK supports two approaches to custom typography: a global font resource that applies to the entire SDK, and per-element overrides that target individual UI components such as comment bodies or the text input field.
Option 1 — Global Font
Apply a single font family to all SDK text by setting the styleResId on fontFamily.
- Declare a font family resource in
res/font/(e.g.,res/font/my_font_family.xml). - Assign its resource ID before the first SDK fragment is loaded:
OpenWeb.manager.ui.customizations.fontFamily.styleResId = R.font.my_font_familyNote: Set font customizations before the first fragment is loaded. Changes applied after the fragment is already in the layout will not take effect until the fragment is recreated.
Option 2 — Per-Element Fonts
Override the font on individual UI elements using OWCustomizationTextElement. Access elements through OpenWeb.manager.ui.customizations.elements.
- Set
fontFamilyto the name of a font inres/font/or a system family name:
// Override the comment body font
OpenWeb.manager.ui.customizations.elements.commentBody.fontFamily = "my_custom_font"
OpenWeb.manager.ui.customizations.elements.commentBody.fontWeight = OWFontWeight.BOLD
// Override the comment input text font
OpenWeb.manager.ui.customizations.elements.inputText.fontFamily = "serif"
OpenWeb.manager.ui.customizations.elements.inputText.fontWeight = OWFontWeight.NORMALSupported fontFamily values:
- Name of a resource in
res/font/(without file extension), e.g.,"my_custom_font" - System generic family name:
"serif","sans-serif","monospace","cursive","fantasy"
Available Text Elements
All elements below support fontFamily and fontWeight. Access them via OpenWeb.manager.ui.customizations.elements.
| Element | Description |
|---|---|
navigationTitle | Title shown in the navigation bar |
loginPrompt | Login prompt text for unauthenticated users |
communityQuestion | Community question text |
communityGuidelines | Community guidelines text |
sayControlPreConversation | "Say something" control in Pre-Conversation |
sayControlConversation | "Say something" control in Conversation |
preConversationHeaderText | Header text in Pre-Conversation |
preConversationHeaderCounter | Counter text in the Pre-Conversation header |
preConversationHeaderUserCount | User count in the Pre-Conversation header |
commenterName | User display name on comments |
readOnlyText | Text shown in read-only mode |
emptyStateReadOnlyText | Text shown when no comments exist in read-only mode |
conversationCommentCount | Comment count in Conversation |
conversationUserCount | User count in Conversation |
conversationSortText | Sort label text in Conversation |
conversationSortDropdownItem | Sort dropdown item text |
commentActions | Action buttons (Reply, Share, etc.) |
commentBody | Comment text content |
inputText | Text input field (comment creation) |
avatarText | Initials shown in avatar placeholders |
OWFontWeight values:
| Value | CSS equivalent |
|---|---|
OWFontWeight.THIN | 100 |
OWFontWeight.EXTRA_LIGHT | 200 |
OWFontWeight.LIGHT | 300 |
OWFontWeight.NORMAL | 400 |
OWFontWeight.MEDIUM | 500 |
OWFontWeight.SEMI_BOLD | 600 |
OWFontWeight.BOLD | 700 |
OWFontWeight.EXTRA_BOLD | 800 |
OWFontWeight.BLACK | 900 |
Note: Set font customizations before the first fragment is loaded. Changes applied after the fragment is already in the layout will not take effect until the fragment is recreated.
