Code Snippets and Custom CSS

School owners can add Facebook tracking pixels, analytics tools, and other web services to their school using Code Snippets. This article goes over how to make advanced customizations using custom CSS and head code snippets (available on the Basic plan and up).

Custom CSS

If you have coding knowledge and want to further customize the appearance of your school, then you can add custom CSS to your school. Custom CSS allows you to modify your school’s fonts, colors, and backgrounds. To add custom CSS to your school, complete the following steps:

  1. Log in to your Teachable school.
  2. Select Site.
  3. Click Code Snippets.admin-site-code-snippets.png
  4. Enter the code snippet in CSS field.admin-site-code-snippets-css-save.gif
  5. Click Save.

Head Code Snippets

School owners on the Basic plan and up can add additional HTML/JavaScript code snippets to their school's head tag, such as a Facebook tracking pixel.

To add HTML/JavaScript code inside the head tag on all pages in your school, enter the code into the Head Code Snippets section:admin-site-code-snippets-head-code-snippets.png

Alternatively, in the Logged In Snippets section, you can add code inside the head tag for users that are logged in:admin-site-code-snippets-logged-in-snippets.png

Or, in the Logged Out Snippets section, you can add code inside the head tag for users who are logged out:admin-site-code-snippets-logged-out-snippets.png

After you’ve added your custom code, click Save.

NOTE: Adding custom code to your school is an advanced modification—we can't guarantee full functionality or compatibility with current or future versions of Teachable. This includes how the code functions, as well as how it impacts the appearance of your school.

Was this article helpful?
1 out of 3 found this helpful
thanks_illustration

Can't find what you're looking for?

Contact us
thanks_illustration