Button Bold

Topic summary

Goal: Make all “Button label” texts bold in a Shopify theme section (store link and password provided).

Proposed solutions:

  • HDL-Shin: Edited CSS for .button margin and :after border offset; did not apply bold text.
  • PageFly-Henry: In base.css, target a.button.button–secondary with font-weight: 900 and font-size: 24px; also suggests rounding corners.
  • Devcoders (iteration):
    • custom-style.css: .button, .buttonmutirow { font-weight: bold !important; } to bold all buttons.
    • Then refined to .button.button–secondary with specific font (Reckless) and size to match “Row” text style.
    • Final update in base.css: .button.button–secondary with font-family: Reckless, font-size: 42.63px, font-weight: 700, line-height, left alignment, and color override.

Notes:

  • Key files: base.css and custom-style.css under Online Store → Theme → Edit code.
  • .button–secondary refers to the secondary button style class.
  • Multiple screenshots provided to show file paths and visual results.

Status: No confirmation from the requester that a solution worked. Latest actionable guidance sets bold font-weight (and matching typography) on .button.button–secondary in base.css; thread appears open.

Summarized with AI on December 29. AI used: gpt-5.

Hi there

  • Go to Online Store → Theme → Edit code.
  • Find the file assets/base.css and paste the code below at the bottom of the file.
.button.button--secondary {
font-family: Reckless;
font-size: 42.63px;
font-weight: 700;
line-height: 55.41px;
text-align: left;
color: #252425!important;
}