Re: I don't have base.css (and other issues)

Solved

Why isn't my CSS theme saving changes on my site?

luigivento
New Member
7 0 0

Hi

 

I only have three css files:

 

gift-card.scss.liquid 

theme.scss.liquid

timber.scss.liquid

 

No base.css etc.

 

Also, when I for example change the background in theme settings (not inside css) it looks fine but then after saving the changes it goes back to the original (white). It even keeps the value yet the color doesn't match.

 

luigivento_0-1713873974861.png

 

EDIT: after several attempts, clicking on the "recently selected" color did the trick. But it should not behave like that, I guess.

 

 

Pls help.

Accepted Solution (1)

TerenceKEANE
Shopify Partner
512 86 79

This is an accepted solution.

Hi!

 

Theme colors can be manually modified. What specific area would you like to work on, and what is the website name?

 

Now, I'll guide you through the process of adding the 'base.css' file. Navigate to the 'Edit Code' option in your theme settings, then search for “Asset” in the search bar.

 

Next, click on "+ Add a new asset" and create a new file named "base.css" from the options below.

 

TerenceKEANE_0-1713890574586.png

 

Now, we'll link this newly created file to the main 'theme.liquid' file. You need to add the following code to the top of the 'theme.liquid' file, just above </head>. That's all there is to it.

 

{{ 'base.css' | asset_url | stylesheet_tag }}

 

TerenceKEANE_1-1713890628079.png

 

Terence

 

 

 

 

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
If my support was a lifeline for you, The COFFEE  
would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites

View solution in original post

Replies 7 (7)

TerenceKEANE
Shopify Partner
512 86 79

This is an accepted solution.

Hi!

 

Theme colors can be manually modified. What specific area would you like to work on, and what is the website name?

 

Now, I'll guide you through the process of adding the 'base.css' file. Navigate to the 'Edit Code' option in your theme settings, then search for “Asset” in the search bar.

 

Next, click on "+ Add a new asset" and create a new file named "base.css" from the options below.

 

TerenceKEANE_0-1713890574586.png

 

Now, we'll link this newly created file to the main 'theme.liquid' file. You need to add the following code to the top of the 'theme.liquid' file, just above </head>. That's all there is to it.

 

{{ 'base.css' | asset_url | stylesheet_tag }}

 

TerenceKEANE_1-1713890628079.png

 

Terence

 

 

 

 

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
If my support was a lifeline for you, The COFFEE  
would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites
luigivento
New Member
7 0 0

Hi Terence, 

 

Thank you so much for your reply!

 

Basically, I'd like to have the freedom of changing tiny details in the stylesheet also in general, but especially when I'm not able to do it on Shopify. Reading through the topics I thought I'd need a base.css file in the first place (not sure now). To be specific, for example (and I made a post earlier about it) I want to increase font size the price tag under the product photo, when I check this in Chrome inspector I can see its class:


.grid-link__sale_price

 

I can also see it's from 

 

theme.scss.css:809

 

However when I click on edit code, under Assets folder, the theme.scss.liquid (if that's the same document at all) has no such element in that line or anywhere else. In fact, it's a completely different stylesheet.

So I'm just trying to understand how it works.

www.zumo.hu - this is the site

Many thanks
Lajos

TerenceKEANE
Shopify Partner
512 86 79

I understand your point perfectly. Indeed, managing a Shopify store often involves dealing with recurring minor and big issues. You can either seek solutions in forums or hire professional support. Our services encompass a wide range of tasks, even beyond what you've mentioned. Premium themes often limit customization options, and relying solely on copy-and-paste methods without CSS knowledge can lead to unintended consequences elsewhere on your website. The area you're referring to might be defined in a separate file or embedded inline.

To adjust the font size of the text in that specific area, you can add the following codes to your "base.css" file:

 

.product-single__prices #ProductPrice, .product-single__prices #ComparePrice {
    font-size: 35px;
}

 

TerenceKEANE_0-1713959943249.png

 

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
If my support was a lifeline for you, The COFFEE  
would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites
luigivento
New Member
7 0 0

Hi Terence

 

Thanks! I already did something similar and it works. So, adding base.css the way you mentioned did the trick!

 

Cheers!

 

TerenceKEANE
Shopify Partner
512 86 79

 

You are welcome 😉

Let me know if you need any further assistance. Feel free to tag me or send a private message when opening a new topic. If I find time outside of our software and "Shopify Premium Support" service, I can assist.

Best regards.

 

Terence.

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
If my support was a lifeline for you, The COFFEE  
would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites
luigivento
New Member
7 0 0

Thanks Terence

TheVibeDesign
Visitor
1 0 0

 

Hey, 

 

will this solution override the current CSS in the .scss file? Also, would I need to copy all .scss to the new CSS file you mentioned creating? 

 

Thanks