배지에 애니메이션 추가하기

애니메이션 효과를 추가해 세일, 한정 기간 혜택, 중요한 제품 정보에 고객의 시선을 모아 보세요.

애니메이션을 추가하는 방법

1. 배지 편집기 열기

   Sami Product Labels에서 Badges & Labels로 이동하세요. 기존 배지는 Edit badge/label을 클릭하고, 새 배지는 Create badge를 클릭한 다음 초기 배지 설정을 완료합니다.

2. Design 열기

   편집기는 기본적으로 Design으로 열립니다. 다른 탭에 있다면 Design을 클릭하세요.

3. Advanced settings 펼치기

   Design 하단까지 스크롤한 다음 Advanced settings를 클릭하세요.

   

   Advanced settings를 펼치면 Effects 아래에서 애니메이션 설정을 찾을 수 있습니다.

4. Use animation 켜기

   Effects에서 Use animation을 켜세요. 애니메이션 유형, 속도, 반복 설정이 나타납니다.

5. 애니메이션 유형 선택하기

   사용 가능한 13가지 효과 중 하나를 선택하세요. Pulse, Flash, Bounce in, Bounce out, Swing, Wobble, Flip, Gelatine, Roll in, Roll out, Rotate in down left, Rotate in up left, Hi there가 있습니다.

   

   애니메이션 효과를 선택한 다음 속도와 반복 횟수를 조정하세요.

6. 애니메이션 속도 설정하기

   Animation speed 슬라이더나 숫자 필드에서 0부터 10 사이의 값을 설정하세요. 조정하면서 실시간 미리보기를 확인해, 제품에서 시선을 빼앗지 않으면서도 효과가 눈에 띄도록 하세요.

7. 반복 횟수 설정하기

   Animation Repeat 슬라이더나 숫자 필드에서 0부터 100 사이의 값을 설정하세요.

8. 저장하고 미리 보기

   실시간 미리보기에서 효과를 확인하세요. 컬렉션 페이지와 제품 페이지 미리보기, 데스크톱과 모바일 화면을 전환할 수 있습니다. 애니메이션이 만족스러우면 편집기 상단의 Save를 클릭하세요.

참고

저장한 배지를 스토어프런트에서도 확인하세요. 테마 CSS와 페이지 레이아웃에 따라 애니메이션이 느껴지는 방식이 달라질 수 있습니다.

다음 단계

• 배지 스타일 변경하기 - 배지의 글꼴, 색상, 테두리, 배경을 사용자 지정합니다.
• 사용자 지정 CSS 사용하기 - 사용자 지정 CSS로 고급 스타일링과 애니메이션 미세 조정을 합니다.

팁

지원이 필요하신가요?

이 단계를 따라 하다가 어려움이 생기면 [email protected]로 문의해 주세요.