Buttons, Color swatch and editing product description

Store Feedback

Topic summary

Store owner seeks changes: make the Pay now button more prominent, display product color as swatches, and add a size chart in product descriptions.

For highlighting the Pay now button:

  • Add Custom CSS under Default Product Template > Buy Buttons.
  • Example uses a colored border and hover effect; adjust colors via HEX codes.

For color swatches:

  • Use a no-code Shopify app (e.g., Globo Color Swatches) to replace text options with visual swatches.

For size charts:

  • Insert an HTML table directly in the product description via Shopify’s editor.
  • Alternatively, use a sizing app (e.g., Kiwi Sizing) or hire a developer for a more integrated solution.

A CSS code snippet and two app links are central to the guidance. CSS (style rules), HEX codes (color values), and Shopify apps (add-ons) are referenced.

No disagreements or final confirmation of changes; actionable suggestions provided and the thread remains open.

Summarized with AI on January 11. AI used: gpt-5.
1

Good morning,

I want to change a few things on my website.

How can I highlight the Pay now button?

How can I change the product color selection to show color swatches and not the color words?

How can I edit the product description for size chart?

2

Hello, here are a few things you can try!

How can I highlight the Pay now button?

To do this there are a few options you can choose from, but a basic step would be adding a colored border to make it stand out, or maybe a hover effect. To do this you can add something like this to Default Product Template>Buy Buttons>Custom CSS then click Save. To adjust color change the HEX code (ex: #000000).

.button {
  border: 2px solid #ff0000;
}
.button:hover {
  border: 2px solid #0000ff;
}

How can I change the product color selection to show color swatches and not the color words?

To do this without coding knowledge it is best to use an app, there are many for this purpose you could try this one:
https://apps.shopify.com/globo-color-swatches

How can I edit the product description for size chart?

Again there are a few ways to do this a simple method is to insert a table using the built in HTML editor in shopify like so:

SIZE LENGTH WIDTH
XS 22’ 12’
XL 44’ 24’

but it may be easier to use an app or hire a developer to code them in, this may work for you:
https://apps.shopify.com/kiwi-sizing

I hope that helps answer some of your questions, don’t hesitate to reach out if you need help with your store!
@biznazz101