Add custom css to ghost theme


I am new to Ghost. I have been using WordPress for quite long. In WordPress, i can add custom css to the theme using the admin login.
I Ghost admin UI, I don’t see any section to add custom css.
Can i add custom css using admin login ?


You can add custom CSS in “Settings > Code injection > Site Header” field.

  body {


Thanks :slight_smile:

Should I put the code in Header or Footer ? Which one is better ?

Also, Can I put a js file in the theme and use it like this in the Code section ( as you suggested) ?

<script defer src="/assets/js/flying-pages.min.js"></script>
  window.addEventListener("load", () => {
      delay: 0,
      ignoreKeywords: [],
      maxRPS: 3,
      hoverDelay: 50

Thanks so much :slight_smile:

CSS should be put in the Header section.

Yes, you can insert any JS code and the Footer section is more preferable. But,

  1. You should use {{asset}} helper to import JS file.
<script defer src="{{asset "/assets/js/flying-pages.min.js"}}"></script>
  1. Make sure {{ghost_foot}} helper is right before the closing </body> tag (after loading the JS file).

Thank You so much :slight_smile:

1 Like