버튼 텍스트와 색상 변경하기

견적 버튼의 문구와 모양은 모두 Button & widget 탭에 있으며, 몇 개 섹션 떨어져 있습니다. 이 페이지에서 두 가지를 모두 다룹니다.

문구 변경하기

1. 버튼 설정 열기

   앱에서 Quote settings로 이동해 Customize를 클릭한 다음 Button & widget 탭을 엽니다.

2. Button text 편집하기

   Button text는 Quote Button Settings 섹션의 첫 번째 필드입니다. 기본값은 Add to Quote이며, 도움말에는 “This text appears on product pages and collection pages. Recommended default: Request a Quote.“라고 표시됩니다.

   

3. 저장하고 스토어프런트 새로 고침하기

   변경 사항을 저장한 다음 제품 페이지를 새로 고쳐 새 문구를 확인하세요.

   

   실제 제품 페이지에 표시된 Button text의 문구.

참고

문구는 생각보다 중요합니다. “Request a Quote”는 약속처럼 느껴지고, “Check price”처럼 가벼운 표현이 고가 제품에서 더 많은 클릭을 얻는 경우가 많습니다. 같은 텍스트가 컬렉션 그리드의 제품 카드에도 들어가야 하므로 짧게 유지하세요.

모양 변경하기

같은 탭에서 Style까지 아래로 스크롤하세요.

설정	변경되는 항목
Button type	Filled, Outline, Text link 중 선택합니다. Filled가 가장 눈에 띄고, Text link가 가장 조용합니다.
Size	Medium, Large, Full width 중 선택합니다. Full width는 보통 구매 버튼 바로 아래에서 가장 잘 어울립니다.
Text color	버튼에 표시되는 문구의 색상입니다.
Background color	버튼의 채우기 색상입니다.
Font size	텍스트 크기이며 단위는 px입니다.

주의

데스크톱뿐 아니라 휴대폰에서도 결과를 확인하세요. Preview 패널에는 데스크톱/모바일 전환 버튼이 있습니다. 넓은 화면에서 적당해 보이는 글꼴 크기가 모바일의 제품 카드에서는 너무 큰 경우가 많습니다.

테마와 맞추기

흔히 사용하는 조합은 Outline을 선택하고 Text color를 테마의 강조 색상으로 지정하는 것입니다. 견적 버튼이 채워진 장바구니에 담기 버튼보다 확실히 보조적인 위치에 있으면서도 같은 디자인에 어우러집니다.

견적 버튼이 구매 버튼 옆에 있다면, 버튼 줄이 고르지 않아 보이지 않도록 Size를 구매 버튼과 맞추세요.

다른 언어

Button text는 기본 언어의 문구를 설정합니다. 고객에게 표시되는 나머지 항목과 함께 번역하려면 Advanced settings의 Translations AI를 사용하세요. “Translate everything your customers see — quote form, storefront text and both quote emails.”

스토어프런트 텍스트 번역하기를 참고하세요.

다음 단계

• 클릭 후 동작 설정하기 — 고객이 클릭하면 일어나는 일
• 제품 페이지의 견적 버튼 — 버튼이 표시되는 위치
• 테마 스타일에 맞추기 — 견적 양식 스타일을 테마에 맞추기