콘텐츠로 건너뛰기
주의:: 이 문서는 사용자의 편의를 위해 제공됩니다. 이 문서는 번역 소프트웨어를 사용하여 자동으로 번역되었으며 교정을 거치지 않았을 수 있습니다. 이 문서의 영어 버전이 가장 최신의 정보를 확인할 수 있는 공식 버전으로 간주해야 합니다. 여기에서 액세스할 수 있습니다..

CTA에 사용자 지정 스타일 추가 (구 버전)

마지막 업데이트 날짜: 2026년 8월 3일

명시된 경우를 제외하고 다음 구독 중 어느 것에서나 사용할 수 있습니다.

참고: 2025년 3월 17일 이후에 생성된 계정은 CTA(구 버전) 도구를 사용할 수 없습니다.

HubSpot의 CTA(레거시) 고급 옵션을 사용하여 웹사이트 테마와 완벽하게 어울리는 고도로 맞춤화된 CTA 버튼을 생성하세요. 사용자 정의 CSS 클래스를 사용하여스타일시트에서 사용자 정의 클래스 입력을 지원하거나, CTA에 직접 사용자 정의 CSS를 추가할 수 있습니다.

CTA(레거시)를 더욱 세밀하게 맞춤 설정하려면 CTA 크기 편집 방법을 확인해 보세요. 이메일이나 템플릿에 CTA(레거시)를 추가하는 경우, CTA를 중앙에 정렬하는 방법을 확인해 보세요.

권한 필요 CTA(레거시)를 생성하고 편집하려면 슈퍼 관리자 권한 또는 블로그, 이메일, 랜딩 페이지, 웹사이트 페이지에 대한 권한이 필요합니다.


버튼 CTA에 사용자 지정 스타일을 추가하려면:

  1. HubSpot 계정에서 더 보기를 클릭한 다음 마케팅 > CTA로 이동하세요. 더 보기가 계정에 표시되지 않으면 바로 마케팅 > CAT로 이동하세요.
  2. 왼쪽 상단의 드롭다운 메뉴 를 클릭하고 ‘CTA(레거시)’를 선택합니다.
  3. CTA 위에 마우스를 올린 후 ‘작업’을 클릭하고 ‘편집’을 선택하거나, ‘CTA 생성’을 클릭합니다.
  4. 오른쪽 패널에서 아래로 스크롤하여 ‘고급 옵션’ 섹션을 클릭해 펼치세요.

  5. '사용자 지정 CSS 클래스' 또는 '사용자 지정 CSS' 옵션 중 하나만 사용하여 CTA에 사용자 지정 CSS 스타일을 적용할 수 있습니다. 두 옵션을 모두 적용하면 CTA 스타일이나 표시에 문제가 발생할 수 있습니다.
    • 사용자 지정 CSS 클래스: 사용자 지정 클래스 입력을 지원하기 위해 CTA에 사용자 지정 클래스를 추가합니다 . 이 기능은 웹사이트 페이지 전반에 걸쳐 여러 CTA가 글꼴 패밀리, 크기, 패딩 및 여백과 같은 유사한 디자인 특성을 공유해야 할 때 유용합니다. 사용자 지정 CSS 클래스를 사용하는 경우, 해당 클래스가 HubSpot 페이지의 기본 스타일로 적용된CSS 스타일시트에 포함되어 있고 스타일이 지정되어 있는지 확인하십시오.
    • 사용자 지정 CSS: 편집 중인 CTA에만 적용할 사용자 지정 스타일을 추가합니다. ‘사용자 지정 CSS’ 필드에서 해당 CTA에 특화된 인라인 스타일을 적용할 수 있습니다. CTA의 특정 요소를 변경하려면, 변경 사항을 저장하기 전에 여기에 새로운 스타일 선언을 추가하십시오.
  6. 오른쪽 하단의 ‘다음 >’을 클릭하여 CTA(레거시) 생성 또는 편집을 완료하세요 .

참고: 사용자 정의 스타일은 사용자 정의 버튼 에만 적용할 수 있으며, 이미지 버튼에는 적용할 수 없습니다.

ctas-custom-design
이 문서가 도움이 되었나요?
이 양식은 문서 피드백에만 사용됩니다. HubSpot으로 도움을 받는 방법 알아보기.