Happy Business Starts Here

Newly Enrolled

Can we upload custom fonts in zuora to be used by zuora payment iframe CSS

Question: Can we upload custom fonts in zuora to be used by zuora payment iframe CSS. We have a requirement to show these custom fonts on webpage for our client and current iframe css only allows standard fonts (not custom fonts)

2 REPLIES 2
Zuora Staff

Re: Can we upload custom fonts in zuora to be used by zuora payment iframe CSS

Hi,

 

Yes, it is possible. What you can do is:

 

Upload the font file into any third party site, then modify the CSS code in Hosted Payment Page setting to request the iFrame to load the font file. 

 

For example:

 

@font-face {
font-family: myFirstFont;
src: url(https://location_of_font_file);
}

//Then you can use it in any where like below:

h2, label {
font-family: myFirstFont;
color: #00FFFF;
}

 

This link might be helpful as reference: http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

 

Thanks!



If you found my answer helpful, please give me a kudo ↑
Help others find answers faster by accepting my post as a solution √

Newly Enrolled

Re: Can we upload custom fonts in zuora to be used by zuora payment iframe CSS

Hi Patrick,

 

I'm using your suggestion and getting a CORS error: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://apisandbox.zuora.com' is therefore not allowed access.

 

We have setup the url in the Hosted Domain field.  What are we missing?

 

Hosted Domain: https://my.example.com

 

CSS

@font-face {font-family: 'MuseoSans-300';src: url('https://my.example.com/directory/path/to/webfonts/myfont.woff2') format('woff2');}