Font of Netlify CMS are times new roman

Hi everyone!

For some reason the styles of my CMS suddenly changed and the text is using times new roman as the font-family. I’m trying to figure out what made this happen to my netlify CMS but can’t seem to find the source of the problem.

Is there a way for me to set the font-family used in the netlify CMS myself?

Here’s what my CMS looks like right now

1 Like

You can add custom CSS like this: Creating Custom Previews | Netlify CMS | Open-Source Content Management System

Thank you so much, i’ll check this out!

I forgot to mention, those styles affect only the preview page and probably won’t affect the area where you’re having an issue.

However, this doesn’t happen. Is there a chance the font download is getting blocked or something or the system is having troubles rendering the font?

Yeah once reading the docs it seems to only affect the previews.

Does netlify CMS use bulma in order to handle styling?

I’m not sure. I think it probably uses Bootstrap. But that’s just for the open-source part. The final JS file that actually renders the CMS has all the styles built in itself I suppose.

Gotcha, i’ll try to look more into the package itself. Will post an answer here if I ever do find one just incase someone runs into the same problem.

2 Likes

Have you find solution ?

Just find out the solution,

update config to enable manual init.

{
  resolve: 'gatsby-plugin-netlify-cms',
  options: {
    manualInit: true,
    modulePath: `${__dirname}/src/cms/cms.js`,
  },
},

and init into your cms.js file

import CMS from 'netlify-cms-app';

import { IndexPagePreview } from './previews/IndexPagePreview'

CMS.init();

CMS.registerPreviewTemplate('index', IndexPagePreview);