SectionAI is free + 20K tokens if you're a The4 customer, Free plan is available Install App  

Header background

CUSTOM CSS, JS

Annie

Written by Annie

Last updated

2724 views

On this page


From Theme Settings -> CUSTOM CSS, JS

56.webp

This section helps you customize the theme with CSS/JS code. You can easily add the code here without having to search for the code file in the liquid file section. This will save you time.

1. Bootstrap CSS

When you need to include Bootstrap 5 CSS. But it will affect the speed of your store. Document Bootstrap 5

2. Colors CSS

Use colors custom css: Enable this option to customize the variant color in the Custom color section, you can follow this link to know more.

57.png

3. Custom CSS

Use custom css: You can enable this option so it will apply all code you fill in Custom CSS field.

In this field, we already split to some responsive devices like Global Custom CSS; Custom CSS for only desktop; Custom CSS for tablet, mobile; Custom CSS for only tablet; Custom CSS for only mobile. You can write your code to the correct field.

For example: You want to change the Background color for Shopping Cart Widget and displays it on all devices, you can add this Code to Global Custom Css.

div#t4s-mini_cart {

background-color: #dbe0ff;

color: cornflowerblue;

}

Or you want to display it for only Mobile devices, you can add that Code to Custom CSS for only mobile.

4. Custom JS

You can enable this option so it will apply all code you fill in custom.js file.

56.png

You can go to Edit Code > Open custom.js file and write your code JS here.

57.png

🎁 Exclusive Deals for The4 Customers

SectionAI

🤖 SectionAI – Build Sections with AI

Generate Shopify sections from text or wireframes.
The4 users get +20,000 bonus tokens when verifying their theme license.

  • ✅ No-code section builder
  • ✅ Works with your The4 theme
  • ✅ Build FAQs, banners, product grids & more
🚀 Try Free – Claim Tokens
EComposer

🎉 EComposer – Free 6-Month Plan

Build landing pages, sales funnels, and more with drag & drop.
The4 users get 6 months free (save $114).

  • ✅ 100+ templates ready to use
  • ✅ Build any Shopify page
  • ✅ No coding required
🔓 Get 6 Months Free

Enjoy a free 3-day trial. Then get your first month for $1. Try Now

We uses cookies to ensure you get the best experience on our website.