1

By better i guess i mean which works faster when rendering the page. I understand that the additional css editor stores the changes in the database. Does that make it quicker or slower than using styles.css in a child theme.

Are there any other considerations, such a maintainability?

  • performance difference is probably negligible, but files are browser cached so that is a plus... but also can be annoying if you are changing styles regularly so best to add some dynamic cachebusting (eg. via the version string.) – majick Jun 11 at 5:14
  • see this answer to do that: wordpress.stackexchange.com/a/294663/76440 – majick Jun 11 at 5:15
3

It depends on your circumstances. There are, however, several things to consider:

Loading

CSS added to Additional CSS is added inline in a <style> tag at the head of every page. This means that if you have lots of CSS you'll increase the size of all your pages individually. So the browser will be essentially forced to download your custom styles multiple times.

On the other hand, while adding CSS to a stylesheet file means that the browser needs to download an additional stylesheet, it also means that the browser can cache the file so the additional styles don't need to be downloaded again for each page.

Setup

If you go with a stylesheet file you have to set up a child theme. This means you need to create a new theme directory, create a style.css file, including the theme header. Then you need to create a functions.php file to properly load the stylesheet, as well has the parent theme's styles. Parent themes all work differently, so this process can be tricky.

So creating a child theme is a lot more effort that just using the Customiser.

Maintaining

Adding CSS to Additional CSS means that you need to use the editor in the Customiser, which is quite narrow, and not well suited to large quantities of CSS.

If you add them in a stylesheet though, you can use whichever text editor you like, at a more comfortable size.


Given the above, my suggestion would be that if you're making small tweaks and changes, then use the Customiser, but if you want to significantly change the design with lots of CSS, create a child theme and use a stylesheet file.

Not that you mentioned it, but just to make to clear to any passers-by: under almost no circumstances should you edit your theme's stylesheet. You should either use the Customiser or create a child theme.

  • Thanks for the detailed answer. It will ultimately be quite a lot of CSS, so child theme is the way to go I think. Good to know about the Additional CSS being inline CSS. – PJSANTA Jun 12 at 6:04

Not the answer you're looking for? Browse other questions tagged or ask your own question.