How can I change the 'Log in/Register' header color?

Store Design
, ,
1

Hi all!

I’m attempting to change the colour of the font of Log-in from black to a different colour. I’ve attempted to locate this in coding section, but not sure where to find the “index” section.

Can anybody help please?

Best,

Dan

Screenshot 2023-05-10 225707.png
Screenshot 2023-05-10 225707.png1923×856 71.3 KB

1 Like
2

Hi @ldmanagement ,

Would you mind to share your URL website and Password if have?

Its hard to locate the specific area in the Images only.

Thanks!

3

Hi! Thanks for the reply.

Yes, of course. https://www.euphoriastore.co.uk/

It’s located on the mobile version. If you click on Log in or Register it takes you to this section, see below

Screenshot 2023-05-11 012557.png
Screenshot 2023-05-11 012557.png1195×951 142 KB

4

Hi @ldmanagement

This is BSS Commerce - Full-service eCommerce Agency.

You can change the color of the “Login/Register” button by adding the following code at the end of the theme.css file

.sf-customer-section .customer-tabs input:checked ~ span {
    color: #9c853b !important;
}

.sf-user-tab-label hr {
    border-color: #9c853b !important;
}

With the above code, I set the color code to #9c853b, you can change that value in the color and border-color sections depending on your needs.

Hope this helps you.

BSS Commerce - Shopify Apps & Development Services Provider - Shopify Expert

Level up your Shopify store with our B2B & B2C apps

1 Like
5

Hi @ldmanagement ,

Thank you for sharing your website.

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “Assets” folder, click on “theme.scss.liquid” or “styles.scss.liquid” file, depending on which file your theme uses to store its CSS styles.
  4. At the bottom of the file, add the following CSS code:
@media only screen and(max-width: 480px){
.sf-customer-section .customer-tabs input:checked ~ span {
    color: #fff;
}
}
6

Thanks so much! This worked :slightly_smiling_face: