Discussing Shopify Functions development, deployment, and usage in Shopify apps.
Hi,
I would like to use custom fonts in the new Checkout UI.
I uploaded those fonts as assets in Shopify.
Then I used them to define the primary and secondary fonts of my Checkout using the following mutation :
(doc : https://shopify.dev/docs/api/admin-graphql/2023-10/mutations/checkoutBrandingUpsert)
mutation checkoutBrandingUpsert($checkoutBrandingInput: CheckoutBrandingInput!, $checkoutProfileId: ID!) {
checkoutBrandingUpsert(
checkoutBrandingInput: $checkoutBrandingInput
checkoutProfileId: $checkoutProfileId
) {
checkoutBranding {
designSystem {
typography {
primary {
base {
sources
weight
}
bold {
sources
weight
}
name
}
secondary {
base {
sources
weight
}
bold {
sources
weight
}
name
}
}
}
}
userErrors {
code
field
message
}
}
}
It works, but at the payment step, the name of our custom payment means show up in bold, and I can't find anywhere to customize the font weight specifically to them in my mutation (see screenshot below).
Does anyone know how to do this by any chance please ?
Hi Needfortri,
There might not be a way to directly change this behavior via the API but I've asked our checkout dev team if they have any advice on this!
Liam | Developer Advocate @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit Shopify.dev or the Shopify Web Design and Development Blog