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.

  1. Declare a font family resource in res/font/ (e.g., res/font/my_font_family.xml).
  2. Assign its resource ID before the first SDK fragment is loaded:
OpenWeb.manager.ui.customizations.fontFamily.styleResId = R.font.my_font_family

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.

Option 2 — Per-Element Fonts

Override the font on individual UI elements using OWCustomizationTextElement. Access elements through OpenWeb.manager.ui.customizations.elements.

  1. Set fontFamily to the name of a font in res/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.NORMAL

Supported 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.

ElementDescription
navigationTitleTitle shown in the navigation bar
loginPromptLogin prompt text for unauthenticated users
communityQuestionCommunity question text
communityGuidelinesCommunity guidelines text
sayControlPreConversation"Say something" control in Pre-Conversation
sayControlConversation"Say something" control in Conversation
preConversationHeaderTextHeader text in Pre-Conversation
preConversationHeaderCounterCounter text in the Pre-Conversation header
preConversationHeaderUserCountUser count in the Pre-Conversation header
commenterNameUser display name on comments
readOnlyTextText shown in read-only mode
emptyStateReadOnlyTextText shown when no comments exist in read-only mode
conversationCommentCountComment count in Conversation
conversationUserCountUser count in Conversation
conversationSortTextSort label text in Conversation
conversationSortDropdownItemSort dropdown item text
commentActionsAction buttons (Reply, Share, etc.)
commentBodyComment text content
inputTextText input field (comment creation)
avatarTextInitials shown in avatar placeholders

OWFontWeight values:

ValueCSS equivalent
OWFontWeight.THIN100
OWFontWeight.EXTRA_LIGHT200
OWFontWeight.LIGHT300
OWFontWeight.NORMAL400
OWFontWeight.MEDIUM500
OWFontWeight.SEMI_BOLD600
OWFontWeight.BOLD700
OWFontWeight.EXTRA_BOLD800
OWFontWeight.BLACK900

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.