slashpage-help-center
Share
Sign In
Home
슬래시페이지 가이드
시작하기
사이트 만들기
텍스트
이미지
동영상
컬럼
이미지 슬라이더
배경 (베타 기능)
기본 버튼
소셜 버튼
하단 고정 버튼
검색 엔진에 공유
공개 범위 설정
미리보기 수정
사이트 복제
페이지 추가
채널 추가
채팅 채널
블로그 채널
그리드 채널
피드 채널
설문 채널
칸반 보드 채널
목록 채널
갤러리 채널
테이블 채널 (베타 기능)
댓글 창 추가
커버 이미지
테마
애니메이션
푸터 (베타 기능)
멤버와 권한
애널리틱스
사용자뷰 차트와 버튼 클릭수
노션 가져오기
기능
커스텀 도메인 연결 (베타 기능)
사이트 이름(서브 도메인) 수정
클린 URL 적용
페이지 버튼
쇼핑 버튼
목차
채널 글 템플릿
페이지, 채널, 사용자 멘션
다국어 번역 (베타 기능)
외부 서비스 연동
웹훅 (베타 기능)
구글 시트 연동
슬랙 연동 (베타 기능)
텔레그램 연동 (베타 기능)
구글 애널리틱스(GA) 연동
메타 픽셀 연동
기본 용어
주요 화면 구성
단축키
애니메이션
애니메이션 추가
애니메이션 종류
입장(Entrance)
슬라이드(Slide)
페이드인(Fade in)
스케일인(Scale in)
스크롤(Scroll)
패럴록스(Parallax)
페이드인(Fade in)
페이드아웃(Fade out)
스케일인(Scale in)
무한 반복(Infinite)
브레스(Breathe)
슬라이드(Slide)
애니메이션 추가
애니메이션 종류
입장(Entrance)
슬라이드(Slide)
페이드인(Fade in)
스케일인(Scale in)
스크롤(Scroll)
패럴록스(Parallax)
페이드인(Fade in)
페이드아웃(Fade out)
스케일인(Scale in)
무한 반복(Infinite)
브레스(Breathe)
슬라이드(Slide)
블록이 스크롤 위치와 시간에 따라 다양하게 움직이며 내용을 강조하는 효과를 줍니다.
애니메이션 추가
편집 화면 오른쪽에서 애니메이션 메뉴를 클릭합니다.
원하는 블록에 커서를 올리고
애니메이션 추가
를 클릭한 뒤, 원하는 애니메이션을 선택합니다.
애니메이션 적용이 완료된 블록은 이미지와 같이 배경색이 초록빛으로 보입니다. 화면 오른쪽
프리뷰 모드
옵션을 껐다가 키면 뷰 모드로 전환하지 않고도 애니메이션이 적용된 모습을 미리 확인할 수 있습니다.
애니메이션 종류
트리거(애니메이션이 시작되기 위한 행위)에 따라 크게 세 가지로 나뉘며, 트리거마다 각각 다른 애니메이션을 적용할 수 있습니다. 각 이름 아래에 있는 예시를 통해 어떤 효과인지 알아봅니다.
입장(Entrance)
블록이 화면에 표시되자마자 애니메이션이 시작되며, 스크롤 위치와 무관하게 미리 설정한 지속 시간동안만 작동합니다.
슬라이드(Slide)
버튼 설정값: Delay 0.3 | Duration 0.5 | Distance 50 | Direction Up | Animation CubicBezier
이미지 설정값: Delay 0.6 | Duration 0.5 | Distance 50 | Direction Up | Animation CubicBezier
Button
페이드인(Fade in)
버튼 설정값: Delay 0 | Duration 1 | CubicBezier
이미지 설정값: Delay 0.3 | Duration 1 | CubicBezier
Button
스케일인(Scale in)
버튼 설정값: Delay 0 | Duration 0.8 | Animation CubicBezier
이미지 설정값: Delay 0 | Duration 0.8 | Animation CubicBezier
Button
스크롤(Scroll)
스크롤을 내리는 동안 블록이 화면에 보이기 시작할 때부터 보이지 않을 때까지, 애니메이션이 스크롤 위치를 따라 연속적으로 작동합니다.
패럴록스(Parallax)
버튼 설정값: Distance 150 | Direction Left | Overflow Visible
이미지 설정값: Distance 150 | Direction Right | Overflow Visible
Button
페이드인(Fade in)
버튼 설정값: 없음
이미지 설정값: 없음
Button
페이드아웃(Fade out)
버튼 설정값: 없음
이미지 설정값: 없음
Button
스케일인(Scale in)
버튼 설정값: Direction Center
이미지 설정값: Direction Bottom
Button
무한 반복(Infinite)
사이트에 접속하자마자 애니메이션이 시작되며, 스크롤 위치와 무관하게 계속 작동됩니다.
브레스(Breathe)
버튼 설정값: Distance 10 | Duration 2 | Direction Center | Overflow Visible
이미지 설정값: Distance 50 | Duration 4 | Direction Width | Overflow Visible
Button
슬라이드(Slide)
이미지 여러 개가 가로 방향으로 흘러갑니다. 이미지 슬라이더 블록에만 적용할 수 있습니다.
설정값: Speed 2 | Pause on hover On