Re: Spotlight theme - how to add to cart button

Solved

Spotlight theme - how to add to cart button

backbeatwear
New Member
6 0 0

Hi all, 

I recently started creating my shop. So as in title is there any option to create "add to cart" button in my theme? 

It is little bit annoying having only buy now option to choose. 

 

Thank's for any feedback

Accepted Solutions (2)

TerenceKEANE
Shopify Partner
512 86 79

This is an accepted solution.

Hi,

 

It seems that some elements might be hidden or there could be an incorrect setting causing the issue, possibly originating from your theme.

The following code will do what you want. You can change the values as you like. If you encounter any issues again, feel free to write, I'll help.

 

Navigate to the 'Edit Code' option in your theme settings, then search for “base.css” in the search bar and add below codes.

 

 

 

.product-form__buttons .button {

    background: aliceblue;

}

 

shopify.base.css.jpg

 

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

TerenceKEANE
Shopify Partner
512 86 79

This is an accepted solution.

Hi again.

 

There's really no need. The color issue is quite complicated. Add an "eye dropper" in the Chrome browser, then you can set the colors in the area below as "#916d3b".

 

Example

 

background: #916d3b;

★ 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 8 (8)

JasmeetVT14313
Shopify Partner
273 59 72

Hi @backbeatwear 
Can you please share your store URL

- VTN Customer Dashboard enhances your customer's dashboard with advanced features, profile management, and order tracking. Free trial available.
- Feel free to contact me at jasmeet.kaur@vtnetzwelt.com

huynhmaianhkiet
Shopify Partner
17 0 8

Hi @backbeatwear,

 

I have checked your website and noticed that the add-to-cart button is still present, but its color is set to black and blends with the background color of the website, making it invisible. To make it visible, you need to adjust the background color for the add-to-cart button.

 

2024-04-24_15-18-43.png

 

Hura Apps: A Vietnam based Shopify Expert
Hura Theme Blocks: Next Generation Page Builder
AntiCopy: Prevent Content Theft
Hura Product Showcase Builder: Sell Anywhere
backbeatwear
New Member
6 0 0

How can i easily change color of button ? 

Dan-From-Ryviu
Shopify Partner
9668 1936 1970

Hi @backbeatwear 

Buy buttons include Add to cart button on product page.

- Helpful? Like and Accept solution! Support me! Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

backbeatwear
New Member
6 0 0

Yes but it got same color as whole page background

 

TerenceKEANE
Shopify Partner
512 86 79

This is an accepted solution.

Hi,

 

It seems that some elements might be hidden or there could be an incorrect setting causing the issue, possibly originating from your theme.

The following code will do what you want. You can change the values as you like. If you encounter any issues again, feel free to write, I'll help.

 

Navigate to the 'Edit Code' option in your theme settings, then search for “base.css” in the search bar and add below codes.

 

 

 

.product-form__buttons .button {

    background: aliceblue;

}

 

shopify.base.css.jpg

 

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
backbeatwear
New Member
6 0 0

Hi, 

thanks for help. now only question about changing button color. if i want to use one of the theme colors. do i write color code instead of name : aliceblue ??

TerenceKEANE
Shopify Partner
512 86 79

This is an accepted solution.

Hi again.

 

There's really no need. The color issue is quite complicated. Add an "eye dropper" in the Chrome browser, then you can set the colors in the area below as "#916d3b".

 

Example

 

background: #916d3b;

★ 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