---
title: Advanced HTML & CSS
description: How to use Advanced HTML & CSS in Booster Theme.
---

[Skip to content](https://help.boostertheme.com/knowledge/advanced-html-css#main-content)

![logo_white_booster-Sep-13-2022-06-54-02-62-PM.png\]](https://help.boostertheme.com/hs-fs/hubfs/logo_white_booster-Sep-13-2022-06-54-02-62-PM.png?height=36&name=logo_white_booster-Sep-13-2022-06-54-02-62-PM.png)

- [Home - Help Center](https://help.boostertheme.com/knowledge)

Open main navigation

Close main navigation

- [Home - Help Center](https://help.boostertheme.com/knowledge)
- [Go to boostertheme.com](https://boostertheme.com/)

[Go to boostertheme.com](https://boostertheme.com/?hsLang=en)

 Hello. How can we help you?

- There are no suggestions because the search field is empty.

1. [Home - Help Center](https://help.boostertheme.com/knowledge?hsLang=en)
2. [In-depth Tutorials](https://help.boostertheme.com/knowledge/in-depth-tutorials?hsLang=en)
3. [Theme settings](https://help.boostertheme.com/knowledge/in-depth-tutorials?hsLang=en#theme-settings)

# Advanced HTML & CSS

## How to use Advanced HTML & CSS in Booster Theme.

This feature allows you to enhance the functionality of your theme by adding custom code. It is especially beneficial for those with coding knowledge. With this feature, you have the flexibility to include scripts anywhere within the HTML structure, specifically within the head and body tags.

#### **In this article:**

1. [Accessing Advanced HTML & CSS](https://help.boostertheme.com/knowledge/advanced-html-css#Accessing-Advanced-HTML-CSS)
2. [Head HTML](https://help.boostertheme.com/knowledge/advanced-html-css#Head-HTML)
3. [Body HTML](https://help.boostertheme.com/knowledge/advanced-html-css#Body-HTML)
4. [Custom CSS](https://help.boostertheme.com/knowledge/advanced-html-css#Custom-CSS)
5. [Head Javascript](https://help.boostertheme.com/knowledge/advanced-html-css#Head-Javascript)
6. [Body Javascript](https://help.boostertheme.com/knowledge/advanced-html-css#Body-Javascript)
7. [Enable jQuery](https://help.boostertheme.com/knowledge/advanced-html-css#Enable-jQuery)

---

#### Accessing Advanced HTML & CSS

In order to access, click **Customize** (Themes section on Shopify) > **Theme settings **> **Advanced HTML & CSS**

**![](https://help.boostertheme.com/hs-fs/hubfs/image-png-Jan-11-2024-06-42-06-1911-PM.png?width=328&height=396&name=image-png-Jan-11-2024-06-42-06-1911-PM.png)**

 

#### Head HTML

This feature allows you to insert additional stylesheets or scripts before the closing head tag (</head>). 

![](https://help.boostertheme.com/hs-fs/hubfs/image-png-Jan-11-2024-07-00-47-7160-PM.png?width=328&height=396&name=image-png-Jan-11-2024-07-00-47-7160-PM.png)

#### Body HTML

This feature allows you to insert custom code before the closing body tag (</body>). By using this feature, you can enhance the functionality of your theme and make specific changes to the HTML structure of your website. This code will be executed after the rest of the page is rendered, giving you the flexibility to customize the appearance and behavior of your website.

![](https://help.boostertheme.com/hs-fs/hubfs/image-png-Jan-11-2024-07-03-16-0897-PM.png?width=328&height=200&name=image-png-Jan-11-2024-07-03-16-0897-PM.png)

#### Custom CSS

This feature allows you to insert custom CSS code before the closing body tag (</body>) by wrapping it with <style></style> tags. By using this feature, you can override the default CSS styles of your theme and customize the appearance of your website.

![](https://help.boostertheme.com/hs-fs/hubfs/image-png-Jan-11-2024-07-04-42-0032-PM.png?width=328&height=281&name=image-png-Jan-11-2024-07-04-42-0032-PM.png)

#### Head Javascript

This code is inserted before the closing head tag (</head>) and is enclosed within <script></script> tags. It is executed prior to the rendering of the page.

![](https://help.boostertheme.com/hs-fs/hubfs/image-png-Jan-11-2024-07-05-55-8618-PM.png?width=267&height=236&name=image-png-Jan-11-2024-07-05-55-8618-PM.png)

#### Body Javascript

This code is placed just before the closing body tag (</body>) and is wrapped within <script></script> tags. It is executed after the rest of the page has finished loading and rendering.

![](https://help.boostertheme.com/hs-fs/hubfs/image-png-Jan-11-2024-07-06-55-2119-PM.png?width=283&height=236&name=image-png-Jan-11-2024-07-06-55-2119-PM.png)

#### Enable jQuery

This feature allows you to include the most up-to-date version of jQuery right before the closing body tag. By enabling this feature, you can enhance the functionality of your theme and make use of the various jQuery plugins and scripts available. 

![](https://help.boostertheme.com/hs-fs/hubfs/image-png-Jan-11-2024-07-07-27-2002-PM.png?width=260&height=133&name=image-png-Jan-11-2024-07-07-27-2002-PM.png)

*- End of the article -*

- [Get started](https://help.boostertheme.com/knowledge/get-started?hsLang=en#main-content)
  
  
  
  
  
    - [Installation Process](https://help.boostertheme.com/knowledge/get-started?hsLang=en#installation-process)
    - [Learning the basics](https://help.boostertheme.com/knowledge/get-started?hsLang=en#learning-the-basics)
- [In-depth Tutorials](https://help.boostertheme.com/knowledge/in-depth-tutorials?hsLang=en#main-content)
  
  
  
  
  
    - [Sections](https://help.boostertheme.com/knowledge/in-depth-tutorials?hsLang=en#sections)
    - [Theme settings](https://help.boostertheme.com/knowledge/in-depth-tutorials?hsLang=en#theme-settings)
    - [Product Page](https://help.boostertheme.com/knowledge/in-depth-tutorials?hsLang=en#product-page)
    - [More tutorials](https://help.boostertheme.com/knowledge/in-depth-tutorials?hsLang=en#more-tutorials)
- [More support](https://help.boostertheme.com/knowledge/more-support?hsLang=en#main-content)
  
  
  
  
  
    - [Partners app Ressource center](https://help.boostertheme.com/knowledge/more-support?hsLang=en#partners-app-ressource-center)
    - [Managing your subscription & theme](https://help.boostertheme.com/knowledge/more-support?hsLang=en#managing-your-subscription-theme)
    - [Change logs & Policies](https://help.boostertheme.com/knowledge/more-support?hsLang=en#change-logs-policies)
    - [Announcements and others](https://help.boostertheme.com/knowledge/more-support?hsLang=en#announcements-and-others)

[![Chill listening crop-3](https://help.boostertheme.com/hs-fs/hubfs/Booster-black-logo.png?width=178&height=51&name=Booster-black-logo.png "Chill listening crop-3")](https://boostertheme.com/?hsLang=en)

<https://www.facebook.com/316229588744482> <https://www.instagram.com/boostertheme> <https://www.youtube.com/c/BoosterTheme>

Copyright © 2026, Booster Theme - PreviewX Inc.