Code injection in Ghost allows you to easily add CSS styles, custom fonts, meta tags, and scripts to your site header and footer.

To access the code injection feature, go to Settings → Code Injection area of Ghost admin.

Code added within the Site Header will be output within the <head> </head> of your site, and the code added to the Site Footer will be placed before the closing </body> tag.

When using code injection, any custom CSS or scripts you add will appear on every single page of your site – without having to edit your theme files directly. You can also use code injection on individual posts and pages from within the Editor, in the Post Settings menu.

Below are a few common examples of CSS that can be used to make changes to your site design, if using our default theme, Source:

Increase the logo size in the header

<style>
.gh-navigation-logo img {
    max-height: 40px; /* increase value to increase logo size */
}
</style>

Remove Ghost branding from the footer

<style>
.gh-footer-copyright {
   display:none;
}
</style>

Change the direction of elements and text to right-to-left

<style>
  body {
    direction: rtl;
  }
</style>

For more examples, check out the Code injection tutorial.