web
You’re offline. This is a read only version of the page.
close
Skip to main content

Announcements

News and Announcements icon
Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Pages / Issues adding custom f...
Power Pages
Unanswered

Issues adding custom fonts

(1) ShareShare
ReportReport
Posted on by 30

Hi there,

 

I know there are many threads with people asking the same thing - how on earth do we add custom fonts?

 

I have read every single answer and solution and not a single one has worked.

 

At this stage, all I am trying to do is change the font on the default 'Contso' dummy page. I have spent hours trying to do this with no luck.

 

I have a custom CSS file testcss.css that is working, and I can edit things like background color no issue.

 

I have uploaded my 'averta bold' woff file as an attachment on a webfile as a child of the home page:

BioGroBen_0-1681253101806.png

BioGroBen_2-1681253597358.png

 

And am linking it in my custom css file:

BioGroBen_1-1681253276849.png

 

I have tried every single url I can think of, because it seems to be an issue with how its linked, not the CSS file itself as other styles are being displayed, for instance I have tested:

h1{

 background-color: purple;

}

and this works fine.

 

I have tried '../averta-std-bold.woff/font.woff'

'/averta-std-bold.woff/font.woff'

'/web-files/averta-std-bold.woff/font.woff'

 

and nothing works.

When inspecting the code in Chrome, it says it is the right font, but it clearly isn't - again I imagine this is because the browser is trying to display the font, but isn't actually downloading the font.woff file.

 

PLEASE can someone help before I go completely insane and throw my computer into the ocean.

Categories:
I have the same question (0)
  • Fubar Profile Picture
    8,487 Super User 2026 Season 1 on at

    Last time I did this it was a few years ago

    Didn't have web-files in the path, just the name of the Web File record (in our case the font name and extension)

     

    src:  url('/the-font-name.woff') format('woff')

     

    Shouldn't make a difference but when referencing in the h1 etc had double quotes around the value of the font-family.

     

    Also from memory if a mistake was made had to do a full browser cache clear as it would cache what it thought was the font file (chrome F12 and then right click the refresh button, and choose the 3rd option)

  • MadMuck Profile Picture
    83 on at

    Did you ever find a resolution for this?  I'd love to know if/how you got a custom font to work.

  • Fubar Profile Picture
    8,487 Super User 2026 Season 1 on at
  • MadMuck Profile Picture
    83 on at

    Thanks!  I figured I didn't have my web file set up properly or would have to move my CSS, but after some trial-and-error (inspired by that post), I concluded !important in the font-face declaration was causing my trouble.  I had my code as the OP did with !important after my font-family and src; when removed from both lines, the font showed up as hoped for (yay!)

     

    (P.S. for others who may find this and wonder as I did -- I found it didn't matter if the web file's name/partial URL/font name matched each other at all, only that your src value in the CSS matches the partial URL.  I also placed my CSS in a custom file uploaded to my site's theme just like how you would add other customizations.  Final note, I could only see the font showing up when I opened a full preview of the site; it didn't show up in the styling editor preview window.)

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Introducing the 2026 Season 1 community Super Users

Congratulations to our 2026 Super Users!

Kudos to our 2025 Community Spotlight Honorees

Congratulations to our 2025 community superstars!

Congratulations to the March Top 10 Community Leaders!

These are the community rock stars!

Leaderboard > Power Pages

#1
DP_Prabh Profile Picture

DP_Prabh 53

#1
rezarizvii Profile Picture

rezarizvii 53

#3
oliver.rodrigues Profile Picture

oliver.rodrigues 24 Most Valuable Professional

Last 30 days Overall leaderboard