Docs
font, change, edit, hosted, Page, checkout
41075087
2022-06-29T13:53:50Z
2025-02-12T08:24:00Z
496
0
0
254832
How to edit font in checkout and self serve portal?
Scope
Is it possible to change the font on a Chargebee-hosted page?
Summary:
Chargebee comes with several themes in the PC 1.0 version for your hosted pages. You can customize these themes to match your website's look and feel and apply them to your hosted pages. From this theme section, you will also have the option to change the font as your business needs. You can configure the font from Checkout & Self-Serve Portal Index page.
If you are using PC 2.0, there is no UI setting to change the font size but it can be done using CSS.
Solution:
Checkout v2:
To configure your hosted pages themes, go to Settings > Configure Chargebee > Checkout & Self-Serve Portal > Themes > Configure Theme
Then navigate to 'Typograhpy' to change fonts. At this section you will have options to change fonts for Body Text font, Heading Text font & Brand name Text font.
You also have options to change text colors using the color code.
For more information, refer to this link Configuring themes
Checkout v3:
You can pass your CSS styles to Chargebee Components and customize font, color, placeholder, etc. Check our API reference for all CSS properties supported.
Placeholder text
Localization
Callback support for different component states like focussed, complete, invalid and empty
You can specify which CSS class should be added based on different states, to the container that holds the iframe.