2분 안에 가져올 수 있는 10개의 무료 Elementor 영웅 섹션 템플릿

대부분의 무료 Elementor 영웅 섹션 템플릿은 동일한 문제가 있습니다: JSON 파일을 가져 와서 고정 된 레이아웃을 얻은 다음 개별 제목 위젯,이미지 위젯 및 스페이서를 클릭하여 한 시간을 보내면서 자신의 악센트 색상을 변경하십시오? 그것은 열두 개의 개별 스타일 패널입니다.

스크롤하기 전에: 이 컬렉션은 단지 11 로 성장했다. 최신 하나, 느슨한 끝#11 에 앉아 있는 GPU 파티클 영웅은,우리가 유튜브 영상을 촬영한 후에 만들어졌으니,거기서 찾을 수 없을 겁니다. 넘기지 마세요. 헤드라인 주위를 돌며 방문자의 커서를 피하는 천 개의 입자는 다른 Elementor 라이브러리에서 볼 수 있는 것이 아니며,아래에는 애니메이션 미리보기가 있어 움직이는 모습을 볼 수 있습니다.

우리는 이 10 개의 영웅 구간을 다르게 만들었습니다. 각각은 a 로 가져옵니다 단일 위젯 통해 마스터 애드온 위젯 빌더. Elementor 로 드래그하면 모든 헤드라인,문단, 버튼,링크, 이미지가 콘텐츠 탭의 레이블이 지정된 필드이며 전체 색 구성표는 스타일 탭에 3~6 개의 색상 선택기로 표시됩니다. “Accent Color” 하나를 변경하면 CSS 가 선택한 기본 색상에서 모든 보조 색조를 파생하기 때문에 버튼,호버 상태,광선 및 밑줄이 모두 함께 업데이트됩니다.

이 페이지에서 10 개 모두 무료로 다운로드할 수 있습니다. 각 zip 에는 위젯 파일,스크린샷에서 볼 수 있는 데모 이미지 (업로드 준비 PNG 와 원본 SVG 로서), 각 이미지를 정확한 필드에 매핑하는 README 애니메이션 (시차 산,자체 그리기 차트,궤도 성분 배지) 이 자동으로 따라오며,각각 방문자의 모션 감소 설정을 존중하므로 눈요기와 함께 접근성 문제를 배송하지 않습니다.

스크린 샷은 실제로 애니메이션이 어떻게 보이는지 설명하지 않습니다. 나는 당신이 애니메이션에 대한 적절한 아이디어를 얻을 수 있도록 당신이 영웅 섹션 템플릿을 다운로드 한 후 얻을 것이다 당신을 위해 비디오를 만들었습니다.

그리고 영웅은 단지 첫 번째 화면입니다. 방문자가 스크롤하는 모든 것 - 설명하는 기능 그리드,설득하는 평가,닫히는 가격표,마지막 이의를 죽이는 FAQ - 여전히 구축이 필요한 모든 것을 동반자 컬렉션으로 포장했습니다 30+ 무료 Elementor 섹션 템플릿는, 같은 위젯 기반 방법을 구축: 영웅을 여기에서 선택하고, 거기에서 페이지의 나머지 부분을 스택, 완전한 방문 페이지가 대신 일주일이 오후에 함께 온다.

아래에는 실제 스크린샷이 포함된 10가지 디자인, 각 디자인이 실제로 누구에게 적합한지에 대한 솔직한 메모, 그리고 a 단계별 가져오기 가이드 정확한 워크플로우의 스크린샷 포함.

어떤 영웅들은 정지된 사진보다 모션으로 더 잘 읽습니다. 만약 그것이 여러분이 가고 있는 방향이라면,the 20 Elementor 캐러셀 디자인 커버플로우, 이미지 아코디언, 커튼 와이프, 궤도, 드래그 스크롤 스트립, 자체 캡션 패널과 클릭 유도 문구를 포함하는 Plinth라는 풀 블리드 영웅 슬라이더 등이 여기에 설정된 동반자입니다.

그들은 정확하게 아래의 영웅처럼 가져: 하나의 JSON 파일,위젯 빌더,다음 레이블이 필드와 위젯. 20 무료 플러그인에서 실행의 여덟과 열두 당신이 선택하기 전에 알 가치가있는 하나의 차이입니다 프로가 필요합니다. 모든 디자인은 라이브 데모를 가지고 있으므로,당신은 스크린 샷에서 추측하는 대신 십초 동안 모션 스타일을 볼 수 있습니다.

이 컬렉션에 무엇이

• 1. 펄스보드 — SaaS / 분석 제품
• 2. 알펜루트 — 여행 & 모험
• 3. Ember & Oak — 커피숍 / 레스토랑
• 4. 아틀리에 노르 — 패션 & 전자 상거래
• 5. Offbeat 스튜디오 — 크리에이티브 에이전시
• 6. Forge 운동 경기 — 체육관 & 적당
• 7. Wiggly 마음 — 아이 앱 & 교육
• 8. 스튜디오 자오선 — 건축 및 인테리어
• 9. Lowtone — 이벤트 & 음악
• 10. Måne — 뷰티 & 스킨케어
• 11. 느슨한 끝 – 조 드롭이 필요한 포트폴리오,스튜디오 및 시작 페이지의 경우
• Elementor 로 영웅 섹션을 가져오는 방법 (단계별)
• FAQ

왜 이들은 평범한 섹션 템플릿이 아닌가

쇼케이스 전에 빠른 구별, 그것은 당신이 그들을 사용하는 방법을 변경하기 때문에.

일반 Elementor 섹션 템플릿은 스톡 위젯을 저장한 배열입니다. 완성된 것처럼 보이지만 구조적으로는 수십 개의 느슨한 부품입니다. 이 10 명의 영웅은 사용자 정의 위젯 위젯 빌더로 빌드: Elementor 컨트롤 뒤에 패키지된 HTML,CSS, JavaScript. 세 가지 실용적인 결과:

• 편집이 더 빠르다. 음악 축제 영웅은 24 필드 (날짜,위치, 자신의 링크가있는 세 개의 라인업 행,두 개의 버튼,색상) 가 있습니다. 중첩 된 컨테이너 트리를 통해 사냥하는 대신 하나의 패널에서 편집합니다.
• 애니메이션은 살아남는다. 자바스크립트는 위젯 내부에 배송됩니다: 마그네틱 버튼, 카운트업 통계, 마우스 시차 각 위젯이 한 번 로드하는 Google 글꼴을 제외하고 추가 플러그인, CDN 호출이 없습니다.
• 아무것도 새지 않습니다. 모든 스타일시트는 자체 래퍼 클래스로 범위가 지정되고 모든 애니메이션 이름 앞에 접두사가 붙기 때문에 같은 페이지에 있는 두 영웅이 서로 싸우거나 테마 스타일과 싸우지 않을 것입니다. 우리는 그 하나를 어렵게 배웠습니다.

당신은 필요합니다 마스터 애드온 플러그인 elementor 와 함께 설치된 PRO. Widget Builder 와 가져오기 기능은 무료 버전에 포함되어 있으며,이는 30,000+ 사이트에서 이미 실행하고 있는 방식입니다.

1. 펄스보드 — SaaS 및 분석 제품용

고전적인 분할 영웅,왼쪽에 복사하고 오른쪽에 제품,하지만 방문자를 중지 세 가지 세부 사항이 있습니다. 수익 차트 그 자체를 그립니다 선을 따라 이동하는 펄스 점으로 부하 시. 두 개의 통계 카드가 느린 밥의 대시보드 위로 떠 있습니다. 그리고 전체 시각적 요소가 커서 쪽으로 몇도 기울어져 평면 모형이 개체로 읽혀집니다.

아래에 있는 소셜 증명 행은 숫자까지 계산합니다 (기본값: 4,700 팀). 패널에 일반 숫자를 입력하면 애니메이션이 나머지를 처리합니다. 이것은 제품에 표시할 가치가 있는 화면이 있는지 선택할 레이아웃입니다: 분석 도구,CRM, 대시보드,예약 시스템. 제품이 스크린샷에서 잘 데모되지 않으면 대신 Offbeat (#5) 를 보십시오. 이 레이아웃은 오른쪽 이미지에서 살거나 죽기 때문입니다.

당신은 편집할 수 있습니다: 4 부 헤드라인 (밑줄 친 악센트 단어는 자체 필드), 배지 텍스트, 단락, 전체 링크 컨트롤이 있는 버튼 2 개, 카운트업 번호, 증명 텍스트, 이미지 3 개, 색상 6 개.

2. 알펜루트 — 여행,투어, 아웃도어 브랜드용

세 개의 개별 이미지 레이어로 구축된 전체 화면의 산 파노라마. 마우스를 움직이면 레이어가 다른 속도로 이동합니다. 위에 텍스트가 있는 평면 사진이 아니라 실제 깊이입니다. 구름은 55 초 및 90 초 루프를 가로질러 표류하며 오른쪽의 수직 고도 티커는 페이지가 로드될 때 0 에서 2,847m 까지 계산됩니다. 앞쪽 능선에 깜박이는 헤드램프가 있는 작은 등산객도 있습니다. 등산객이 필요한 사람은 아무도 없습니다. 등산객은 모두 기억합니다.

풍경은 세 개의 이미지 필드에서 나오기 때문에 산을 자신의 레이어드 아트워크 (사구, 해안선, 도시 스카이라인) 로 바꾸고 시차를 유지할 수 있습니다. 사실 행 (27 개 경로 / 최대 8 명의 등산객 / 19 년) 은 편집 가능한 여섯 개의 필드이며, 이 영웅이 신뢰를 얻는 곳입니다: 형용사 대신 특정 숫자. 가장 적합: 트레킹 회사, 여행사, 국립 공원 사이트, 제품이 아닌 장소를 판매하는 모든 브랜드.

당신은 편집할 수 있습니다: 2 줄 헤드라인, 눈썹, 단락, 2 버튼 + 링크, 고도 번호 및 라벨, 3 사실 쌍, 4 풍경 이미지, 4 색상 (하늘 그라데이션 전체가 하나의 기본 색상에서 다시 색조).

3. Ember & Oak — 커피숍,카페, 레스토랑용

어두운 에스프레소 배경,이탤릭체 앰버 액센트 단어가 있는 세리프 헤드라인,그리고 시그니처 피스: 컵에서 증기가 올라오는 동안 하향식 라떼 사진을 중심으로 천천히 회전하는 “SMALL BATCH · ROASTED EVERY THURSDAY · SINGLE ORIGIN”이라고 적힌 텍스트 링 커피백이 모서리에 기대어 있고,호버링하면 곧게 펴집니다. 하단에는 오리진 이름 천막 (Yirgacheffe,Huila, Sidra...) 이 루프를 스크롤하고 호버링에서 일시 중지됩니다.

반지 텍스트는 하나의 편집 가능한 필드이므로 베이커리는 “SOURDOUGH · BAKED AT 5AM · NO SHORTCUTS”라고 쓰고 전체 성격이 이전됩니다. 천막과 동일: 하나의 필드,내부적으로 두 번 인쇄되어 루프가 솔기를 표시하지 않습니다. 공예가 피치 인 모든 식품 사업에서 작동합니다 — 로스터리,베이커리, 양조장,농장에서 식탁까지 레스토랑.

당신은 편집할 수 있습니다: 악센트 단어, 단락, 가격 노트, 2 버튼 + 링크, 링 텍스트, 천막 텍스트, 2 이미지, 5 색상으로 3 부분 헤드 라인.

4. Atelier Norr — 패션 라벨 및 프리미엄 전자 상거래용

세트에서 가장 조용한 디자인,그리고 가장 사설. 두 개의 대형 단어 (기본적으로 QUIET / TAILORING) 는 아치형 인물 사진 프레임에 걸쳐 있으며,각 단어는로드에 잘린 가장자리에서 닦아냅니다. 초상화를 맴돌면 아래의 캡션이 “01 / 02 — The Longline Coat”에서 “02 / 02 — The Drape Dress”로 전환되는 동안 두 번째 모양으로 크로스 페이드됩니다. 그 두 이미지 호버 스왑은 미니어처의 전체 위젯입니다: 절제되어 있지만 살아 있습니다.

디자인의 힘은 팔레트가 아닌 타이포그래피와 네거티브 공간이기 때문에 관리해야 할 세 가지 색상 (캔버스,잉크, 세이지 액센트) 만 있습니다. 브랜드 사진을 잘 찍고 사이트가 룩북처럼 느껴지기를 원한다면 이것이 바로 패션,보석, 도자기,가구 접힌 부분 위에 다섯 가지 가치 제안을 벼려야한다면,당신과 싸울 것이고,그렇게해야합니다.

당신은 편집할 수 있습니다: 두 헤드라인 단어, 세로 시즌 라벨, 단락, 버튼 + 링크, 호버 힌트, 2개의 캡션이 포함된 2개의 룩 이미지, 바닥글 스트립, 3가지 색상.

5. 오프비트 스튜디오 — 크리에이티브 에이전시 및 스튜디오용

오프 화이트에 코발트,산호, 레몬 — 바우 하우스 포스터 에너지. 헤드 라인은로드 후 반 초 노란색 스 와이프 밑줄을 얻을 강조 악센트 단어와 대문자로 외친다. 그 아래,세 포트폴리오 타일 테이블에 인쇄처럼 약간 회전 앉아; 각 하나는 똑바로,리프팅, 호버에 3D 로 커서를 향해 기울어. “Q4 를위한 예약”스티커는 콜라주 위에 게으르게 회전.

순환 콜투액션은 사람들이 가지고 노는 조각입니다. 그것은 마그네틱: 그것은 그것의 반경 안쪽에 당신의 커서를 따르고 당신이 떠날 때 후에 튀어 나옵니다. 모든 도와에는 그것의 자신의 연결 분야가 있습니다,그래서 콜라주는 영웅에서 똑바로 누를 수 있는 3 개의 사례 연구를 가진 소형 포트홀리로 두배로 합니다. 기관,디자이너, 사진가,누구든지 누구의 일을 이다 피치.

당신은 편집할 수 있습니다: 3 서비스 태그, 키커, 5 부분 헤드 라인 (별도의 악센트 단어), 단락, 자기 버튼 + 링크, 3 링크가있는 3 타일, 스티커 텍스트, 클라이언트 천막, 5 색상.

6. 체육관 및 피트니스 브랜드에 대한 — 단조 운동

숯과 볼트 그린, 압축 대문자 유형, 그리고 헤드라인 슬램 에서: 각 라인은 정중한 페이드 대신 스큐 앤 스케일 스냅으로 착륙합니다. 라인 2 는 채워지는 대신 윤곽이 그려져 있으며 라인 3 은 볼트 색상을 취합니다. 모든 것 뒤에는 거대한 유령 단어 (FORGE) 가 스크롤에 대해 표류합니다. 선수 이미지는 레이아웃을 대각선으로 자르는 볼트 슬래시와 함께 각진 평행 사변형 프레임에 앉아 있습니다.

통계는 하단을 따라 카운트 업: 14 플랫폼,31 클래스,코치 당 24 회원 최대. 그 마지막 숫자가 무엇을하는지 주목하십시오. “코치 당 회원,최대”는 자랑이 아니라 약속이며,인트로 세션을 채우는 일종의 선입니다. 한 분야에서 체육관 이름으로 유령 단어를 바꾸십시오. 강도 체육관,CrossFit 상자,무술 스튜디오 및 브랜드 강도가있는 코치를 위해 제작되었습니다.

당신은 편집할 수 있습니다: 3 줄 헤드라인, 눈썹, 단락, 유령 단어, 세로 태그, 버튼 2 개 + 링크, 스탯 3 쌍, 선수 이미지, 4 색.

7. Wiggly Minds — 어린이 앱,학교, 교육용

사탕 파스텔,둥근 타입,그리고 세 개의 얼룩 마스코트: 하나는 책을 읽고,하나는 연필을 들고,하나는 별 지팡이를 흔들고. 그들은 스프링으로 팝업,bob 은 부드럽게,그리고 커서가 움직일 때 커서에서 수줍어합니다. 별은 배경에 걸쳐 반짝이고,노란색 squiggle 은 기울어진 악센트 단어 아래에 자신을 끌어 당기고,메인 버튼은 누를 때 젤리처럼 아래로 스퀴즈됩니다. 흰색 파도는 섹션을 닫아 다음에 오는 모든 것으로 흘러 들어갑니다.

중심 레이아웃은 부모 (실제 구매자) 를 명확한 경로로 유지합니다: 연령대 배지,약속, “이 화면이 후회할 시간입니까?”라고 대답하는 한 단락,App Store 등급과의 신뢰 선. 마스코트는 세 개의 이미지 필드로 자신의 캐릭터를 교환하고 바운스,그림자 및 커서 부끄러움 행동이 자동으로 적용됩니다. 학습 앱,탁아소, 키즈 클럽,소아 진료 및 장난감 브랜드의 경우.

당신은 편집할 수 있습니다: 기울어진 악센트 단어, 배지, 단락, 2 버튼 + 링크, 신뢰 라인, 3 마스코트 이미지, 6 색으로 헤드 라인.

8. 스튜디오 자오선 — 건축가,인테리어 디자이너,포트폴리오용

스위스 그리드 분야: 메타 칼럼 (연습,설립, 현장 프로젝트), 벽돌 밑줄이 그어진 단어 하나가있는 얇은 300 무게의 헤드 라인,닦음으로 드러나는 대형 프로젝트 사진. 종이 색 커튼이 미끄러져 나가고 이미지가 1 초 동안 약간의 줌에서 안정됩니다. 사람들이 우리에게 이메일로 보내는 세부 사항은 사이드 바의 평면도입니다 그 자체를 그립니다 — 벽이 먼저, 그 다음 문이 흔들리고, 방 라벨이 페이드 인됩니다. 플러그인이 포함되지 않은 데모 이미지 내부로 배송되는 SVG 애니메이션입니다.

25 개의 편집 가능한 필드는 이것을 열의 가장 풍부한 데이터 영웅으로 만듭니다. 모든 메타 레이블,두 캡션,하단 규칙의 좌표까지. 세 가지 색상 만,그것은 고의적입니다: 흑연,종이, 벽돌은 시스템이며 시스템은이 청중이 존중하는 건축 회사,인테리어 스튜디오,구조 엔지니어 및 구속이 역량을 나타내는 모든 포트폴리오를위한 것입니다.

당신은 편집할 수 있습니다: 5 부 헤드라인, 단락, 버튼 + URL이 포함된 텍스트 링크, 3 메타 쌍, 사진 + 캡션, 평면도 + 캡션, 좌표 규칙, 3 색.

9. 로우톤 — 축제,콘서트, 이벤트 페이지용

여기서 가장 시끄러운 디자인, 그리고 그것은 그것을 적립. 거대한 워드 마크 오렌지-보라색 그라데이션으로 중간 단어를 분할, 빛나는 구체 콘텐츠 뒤에 표류 하 고 커서에서 멀리 기울고, 하단을 따라 전체 폭을 실행 합니다 이퀄라이저: 수십 개의 마디,각각은 자신의 리듬에 따라 애니메이션되므로 스트립이 눈에 띄게 반복되지 않습니다. 막대는 위젯의 자체 스크립트에 의해 생성되고 스타일 탭 색상에서 그라데이션을 끌어와 축제를 다시 색칠하면 사운드가 다시 색칠됩니다.

3 개의 라인업 행 (FRI /SAT /SUN) 은 각각 자신의 레이블,액트 목록 및 링크를 가지고 있으므로 매일 자신의 일정 페이지로 보낼 수 있습니다. 그라데이션은 스타일 탭에서 3 개의 별도 색상 중지를 이동하고 워드 마크,버튼, 글로우 및 이퀄라이저가 모두 따라옵니다. 축제,장소, 클럽 나이트,헤드 라이너가있는 컨퍼런스 및 앨범 출시의 경우.

당신은 편집할 수 있습니다: 분할 워드 마크, 날짜, 위치, 단락, 3 링크, 2 버튼 + 링크, 오브 이미지, 모든 3 그라데이션 중지를 포함 5 색상 3 라인업 행.

10. Måne — 스킨케어,뷰티, 웰니스 브랜드의 경우

안개 낀 라벤더와 복숭아색 안개가 세리프 헤드라인 뒤에 흐릿하게 드리프트되며 이탤릭체 라인인 “the night shift.”는 바깥쪽으로 피어나는 부드러운 그라데이션 밑줄을 얻습니다. 제품 병은 점선 링 중앙에 부드럽게 떠 있으며 3 개의 성분 배지 (2% 레티날,5% 귀리 발효,0% 향) 가 있습니다 궤도 26초 루프에서 역회전하여 전체적으로 똑바로 유지됩니다.

그 배지는 전환 연극입니다. 백분율 주장은 스킨 케어 구매자가 스캔하는 것이며,여기서 말 그대로 제품에 동그라미를 치고 있습니다. 6 개의 배지 값과 라벨은 모두 일반 텍스트 필드입니다. 아래 주장 행 (피부과 전문의 테스트 · 향기 없음 · 재활용 유리) 은 신뢰 이야기를 마무리합니다. 스킨 케어의 경우 보충제,양초, 헤어 케어 — 성분 목록이 논쟁 인 모든 제품.

당신은 편집할 수 있습니다: 2 부 헤드라인, 눈썹, 단락, 2 버튼 + 링크, 3 주장, 3 궤도 배지 쌍, 병 이미지, 4 색상.

11. 느슨한 끝 – 조 드롭이 필요한 포트폴리오,스튜디오 및 시작 페이지의 경우

이것은 새로운 것이고, 우리가 지금까지 위젯 빌더를 통해 추진 한 가장 야심 찬 것입니다: 소용돌이의 눈에 앉아있는 전체 화면 헤드 라인 방문자의 GPU에서 실시간으로 시뮬레이션되는 천 개의 입자. 마우스와 커서 주변의 떼 부분을 이동 한 다음 다시 스프링. 카메라도 조금 표류하므로 필드를 배경 비디오가 아닌 공간으로 읽습니다. 헤드 라인은로드에 문자 스크램블로 디코딩되고 기본 버튼은 느린 빛 스윕을 수행하며 필름 - 곡물 레이어는 어두운 배경이 밴딩되지 않도록합니다.

입자는 하나의 고정된 모양이 아닙니다. 스타일 탭의 드롭다운은 필드를 전환합니다 가닥 (다채로운 소용돌이 필라멘트), 스노우 (느린 흰색 드리프트), 스타즈 (거의 아직 스타필드), 그리고 우주 (긴 딥 스페이스 위스프). 4 개의 슬라이더는 밀도 (100 ~ 2,000 개의 입자), 크기, 깊이, 떼가 마우스에 얼마나 강하게 반응하는지를 제어합니다. 전체 콘텐츠 스택을 왼쪽, 중앙 또는 오른쪽으로 이동시키는 정렬 컨트롤도 있으므로 동일한 위젯이 편집 왼쪽 정렬 영웅 또는 중앙 스플래시 페이지로 작동합니다. 솔직한 한 가지 참고 사항: 3D 엔진은 CDN 에서 로드되며, 첫 번째 방문 후 약 1.2MB 캐시되고, 다른 모든 곳에서 WebGL2 대체 기능이 있는 Chrome 및 Edge 의 WebGPU에서 실행됩니다. 해당 요청이 실패하면 영웅은 일반 스타일 섹션으로 렌더링되며 중단되는 이미지도 없습니다; 전체 장면이 생성됩니다.

당신은 편집할 수 있습니다: 알약 텍스트, 눈썹, 제목, 태그라인, 전체 링크 컨트롤이 있는 버튼 2개, 스크롤 큐, 하단 막대 텍스트 3개, 콘텐츠 정렬(왼쪽/중앙/오른쪽), 입자 유형(가닥/눈/별/우주), 밀도, 크기, 깊이 및 마우스 반응 슬라이더, 5가지 색상.

영웅 섹션 템플릿을 Elementor 로 가져오는 방법 (단계별)

전체 과정은 위젯 당 약 2 분 정도 걸립니다. 당신은 워드 프레스가 필요합니다 엘리멘터 그리고 the 마스터 애드온 PRO 플러그인 활성. 여기에 정확한 워크 플로우, 음악 축제 영웅의 실제 수입에서 스크린 샷.

1 단계: 다운로드 압축 해제

우편번호를 두 번 클릭합니다(여기, music-festival-hero.zip). 그 안에는 세 가지가 있습니다: 위젯 파일 (widget-music-festival.json), ᅡ demo-images 업로드 준비가 완료된 PNG가 있는 폴더 및 a README.txt 어느 밭에 어떤 이미지가 속하는지 알려주는 거죠. an 도 있고 svg-originals 폴더 — FAQ에 대한 자세한 내용이 나와 있습니다.

2 단계: JSON 을 위젯 빌더로 가져옵니다

WordPress 관리자에서 다음으로 이동하세요 마스터 애드온 → 위젯 빌더 그리고 클릭하세요 위젯 가져오기. 드래그하세요 .json 대화 상자에 파일을 넣거나 파일 찾아보기를 클릭합니다. JSON 만 여기에 들어갑니다. 이미지는 나중에 일반 미디어 라이브러리를 통해 제공됩니다.

3 단계: 위젯을 확인하고 저장하십시오

위젯은 모든 것이 이미 유선 상태로 빌더에서 열립니다: 왼쪽의 콘텐츠 섹션,탭 뒤의 HTML/CSS/JS,모든 필드 토큰을 나열하는 Documentation 사이드바. 그 중 어느 것도 건드릴 필요가 없습니다. 그냥 누르십시오 설정 저장. 필드가 코드에 어떻게 연결되는지 궁금하다면,the 위젯 빌더 설정 가이드 토큰 시스템을 설명합니다.

4 단계: 페이지로 드래그하십시오

Elementor 로 아무 페이지나 엽니다. 아래 패널에 새 위젯이 나타납니다 즐겨찾기; 발견하지 못하면 이름을 검색합니다. 컨테이너로 드래그하십시오. 당신을위한 하나의 팁: 컨테이너의 설정 콘텐츠 너비에서 전체 너비까지 그래서 축제나 여행 영웅과 같은 가장자리 간 디자인은 실제로 가장자리에 도달할 수 있습니다.

5 단계: 내용과 링크를 편집합니다

위젯을 클릭하면 콘텐츠 탭에 편집 가능한 모든 조각이 나열되고 디자인이 그룹화되는 방식으로 그룹화됩니다: 콘텐츠 영역,라인업 행,버튼, 이미지. 모든 텍스트 위에 입력하면 미리보기가 실시간으로 업데이트됩니다. 모든 버튼과 연결된 행에는 적절한 Elementor 링크 제어 URL 을 붙여 넣은 다음 기어를 눌러 “새 창에서 열기”와 “nofollow”를 전환합니다.

6 단계: 데모 이미지 업로드

이미지 섹션에서 각 필드를 클릭하고 일치하는 파일을 업로드합니다 demo-images 폴더. README 는 위젯이 여러 가지가있는 경우 그들을 매핑합니다. 데모 PNG 는 2 배 해상도로 내보내 지므로 망막 화면에서 선명하게 유지됩니다. 언제든지 자신의 사진으로 교환하십시오; 필드는 표준 WordPress 미디어 선택기입니다. 그런 다음 출판하다. 완료.

스타일을 변경하려면: 을 엽니다 스타일 탭. 각 영웅은 색상 컨트롤의 소수로서 전체 팔레트를 노출하고,모든 파생 된 그늘 (호버 상태,광선, 테두리,그라디언트) 은 그로부터 다시 계산됩니다. 정확히 포인트 인 이러한 디자인을 반 색칠 할 수 없습니다.

FAQ

모든 10 영웅 섹션은 개인 및 상업 프로젝트에 대 한 무료입니다. 마스터 애드온 v3.x 와 Elementor 에 마스터 애드온 팀에 의해 구축 및 테스트. 질문 또는 위젯 요청? 코멘트에서 우리에 게. 컬렉션은 사람들이 무엇을 요청 기반으로 성장.