하나의 영웅 이미지는 한 가지를 말합니다. 가장 좋은 서너 장의 사진을 회전하는 영웅 배경은 레이아웃에 단일 위젯을 추가하지 않고도 훨씬 더 많은 것을 말해줍니다. The 배경 슬라이더 확장 에서 Elementor용 마스터 애드온 섹션의 정적 배경을 이미지 슬라이드쇼로 대체: 사진을 선택하고 전환을 선택하고 배경이 그 뒤에 순환하는 동안 콘텐츠가 맨 위에 놓입니다.
다음은 소용돌이 전환과 함께 세 장의 사진을 순환하는 데모의 완성된 영웅입니다:
백그라운드 슬라이더 확장자가 수행하는 작업 #
활성화되면 컨테이너, 섹션 및 열은 다음을 얻습니다 배경 슬라이더 패널 스타일 일반 배경 섹션 옆에 있는 탭. 뒤집어서 미디어 라이브러리의 이미지를 추가하면 섹션 배경이 시간 제한 슬라이드쇼가 됩니다. 이에 대한 모든 것은 구성 가능합니다:
- 이미지 추가: 표준 WordPress 갤러리 편집기에서 슬라이드를 들고 있는 갤러리 필드를 재정렬하거나 제거합니다.
- 전환: 슬라이드 간 24가지 효과와 무작위: 페이드, 4방향 슬라이드, 확대 및 축소, 소용돌이, 굽기, 흐림 및 플래시, 각각 두 번째 변형.
- 애니메이션: Ken Burns는 각 슬라이드에서 Random 또는 None의 9개 방향으로 동작을 수행합니다.
- 사용자 정의 오버레이: 슬라이드 위의 색상, 그라데이션 또는 이미지 레이어와 텍스트를 계속 읽을 수 있도록 하는 9가지 사전 설정된 오버레이 스타일.
- 지연 및 타이머: 각 슬라이드가 얼마나 오래 유지되는지 (기본적으로 5000ms), 그리고 얇은 진행률 막대가 각 슬라이드에 남은 시간을 표시하는지 여부.
- 무작위 디스플레이, 이미지 해상도, 표지: 페이지가 생성될 때 순서를 섞고, 로드된 크기를 선택하고, 이미지가 섹션을 채우는 방법을 제어합니다.
시작하기 전에 #
- 워드 프레스 와 함께 엘리멘터 설치되고 활성화됩니다.
- Elementor용 마스터 애드온 설치 및 활성. 플러그인에 새로운? 따라 설치 가이드 첫번째.
- Background Slider 는 무료 확장 프로그램이므로 Pro 라이센스가 필요하지 않습니다.
- 전폭 디스플레이에 적합한 크기의 두 개 이상의 이미지, 이상적으로는 유사한 크기입니다.
백그라운드 슬라이더 확장을 활성화하는 방법 #
WordPress 대시보드에서 다음으로 이동하세요 마스터 애드온 그리고 열어보세요 확장 탭. 배경 슬라이더가 에 있습니다 애니메이션 위젯 그룹, 옆에 애니메이션 그라데이션 BG (프로). 보라색으로 변하도록 토글을 클릭한 다음 누르세요 변경 사항 저장 그리고 녹색 “설정이 성공적으로 저장되었습니다” 공지를 기다리십시오.
패널을 열고 이미지를 추가합니다 #
Elementor 편집기에서 영웅 컨테이너를 선택하고 을 엽니다 스타일 탭. 확장 배경 슬라이더 보라색 MA 배지와 스위치가 있는 섹션입니다 배경 슬라이더 활성화 예. 전체 설정 목록이 나타납니다 적용 미리보기에 변경 사항을 푸시하기 위한 상단 버튼입니다.
클릭 이미지 추가 그리고 미디어 라이브러리에서 슬라이드를 골라보세요. 데모는 세 개의 서비스 사진을 사용합니다. 갤러리 편집기는 순서를 처리합니다: 드래그하여 재배열하거나,X 를 눌러 하나를 떨어 뜨리거나,갤러리에 추가하면 더 많은 것을 얻을 수 있습니다.
전환과 모션을 선택합니다 #
X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 전환 드롭다운은 하나의 슬라이드가 다음 슬라이드로 넘어가는 방법을 결정합니다. 목록은 길게 실행됩니다: 페이드,왼쪽, 오른쪽,위, 아래로 슬라이드,확대 및 축소,왼쪽 및 오른쪽으로 소용돌이,번, 흐리게,플래시, 각각 두 가지 변형으로 구성된 데모가 켜집니다 왼쪽으로 소용돌이치세요.
X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 애니메이션 설정은 각 슬라이드 내부에 Ken Burns 의 움직임을 추가하고,천이 전환 사이에 배경을 계속 유지하는 느린 팬과 줌을 추가합니다. 방향을 선택하거나 로 설정합니다 무작위 그리고 각 슬라이드가 자신의 방식으로 드리프트하도록 하세요.
오버레이, 지연 및 타이머 #
바쁜 사진의 흰색 텍스트는 도움이 필요합니다. 회전 사용자 정의 오버레이 슬라이드 위에 색상, 그라데이션 또는 이미지를 표시하고 놓거나 9개의 사전 설정 중 하나를 선택합니다 오버레이 가독성을 위해 만들어진 패턴이 있는 스타일. 그 아래, 지연 각 슬라이드가 몇 밀리초 동안 유지되는지 설정합니다(데모에서는 5000) 타이머 각 슬라이드에 대한 진행률 표시줄을 표시합니다(슬라이드는 양방향으로 회전함) 덮개 이미지가 섹션 가장자리에서 가장자리까지 채우도록 합니다.
페이지의 결과 #
게시 및 영웅이이 페이지의 상단에있는 GIF 에서와 정확히 같이,그 자체로 순환: 각 사진은 지연에 대한 보유,다음으로 소용돌이,제목과 버튼은 상단에 고정 유지. 방문자는 별도의 슬라이더 위젯없이 이동 배경을 얻을,아래 섹션 구조는 결코 변경되지 않습니다.
배경 슬라이더가 잘 작동하는 곳 #
- 영웅 섹션. 첫인상을 하나에 걸지 말고 세 장의 강렬한 사진을 회전하세요.
- 서비스 사업. 하나의 헤드라인 뒤에 작업 중인 팀을 표시합니다.
- 레스토랑 및 장소. 예약 버튼 뒤에서 요리 및 인테리어를 순환합니다.
- 포트폴리오. 소개 섹션의 배경으로 최근 프로젝트.
- 랜딩 페이지. 고정된 클릭 유도 문구 뒤에서 회전하는 제품 각도입니다.
비디오 자습서 #
게시된 페이지에서 확장 기능 활성화부터 사이클링 영웅까지 슬라이더가 끝에서 끝까지 구축되는 모습을 시청하세요.
자주 묻는 질문 #
Elementor 섹션에 배경 슬라이드쇼를 추가하려면 어떻게 해야 합니까?
마스터 애드온 확장 탭에서 배경 슬라이더 확장을 활성화하고 섹션을 선택한 다음 스타일 탭에서 배경 슬라이더를 엽니다. 켜고 두 개 이상의 이미지를 추가하고 전환을 선택하면 섹션 배경이 자동으로 순환됩니다.
어떤 전환 효과가 포함됩니까?
Twenty-four plus Random: 페이드,왼쪽, 오른쪽,위, 아래로 슬라이드,줌인 및 아웃,왼쪽 및 오른쪽으로 소용돌이,번, 블러,플래시, 각각 두 번째 변형이 있습니다. 별도의 애니메이션 설정으로 각 슬라이드 안에 Ken Burns 팬 앤 줌 모션이 추가됩니다.
사진 위에 글자를 읽을 수 있게 보관할 수 있나요?
예. 슬라이드 위의 색상,그라디언트 또는 이미지 레이어에 대해 사용자 지정 오버레이를 켜거나 9 가지 사전 설정 오버레이 스타일 중 하나를 선택합니다. 데모에서는 어두운 오버레이를 사용하므로 흰색 표제와 버튼이 모든 슬라이드에서 대비를 유지합니다.
슬라이드 속도를 어떻게 제어하나요?
지연 필드는 각 슬라이드가 기본적으로 5000 으로 표시되는 밀리초 수를 설정합니다. 타이머는 진행률 표시줄만 표시합니다. 슬라이드가 어느 쪽이든 자체적으로 회전하기 때문입니다. 페이지가 생성될 때마다 Random Display 가 슬라이드 순서를 섞기 때문에 캐시된 페이지에서는 캐시가 지워질 때만 순서가 변경됩니다.
Background Slider 확장 프로그램은 무료인가요?
예. 배경 슬라이더는 확장 탭의 애니메이션 위젯 그룹에서 Elementor 용 Master Addons 무료 버전과 함께 제공됩니다. 가격 페이지는 Pro 플랜이 추가하는 내용을 다룹니다.
Elementor에는 자체 배경 슬라이드쇼가 있나요?
예. Free Elementor 에는 5 개의 전환,Ken Burns 확대 또는 축소,lazyload 및 장치별 위치 지정이 포함된 슬라이드쇼 배경 유형이 있습니다. 배경 슬라이더에는 24 개의 전환,Ken Burns 의 9 개 방향,패턴 오버레이,무작위 순서 및 타이머 막대가 추가됩니다. 제품 페이지에는 전체 비교표가 있습니다.
감싸는 #
X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 배경 슬라이더 확장 섹션 배경을 하나의 토글과 몇 가지 선택 사항으로 슬라이드 쇼로 바꿉니다: 이미지,전환, 오버레이,지연. 콘텐츠는 그대로 유지되고 배경이 작업을 수행하며 추가 슬라이더 위젯이 레이아웃에 들어 가지 않습니다. 사진이없는 모션의 경우 애니메이션 그라데이션 배경 확장 (Pro) 대신 색상으로 동일한 섹션을 다루고 전체 세트를 다룹니다 마스터 애드온 위젯 및 확장 한 페이지 떨어져 있습니다.
