Wix 에디터: Lottie 애니메이션을 사이트로 가져오기
2 분 분량
페이지 메뉴
- 1단계 | Lottie 애니메이션 추가하기
- 2단계 | 애니메이션 URL 복사하기
- 3단계 | 파일을 Wix 사이트로 가져오기
Lottie 애니메이션은 사이트에 추가할 수 있는 고품질 애니메이션 파일입니다. LottieFiles 계정에서 직접 애니메이션을 가져오면 코드를 추가할 필요 없이 개성있고 생생한 페이지를 추가할 수 있습니다.
시작하기 전:
애니메이션을 가져오려면 LottieFiles 계정이 필요합니다.
1단계 | Lottie 애니메이션 추가하기
먼저, 요소 추가 패널에서 사이트에 Lottie 애니메이션 요소를 추가합니다.
사이트에 Lottie 애니메이션을 추가하려면:
- 에디터 왼쪽에서 요소 추가
를 클릭합니다.
- 코드 삽입을 선택합니다.
- 애니메이션으로 스크롤합니다.
- Lottie를 클릭해 사이트에 추가합니다.
2단계 | 애니메이션 URL 복사하기
LottieFiles의 워크스페이스에 애니메이션을 저장한 후에는 URL을 복사해 직접 붙여넣을 수 있습니다. 나만의 디자인에서 선택하거나 LottieFiles.com에서 무료로 사용할 수 있는 수많은 애니메이션 중 하나를 가져올 수 있습니다.
애니메이션의 URL을 검색하고 복사하려면:
- LottieFiles 계정에 로그인합니다.
- 원하는 애니메이션을 선택합니다.
- Save to workspace to generate를 클릭합니다.
- Asset link 아래에서 복사 아이콘을 클릭합니다.
알고 계시나요?
Lottie 애니메이션은 벡터 파일이므로 데스크톱과 모바일 사이트 모두에서 품질을 유지합니다.
3단계 | 파일을 Wix 사이트로 가져오기
애니메이션의 URL을 복사한 후 Wix 사이트의 요소에 붙여넣으면 방문자에게 재미있고 독특한 경험을 선사할 수 있습니다.
파일을 사이트로 가져오려면:
- 에디터에서 Lottie 애니메이션 요소를 선택합니다.
- 설정
아이콘을 클릭합니다.
- 애니메이션 효과 URL 입력란에 URL을 붙여넣습니다.
- 키보드에서 Enter 키를 누릅니다.
다음 단계:
- 패널 상단에서 애니메이션 미리보기를 클릭해 애니메이션이 어떻게 재생되는지 확인합니다.
- 설정을 사용해 애니메이션 재생 방식을 조정합니다. Lottie 애니메이션 조정에 대해서 자세히 알아보세요.
참고 사항:
Lottie 애니메이션은 Wix 사이트로 가져오면 자동으로 JSON 파일로 변환됩니다. 기술적인 이유로 모든 파일 입력란을 포함할 수는 없습니다. 따라서, Lottie 애니메이션은 라이브 Wix 사이트에서는 약간 다르게 보일 수 있습니다(예: 감소된 범위/모션 양을 표시).