목차
이것은 거의 모든 웹 사이트가 필요로하는 10 개의 섹션을 다루는 30 + 무료 Elementor 섹션 템플릿 라이브러리입니다: 기능, 정보, 통계, 사용후기, 가격, 팀, FAQ, 클릭 유도문안 밴드, 연락처 양식 및 로고 스트립 각각 작은 JSON 파일로 다운로드하고 Master Addons Widget Builder를 통해 가져 와서 모든 헤드 라인, 버튼, 이미지 및 색상이 레이블이 지정된 필드 인 위젯으로 Elementor 패널에 도착합니다. 동결 된 레이아웃이없고 중첩 된 컨테이너를 통해 사냥하여 가격을 변경하지 않습니다.
우리는 각 템플릿을 손으로 구축했습니다 – 실제 HTML,CSS 및 JavaScript,그 다음 자체 Content 및 Style 컨트롤이있는 Widget Builder 위젯으로 변환했습니다. 그 마지막 단계는이 컬렉션과 일반적인 elementor 템플릿 라이브러리의 차이점입니다: 리버스 엔지니어링해야하는 페이지를 가져 오는 것이 아니라 채우는 위젯을 가져옵니다.
일부러 한 섹션 유형이 누락되었습니다: 영웅. 우리는 이미 전용 컬렉션을 출판했습니다 무료 Elementor 영웅 섹션 템플릿, 같은 위젯 기반 방식으로 구축, 그래서 여기에 그들을 반복 그냥 카운트를 패드 것. 그 게시물에서 영웅을 선택, 아래이 하나에서 섹션을 스택, 당신은 처음부터 단일 블록을 설계하지 않고 완전한 방문 페이지를 조립했습니다.
모든 30 +는 아래에 있으며,섹션 유형별로 그룹화되어 있으며 각각 스크린 샷과 직접 다운로드가 있습니다. 필요한 것을 잡거나 읽으십시오 워크스루 가져오기 첫번째.
슬라이더는 당신이 여기에서 찾을 수 없습니다 다른 것입니다. 회전 목마는 빌드의 다른 종류입니다 – 타이밍, 드래그, 키보드 단계, ARIA 역할 — 그래서 그것은 자신의 컬렉션을 얻었다 회전목마와 슬라이더 디자인: 썸네일 갤러리, 타일이 개편되는 모자이크, 실제 날짜에 고정된 타임라인, 탭 패널 세트 및 진행률 집계가 포함된 견적 슬라이더.
총 스무 디자인. 여덟 무료 플러그인에 가져,이 페이지의 모든 것과 동일; 다른 열두 프로가 필요합니다. 에서 경로는 어느 쪽이든 동일합니다 – 위젯 빌더에 JSON 을 드롭하고 디자인은 당신이 채우는 위젯으로 패널에 착륙.
팩에 무엇이
| 섹션 유형 | 템플릿 | 로 점프 |
|---|---|---|
| 기능 / 서비스 | 4 X 1000 X 1000 X 1000 X 400 X 400 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 4 | 기능 섹션 템플릿 |
| 회사 소개 | 3 X 1000 X 1000 X 1000 X 100 X 100 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X | 섹션 템플릿에 대해 |
| 통계/카운터 | 2 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2 | 대역 템플릿을 통계합니다 |
| 사용후기 | 4 X 1000 X 1000 X 1000 X 400 X 400 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 4 | 사용후기 템플릿 |
| 가격표 | 4 X 1000 X 1000 X 1000 X 400 X 400 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 4 | 가격표 템플릿 |
| 팀 | 3 X 1000 X 1000 X 1000 X 100 X 100 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X | 팀 섹션 템플릿 |
| FAQ | 4 X 1000 X 1000 X 1000 X 400 X 400 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 4 | FAQ 섹션 템플릿 |
| CTA 밴드 | 3 X 1000 X 1000 X 1000 X 100 X 100 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X | CTA 밴드 템플릿 |
| 문의 양식 | 3 X 1000 X 1000 X 1000 X 100 X 100 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X | 섹션 템플릿에 문의하세요 |
| 로고 스트립 | 2 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2 | 로고 스트립 템플릿 |
영웅 섹션은 일부러 여기 있는 게 아니에요. 우리는 이미 전용 팩을 발행했습니다 무료 Elementor 영웅 섹션 템플릿 같은 방식으로 구축했습니다. 이 게시물 섹션 위에 해당 게시물의 영웅을 쌓으면 전체 랜딩 페이지를 조립했습니다.
이러한 Elementor 섹션 템플릿을 가져오는 방법
섹션 템플릿을 가져오려면 해당 압축을 다운로드하고 압축을 푼 다음 다음으로 이동하세요 마스터 애드온 → 위젯 빌더 → 가져오기 wordpress 관리자에서 JSON 파일을 업로드하십시오. 템플릿이 Elementor 패널에 새 위젯으로 나타납니다. 아무 페이지로 드래그하고 콘텐츠 및 스타일 탭에서 모든 것을 편집하십시오.
- 다운로드 및 압축 해제. 각 zip에는 위젯 JSON, 미리보기 이미지, (디자인에서 아트워크를 사용하는 경우) 데모 이미지와 각 이미지를 해당 필드에 매핑하는 README가 들어 있습니다.
- JSON 가져오기. 워드프레스 관리자 → 마스터 애드온 → 위젯 빌더 → 위젯 가져오기 Upload the
widget-*.json파일. 그만큼 위젯 빌더 master Addons Pro와 함께 배송; JSON 다운로드 자체는 무료입니다. - 페이지에 드롭하세요. Elementor 를 열고 위젯 이름을 검색한 다음 끌어옵니다. 스크린샷에 보이는 전체 데모 콘텐츠로 렌더링됩니다.
- 당신의 것으로 만드세요. 모든 텍스트는 필드이고, 모든 버튼에는 링크 컨트롤이 있으며, 모든 기본 색상은 스타일 탭의 선택기입니다. 사진을 사용하는 템플릿에는 빈 이미지 슬롯이 있습니다; 자신의 또는 번들 데모 아트를 업로드하세요.
데모 이미지에 대한 하나의 헤드 업: 그들은 SVG 파일이고,워드 프레스는 상자에서 SVG 업로드를 차단합니다. 업로드하기 전에 PNG/WebP 로 변환하거나 SVG 활성화 플러그인을 설치하십시오. 위젯은 이미지없이도 잘 렌더링됩니다 — 이미지 슬롯은 당신이 그들을 채울 때까지 자신을 숨 깁니다.
페이지 템플릿이 아닌 위젯인 이유
다운로드하는 대부분의 elementor 섹션은 저장된 페이지 조각입니다. 편집하려고 할 때까지 올바르게 보입니다. 그런 다음 중첩된 열을 클릭하여 가격 텍스트를 보관하는 내부 컨테이너를 찾고 색상을 변경하는 순간 9 곳에서 변경합니다.
여기에 모든 템플릿은 라벨이 붙은 컨트롤 뒤에 내용이있는 단일 위젯입니다. 실용적인 승리:
- 반복되는 것을 위한 반복기. 가격 계획,FAQ 항목,평가, 팀원,로고 — 모든 리피터 필드. 네 번째 계획 또는 열 번째 FAQ 를 추가하고 레이아웃,애니메이션 스태거 및 번호 매기기가 스스로 조정됩니다. FAQ 탭 템플릿은 입력하는 모든 범주에서 범주 탭을 다시 작성하기도 합니다.
- 4~6개의 기본 색상이 전체 섹션을 테마로 다시 지정합니다. 보조 색조, 테두리, 광선 및 그림자는 CSS가 있는 기본 선택기에서 파생됩니다
color-mix(). “악센트”를 한 번 변경하면 총알 점,링크 밑줄,초점 링 및 호버 상태가 모두 따라옵니다. - 애니메이션은 내부로 배송됩니다. 카운트업 카운터, 평가 캐러셀, 청구 토글, 아코디언 물리학, 로고 천막: 모두 존중하는 범위가 지정된 JavaScript입니다
prefers-reduced-motion그리고 페이지의 다른 위젯과 싸우지 않을 것입니다. 사용자 정의 CSS 에서 다른 방식으로 수행 할 작업을 수행하는 698 레이블이 지정된 컨트롤 팩 전체에서. - 로렘 입섬이 아닌 실제 사본. 각 템플릿은 스크린샷에서 가상의 브랜드 콘텐츠로 가져오므로 자리 표시자 수프를 쳐다보는 것이 아니라 문장을 편집하는 것입니다.
기능 및 서비스 섹션 템플릿
모든 랜딩 페이지의 주력입니다. 네 가지 스타일,왜냐하면 “기능”은 SaaS 그리드에 대해 태양광 설치업체의 프로세스 설명자와는 다른 의미를 갖기 때문입니다.
1. 아이콘 카드 격자
커서 팔로우 글로우를 중심으로 구축된 6 개의 기능 카드로 구성된 어두운 3 열 그리드: 마우스를 움직이면 부드러운 방사형 조명이 카드 전체를 따라갑니다. 카드는 리피터입니다: 아이콘 (SVG 붙여넣기), 제목,텍스트 및 카드당 선택적인 화살표 링크. 가상의 분석 SaaS 의 6 개의 카드가 미리 채워져 있으며,엇갈린 입구는 결국 어떤 수의 카드에 애니메이션을 적용합니다.
2. 이미지 행을 교대로
헤더 아래에 카운트업 통계 스트립이 있는 클래식 이미지 왼쪽/이미지 오른쪽 행입니다. 교대는 자동입니다. 행은 위치에 따라 측면을 뒤집으므로 리피터를 통해 네 번째 또는 다섯 번째 행을 추가하면 지그재그가 그대로 유지됩니다. 각 행에는 키커 배지,체크 글머리 기호 3 개 및 자체 링크 컨트롤이 있습니다. 부기-앱 행 3 개에 대한 데모 아트가 zip 에 있습니다.
3. 번호가 매겨진 프로세스 목록
수직 트랙에 번호가 매겨진 다섯 단계,스크롤할 때 스스로 그리는 진행선과 해당 단계가 뷰포트에 들어갈 때 점들이 켜집니다. 단계는 리피터 (숫자,제목, 칩 라벨,텍스트) 에 살고 진행률 수학은 런타임에 단계 수를 읽습니다. 세 단계 또는 여덟 단계로,선은 여전히 마지막 점에 착지합니다. 강조 표시된 통계가 구워진 전환 가능한 CTA 바닥글이 있습니다.
번호가 매겨진 프로세스 템플릿을 다운로드하세요(.zip)
4. 이미지 진열장 카드
커서를 따라가는 3D 기울기가 있는 3 개의 큰 이미지 카드와 헤더와 그리드 사이에 스크롤 키워드 천막이 있습니다. 각 티커 키워드를 한 번 추가합니다. 원활한 루프 복제는 JavaScript 에서 발생하므로 천막에는 결코 솔기가 표시되지 않습니다. 카드는 각각 이미지,배지, 제목,텍스트 및 링크를 가져옵니다; 3 개의 팟캐스트 도구 데모 일러스트레이션은 zip 으로 제공됩니다.
이미지 쇼케이스 카드 템플릿을 다운로드하세요(.zip)
회사 소개 섹션 템플릿
“당신은 누구이며 왜 내가 신경 써야 하는가” 섹션의 세 가지 레이아웃. 당신이 가진 것을 골라라: 좋은 사진,좋은 숫자,또는 좋은 임무.
5.이야기가 남겨진 이미지
폴라로이드 스타일의 호버 틸트와 함께 왼쪽에있는 사진,오른쪽에 스토리 카피,세 카운트 업 통계 및 서명 블록. 통계 중계기는 접두사,소수 및 수천 개의 쉼표를 처리합니다. 데모는 코드를 건드리지 않고도 최대 2,400 개의 도매 파트너를 계산합니다. SVG 로 포함 된 베이커리 데모 장면.
6. 뜨 기장을 가진 이미지 권리
거울 레이아웃: 텍스트 왼쪽, 이미지 오른쪽, 뷰로 스크롤할 때 카운트업되는 부동 “27 년” 배지 포함 자격 증명 체크리스트는 리피터이고 배지는 전환 가능하며 두 배지 라인 모두 편집이 가능합니다. 비즈니스, 프로젝트 출하, 최상의 번호가 무엇이든 수년 동안 사용하십시오.
7.사명과 가치
사진이 필요하지 않습니다. 악센트 색상의 문구가있는 큰 사명 선언문,그리고 호버에서 약간 회전하는 선 아이콘이있는 4 개의 값 카드. 카드는 키워드 기반 아이콘 필드 (파도,커뮤니티, 태양,하트) 가있는 리피터 아이콘입니다. 아이콘은 악센트 색상을 상속하는 CSS 마스크이므로 충돌하는 대신 팔레트로 다시 색칠합니다.
통계 및 카운터 밴드 템플릿
짧은 섹션, 불균형한 영향 둘 다 뷰로 스크롤할 때 한 번 실행되는 카운트업 애니메이션을 실행하며, 둘 다 모션 감소가 활성화된 방문자에 대해 최종 값을 즉시 표시합니다.
8. 빛 stats 밴드
종이처럼 하얀색의 세리프 숫자로 된 네 개의 카운터,숫자가 올라갈 때 그리는 칸막이 선. 열 슬라이더는 네 개가 아닌 세 개 또는 다섯 개의 통계를 실행하면 데스크톱 그리드를 재구성하고,단일 지속 시간 컨트롤은 모든 것이 얼마나 빨리 중요한지 조정합니다.
9. 어두운 stats 밴드
고대비 버전: 거의 검은색 배경,라임 액센트,광채 펄스가 있는 각 카운터 위의 아이콘. 아이콘은 카드 (볼트,터빈, 홈,쉴드) 당 자동으로 순환하며 각 통계는 자체 카운트업 기간을 설정하므로 숫자가 한 번에 모두 표시되지 않고 순서대로 표시됩니다. 헤드라인은 세 개의 필드로 분할되므로 액센트 단어는 원하는 곳에 위치합니다.
사용후기 섹션 템플릿
전체 회전목마에서 하나의 파괴적인 인용구까지 증거를 보여주는 네 가지 방법. 이 그룹에서 한 가지만 가져간다면: 회전목마의 점은 슬라이드 카운트에서 생성됩니다. 왜냐하면 우리 모두는 네 개의 점과 여섯 개의 슬라이드가 있는 슬라이더를 보았기 때문입니다.
10. 사용후기 회전목마
적절한 슬라이더: 화살표 버튼,클릭 가능한 점,키보드 탐색 및 자동 높이로 짧은 따옴표가 키가 큰 빈 카드를 남기지 않습니다. 슬라이드는 리피터 (인용문,이름, 역할,아바타) 이며 점과 “총의 N”라벨은 추가 한 많은 것에서 스스로를 재건합니다. 4 개의 데모 아바타는 우편으로 배송됩니다.
11. 석조 그리드
엇갈린 노출이 있는 CSS 열 석조 구조의 6개 카드. 각 중계기 행에는 따옴표(키가 큰 카드의 경우 선택 사항인 두 번째 단락 포함), 별 1~5개 등급, 아바타 서클의 이니셜 및 카드에 악센트 처리를 제공하는 “기능이 있는” 토글이 있습니다. 별은 등급 값에서 렌더링되므로 별 4개 리뷰에는 하드코딩된 것이 아닌 4개의 채워진 별이 표시됩니다.
12. 단 하나 큰 따옴표
하나의 인용문,거대한 세리프 타입,마스크 애니메이션으로 한 줄씩 공개했습니다. 인용문을 한 단락으로 붙여 넣습니다; JavaScript 는 균형 잡힌 선으로 분할하고 공개를 곱하므로 15 단어 인용문과 40 단어 인용문은 모두 올바르게 애니메이션을 적용합니다. 아래 (방,등급, 연도) 의 작은 메타 스트립은 완전히 비울 수있는 중계기입니다.
13. 요약이 포함된 등급 카드
리뷰 수집기 모양: 큰 카운트 업 점수,애니메이션 배포 막대 (별 5 개: 84%, 4 개: 11%...), 그리고 카드 당 배지 색상으로 플랫폼에 의해 태그 된 4 개의 리뷰 카드. 분수 등급 페인트 부분 별. 이 하나는 평가 그룹의 가장 많은 컨트롤을 가지고,24, 점수의 밑에 캡션에 막대 백분율에서 모든 것이 편집 할 수 있기 때문에.
가격표 섹션 템플릿
상업 사이트에서 가장 높은 지분을 가진 섹션이므로 아무도 맞지 않는 하나의 “범용”테이블 대신 4 가지 변형을 만들었습니다. 네 가지 모두 카운트 업 애니메이션을 통해 가격을 책정하고 모든 버튼에 전체 링크 컨트롤을 적용합니다.
14. 클래식 쓰리 티어
세 장의 카드,엇갈린 입구,스크롤에 카운트 업되는 가격. 계획은 중계기입니다. 기능은 텍스트 영역의 기능 당 한 줄로 들어가므로 계획은 빈 슬롯없이 5 개 또는 9 개의 기능을 가질 수 있습니다. 계획 당 “인기있는”토글은 카드의 버튼을 고스트에서 솔리드 액센트로 전환합니다.
15.강조된 계획
같은 3 열 뼈,하지만 인기있는 계획은 물리적으로 글로우 펄스와 리본으로 이웃 위에 상승. 하이라이트는 각 중계기 행에서 토글을 따르므로 다음 분기에 다른 계획을 추진하는 것은 하나의 스위치이지 스타일 변경이 아닙니다. 바닥 글 통계 행 (가동 시간,데이터 센터,지원) 을 끌 수 있습니다.
16. 비교 기능 목록
실제 기능 매트릭스: 세 개의 계획 열,예/아니오/사용자 지정 값이 있는 기능 행 (“5 사용자”, “무제한”), 부드러운 높이 애니메이션으로 여섯 개의 행을 더 드러내는 확장 가능한 블록을 입력합니다 yes 또는 no 셀에서 그리고 그것은 체크 또는 십자가로 렌더링; 다른 것을 입력 하 고 텍스트로 인쇄. 어떤 계획 “최고의 값” 열 하이라이트를 얻을 드롭다운입니다. 38 컨트롤에서 그것은 팩에서 가장 깊은 템플릿.
17. 월간 / 연간 토글
SaaS 표준. 접근 가능한 스위치는 약간의 가격 반전 애니메이션으로 월간 가격과 연간 가격 사이의 모든 카드를 뒤집습니다; 각 플랜은 두 가격 모두와 리피터 행의 “청구된” 메모를 모두 포함합니다. “20% 저장” 배지 텍스트는 필드입니다. — 수학 변경, 배지 변경.
팀 섹션 템플릿
사람들은 사람들로부터 구매합니다. 얼마나 많은 개성을 보여주고 싶은지에 따라 세 가지 레이아웃. 세 가지 모두 회원 당 리피터 필드를 통해 사진을 찍고 슬롯이 비어있는 동안 우아하게 저하됩니다.
18. 사진 카드 격자
확대 및 테두리 스윕 호버가 있는 세로 카드 4 장. 이름,역할, 멤버당 한 줄짜리 약력; 입구 스태거는 모든 멤버 수에 대해 다시 계산됩니다. 실제 헤드샷을 수집하는 동안 자리 표시자가 필요한 경우 4 개의 데모 세로 일러스트레이션이 zip 으로 제공됩니다.
19. 호버 공개 바이오스
마우스뿐만 아니라 키보드와 휴대폰에서도 작동하도록 마우스 오버, 초점 또는 탭 시 바이오 패널 위로 슬라이드되는 인물 사진입니다. 각 구성원 행에는 LinkedIn, Instagram 및 이메일 링크 컨트롤이 있으며, 팀이 원하지 않는 경우 전체 소셜 행을 끌 수 있습니다.
20. 팀 슬라이더
한 번에 한 명의 회원: 큰 사진,역할 태그,더 완전한 약력,그리고 점과 같은 실제 회원 수에서 다시 작성하는 “01 / 05” 카운터. 화살표 키가 작동합니다. 각 사람이 명함보다 더 많은 것을받을 자격이있는 소규모 팀에 좋습니다.
FAQ 섹션 템플릿
이 팩에서 가장 큰 검색 클러스터와 최종 CTA 전에 이의를 없애는 섹션. 네 가지 빌드. 그들 모두는 질문 텍스트를 실제 제목으로 렌더링하고 ARIA 배선을 그대로 유지하므로 다른 어느 곳보다 FAQ 섹션에서 더 중요합니다.
21. 아코디언
매끄러운 높이 애니메이션과 회전 플러스 아이콘과 단일 오픈 아코디언. 질문과 답변은 리피터입니다; 첫 번째 항목이 열리기 시작하는지 여부는 토글입니다. 바닥 글 라인 (“여전히 붙어? 우리에게 쓰기”) 은 항상 하드 코딩 된 다른 잊고 끝 때문에,자신의 링크와 이메일 필드가 있습니다.
22.두칼럼 질의응답
클릭하지 마세요. 6 개의 답은 모두 엇갈린 노출이 있는 번호가 매겨진 2 열 격자에서 계속 보입니다. 01–06 번호 매기기는 CSS 카운터이므로 일곱 번째를 추가하면 항목 번호가 다시 매겨집니다. 답이 짧고 방문자가 실제로 읽는 것이 좋을 때 아코디언보다 낫습니다.
23. 카테고리 탭
슬라이딩 알약 탭 막대가있는 4 개의 카테고리에 걸쳐 12 개의 질문. 여기에 트릭이 있습니다: 탭을 전혀 관리하지 않습니다. 리피터의 모든 질문에는 카테고리 필드가 있으며 위젯은 찾은 고유 한 카테고리에서 탭 버튼을 만듭니다. 세 가지 질문에 카테고리 이름을 바꾸고 탭 이름을 바꿉니다. 전체 화살표 키 탭 탐색이 포함되어 있습니다.
24. 지원 카드를 가진 FAQ
왼쪽의 아코디언 (이번에는 멀티 오픈), 그림이 있는 오른쪽의 끈적한 지원 카드,연락처 채널,아바타 슬롯이 3 개 있는 팀 노트.연락처 채널은 행당 채팅/이메일/전화/시계 아이콘 선택기가 있는 리피터 카드 끈적한 오프셋은 슬라이더입니다.사이트에 뚱뚱한 고정 헤더가 있을 때를 위한 것입니다.
콜투액션 밴드 템플릿
방문객들이 바닥글 앞에서 마지막으로 보는 것. 세 가지 에너지 레벨: 시끄럽고,제품 주도적이며,조용합니다.
25. 대담한 그라데이션
포인터 쪽으로 표류하는 부동 얼룩이 있는 애니메이션 3색 그라데이션 워시입니다. 세 가지 그라데이션 색상은 별도의 선택기이므로 전체 분위기를 보라색에서 브랜드 오렌지색으로 전환하려면 세 번의 클릭이 필요합니다. 기본 및 고스트 버튼에는 각각 전체 링크 컨트롤이 있습니다; 미니멀리스트의 경우 얼룩이 꺼집니다(모션 감소 방문자의 경우 스스로 꺼집니다).
굵은 그라데이션 CTA 템플릿을 다운로드하세요(.zip)
제품 이미지로 분할 26
복사 및 체크리스트 왼쪽, 제품 샷 부동 사양 배지 (용량, 충전 시간, 무게) 와 오른쪽 그러나 많은 당신이 추가 위치를 변경합니다. 별 등급은 데모에서 2,318 리뷰에서 4.8 까지 계산하고, 두 숫자는 필드입니다. 실제 제품을 위해 제작되었지만 자랑 할만한 사양이있는 모든 것을 위해 작동합니다.
27. 최소한도 중심에 두는
크림 배경, 하나의 헤드 라인, 하나의 버튼, 위와 아래의 얇은 규칙. 헤드 라인은 단어별로 드러내고, 분할이 런타임에 발생하기 때문에, 당신의 다시 쓰여진 헤드 라인은 정확히 동일하게 애니메이션됩니다. 페이지의 다른 모든 섹션이 소리 지르면, 이것은 음성을 낮추어 거래를 종료합니다.
문의 양식 섹션 템플릿
작업 프런트 엔드 동작 세 연락처 레이아웃: 유효성 검사, 초점 상태, 인라인 성공 메시지. 공정한 경고, 각 위젯의 필드 설명에도 명백하게 명시된: 이러한 양식은 프리젠 테이션: 그들은 유효성을 검사하고 확인하지만 이메일을 보내지 않습니다. 실제 전달을 위해 선택한 양식 플러그인에 마크 업을 유선, 또는 나중에 실제 양식을 얻을 것이다 연락처 페이지 프로토 타입을 가장 빠른 방법으로 그들을 사용합니다.
28. 연락처 정보가 포함된 양식
이름,이메일, 회사,예산 드롭다운 및 메시지 필드가 있는 양식 옆에 있는 정보 열 (이메일,전화, 사무실,사이클링 아이콘이 있는 중계기). 예산 범위는 자체 중계기입니다. 모든 레이블과 자리 표시자는 편집할 수 있으며 이는 사이트를 번역하는 날에 중요합니다.
29.지도로 양식
그림이 표시된 SVG 지도 옆에 주제 선택 칩이 있는 양식: 애니메이션 점선 경로, 펄스 핀, 공원 및 운하 세부 정보. Google 지도 삽입, API 키, 쿠키 배너 관련 없음. 지도의 거리 라벨은 텍스트 필드이므로 실제 거리를 표시하세요.
30. 중심 카드
커서를 따라가는 스포트라이트와 깜박이는 “영업일 기준 1 일 이내에 응답” 상태 배지가 있는 어두운 배경의 중앙에 있는 카드 1 장. 배지 텍스트는 필드이며 전체 배지는 전환 가능합니다. 3 개 중 가장 작은 설치 공간 전용 연락처 페이지 없이 연락처 옵션이 필요한 페이지 끝에 놓습니다.
로고 스트립 템플릿
가장 컴팩트 한 형태의 사회적 증거. 두 템플릿 모두 리피터를 통해 로고 업로드를 수행하며 업로드 할 때까지 각 슬롯은 브랜드 이름을 스타일이 지정된 텍스트 워드 마크로 렌더링하므로 설정 중간에 섹션이 깨진 것처럼 보이지 않습니다.
31. 정체되는 회색눈금 격자
그리드에 8 개의 로고,호버링될 때까지 그레이스케일,아래에 카운트업 통계가 있습니다 (“1,400+ 팀에 대한 전원 보고”). 열은 슬라이더이고 통계 행은 전환 가능하며 그레이스케일에서 색상으로 호버링하면 업로드하는 PNG 또는 SVG 로고에서 작동합니다.
32. 스크롤 천막
호버링 시 일시 중지되고 모션 감소 방문자를 위해 중지되는 에지 페이드가 있는 무한 천막입니다. 각 로고를 한 번 추가합니다; 원활한 루프 클론은 JavaScript 에서 처리됩니다. 스크롤 속도는 슬라이더입니다; 데모는 28 초 루프를 실행하며,광란이 아닌 자신감 있는 것으로 읽혀집니다.
랜딩 페이지에는 실제로 어떤 섹션이 필요합니까?
전환율이 높은 랜딩 페이지는 상당히 안정적인 스크롤 순서를 따릅니다: 영웅, 로고 스트립, 기능, 약 또는 사회적 증명, 가격, FAQ, 최종 CTA 및 연락처. 모든 페이지에 모든 것이 필요한 것은 아니지만 각 섹션이 이전 섹션에서 제기한 이의에 답변하기 때문에 순서가 중요합니다.
SaaS, 에이전시 및 지역 비즈니스 페이지에서 볼 수 있는 패턴: 영웅이 주장을 하고, 로고 스트립에 “다른 사람들이 믿었다”라고 적혀 있습니다. 기능이 설명하고, 사용후기가 이를 증명하고, 가격이 이를 정량화하고, FAQ가 “예, 하지만” 순간을 처리하고, CTA 밴드가 지금까지 아직 결정하지 못한 채 스크롤한 모든 사람을 포착합니다. 이것이 바로 이 컬렉션이 따르는 스크롤 순서입니다. 이 게시물과 함께 전체 페이지를 조립할 수 있습니다 영웅 팩또는 전체부터 시작하세요 템플릿 키트 그리고 개별 섹션을 교환하세요.
자주 묻는 질문
이 Elementor 섹션 템플릿은 정말 무료인가요?
30+ 템플릿 파일은 상업 프로젝트가 포함된 모든 사이트에서 무료로 다운로드하고 사용할 수 있습니다. 가져오기는 Widget Builder 의 일부입니다 마스터 애드온 프로, 그래서 당신은 활성 플러그인이 필요하지만, 템플릿 자체에 대한 비용을 지불하지 않을 것입니다.
Elementor 에서 섹션 템플릿을 어떻게 가져오나요?
마스터 애드온으로 이동 → 위젯 빌더 → 워드 프레스 관리자에 위젯을 가져 와서 zip 에서 JSON 파일을 업로드 한 다음 Elementor 로 모든 페이지를 열고 패널에서 새 위젯을 끌어. 전체 왕복 약 2 분 소요; 그만큼 위의 연습 각 단계를 다룹니다.
가져오기 후에 템플릿을 편집할 수 있나요?
이것이 형식의 요점입니다. 모든 표제,문단, 버튼 라벨,링크, 이미지,기본 색상은 위젯의 콘텐츠 및 스타일 탭에 레이블이 지정된 컨트롤이며,간격 및 모서리 반경에 대한 타이포그래피 컨트롤 및 레이아웃 슬라이더가 있습니다. 반복되는 항목 (계획,FAQ, 사용후기,로고) 은 반복기이므로 마크업을 복제하는 대신 항목을 추가하고 제거합니다.
템플릿은 어떤 워드 프레스 테마와 함께 작동합니까?
예. 각 위젯의 스타일은 자체 래퍼 클래스로 범위가 지정되므로 테마의 섹션 스타일을 상속받지도 않고 스타일을 유출하지도 않습니다. 템플릿은 모바일까지 반응하며 방문자의 감소된 모션 선호도를 존중합니다.
이미지가 SVG 파일로 제공되는 이유는 무엇입니까?
데모 아트워크는 벡터이므로 어떤 크기로든 선명하게 유지됩니다. WordPress 는 기본적으로 SVG 업로드를 차단하므로 업로드하기 전에 번들 아트를 PNG 또는 WebP 로 변환하거나 SVG 지원 플러그인을 설치하십시오. 자신의 사진은 변환없이 모든 이미지 슬롯에서 작동합니다.
