Elementor 사용 방법: 초보자를 위한 궁극의 가이드

지난 10년을 돌이켜보면 누구에게도 불쾌감을 주지 않는 웹사이트를 만드는 것은 악몽이었습니다. 웹사이트를 구축하기 위해 사람들은 최소한 프로그래밍 언어, 프레임워크, 데이터베이스 관리 시스템 및 기타 기술적인 것들을 배워야 했습니다. 또한 웹사이트 구축 작업은 코딩 능력이 높은 개발자만 수행할 수 있었습니다.

그런 날은 갔다! WordPress와 Elementor와 같은 인기 있는 페이지 빌더가 출시된 후 웹 사이트를 만드는 것은 의심할 여지 없이 모든 사람의 작업이 되었습니다. 이제 WordPress와 Elementor를 사용하여 웹사이트를 만들 수 있습니다. 코딩 지식이 전혀 없는 변호사, 교사, 학생 또는 기업가입니다.

당신이 필요로 하는 것은 순전한 결단력, 끈기, 그리고 놀라운 것을 창조하려는 정신력뿐입니다. 이제 백만 달러짜리 질문은 – WordPress에서 Elementor를 사용하는 방법을 알고 있습니까?

그런 표정 하지마! 혹시 모르니 지금부터 이 글에서 가이드라인을 찾아 함께 시작해보자. Elementor의 모든 섹션과 설정을 다루는 Elementor에 대한 기사이기 때문입니다. 시작하겠습니다!

목차

• Elementor에 익숙해지기
• Elementor를 WordPress에서 가장 인기 있는 페이지 빌더로 만드는 이유
• Elementor 대시보드 소개
• WordPress에서 Elementor를 사용하는 방법
• Elementor 고급 기능 사용 방법
• WordPress 사이트에서 Elementor Page Builder 사용의 장단점
• 디자인을 향상시키는 최고의 타사 Elementor 애드온
• 무료 튜토리얼: Elementor 및 Happy Addons를 사용하여 전자 상거래 웹사이트 구축
• 엘리멘터 FAQ
• 너에게로

Elementor에 익숙해지기

Elementor에는 수많은 기능이 있습니다. 초보자는 처음에 이러한 사항을 알아야 합니다. 그렇지 않으면 Elementor로 작업하는 것이 어려워 보일 수 있습니다.

Elementor 기본 기능에 대해 알아보기

Elementor를 사용하면 전체 웹사이트에서 특정 방문 페이지에 이르기까지 무엇이든 만들 수 있습니다. 판매 페이지, 판촉 페이지 및 사용자 정의 양식까지 디자인할 수 있습니다. 상상할 수 있다면 이 플랫폼이 설계에 도움이 될 수 있습니다.

이를 가능하게 하기 위해 Elementor는 다음과 같은 기능을 제공합니다.

• 테마 빌더: 테마 빌더를 사용하면 머리글, 바닥글, 제품 페이지 등과 같은 사이트 부분을 에디터에서 바로 디자인할 수 있습니다.

• 팝업 빌더: 사이트 디자인의 나머지 부분과 완전히 일치하고 눈에 띄는 팝업을 만드는 데 도움이 됩니다.

• 80개 이상의 위젯: Elementor의 각 위젯은 고급 디자인 사용자 정의를 제공하므로 디자인을 완료하기 위해 추가 플러그인을 설치할 필요가 없습니다.

• 100개 이상의 사전 디자인된 템플릿 및 300개 이상의 블록: 100개 이상의 전체 페이지 WordPress 템플릿과 300개 이상의 블록 중에서 선택하여 순식간에 디자인을 풍부하게 만들 수 있습니다.

Elementor Free 대 Elementor Pro

Elemento Pro는 더 많은 위젯, 미리 만들어진 블록, 템플릿 및 프리미엄 기능을 제공합니다. 그러나 Elementor 무료 버전만 사용하면 처음부터 웹 사이트를 만들 수 있습니다.

초보자로서 우리는 Elementor를 먼저 무료로 사용한 다음 정말로 필요한 경우 Elementor pro를 사용하는 것이 좋습니다.

Elementor를 WordPress에서 가장 인기 있는 페이지 빌더로 만드는 이유

Elementor는 WordPress용 드래그 앤 드롭 페이지 빌더입니다. 이 플러그인은 비주얼 편집기를 사용하여 아름다운 페이지를 만드는 데 도움이 됩니다. 이 WordPress 플러그인은 단일 플랫폼에서 웹사이트 디자인의 모든 부분을 제어할 수 있는 올인원 솔루션입니다.

기본적으로 Elementor는 기술적 배경이 없는 사람들이 전문가가 만든 웹사이트처럼 아름답게 보이는 웹사이트를 디자인할 수 있도록 해주기 때문에 엄청나게 인기가 있습니다.

Elementor를 사용하여 웹사이트 구축:

• 시간을 절약하고 웹 사이트에서 보다 신속하게 디자인하고 반복할 수 있습니다.
• 타사 위젯을 통합하여 방문자에게 긍정적인 온라인 경험을 제공할 수 있도록 보다 균형 있고 완전한 웹사이트를 만들 수 있습니다.
• 웹 사이트의 복잡성을 줄이고 버그를 제거하며 업데이트 및 테스트와 관련하여 더 쉬운 유지 관리 프로세스를 만드십시오.
• 비용을 절감하고 비용을 단순화하여 프로젝트 가격 범위를 더 잘 파악할 수 있습니다.

WordPress 개발자에게는 여전히 스크립트 최적화, 사용자 정의 속성 및 롤백 버전을 제공하는 최고의 플랫폼입니다.

더 나은 이해를 돕기 위해 최고의 WordPress 페이지 빌더를 비교했습니다. 확인 해보자!

Elementor 대 Divi 대 Beaver Builder – 비교 표

Elementor 외에도 몇 가지 인기 있는 WordPress 페이지 빌더를 사용할 수 있습니다. 이러한 페이지 빌더 중 Divi와 Beaver는 Elementor의 가장 강력한 경쟁자입니다. 그렇기 때문에 Elementor가 페이지 빌더보다 나은지 알아보기 위해 비교 테이블을 만들었습니다.

비교표를 분석한 결과 초보자에게 어떤 페이지 빌더가 더 적합하다고 생각하십니까? 바로 엘리멘터입니다! 이것이 우리가 다른 인기 있는 페이지 빌더보다 Elementor를 선택한 이유입니다. 이제 Elementor 페이지 빌더에 익숙해질 시간입니다.

Elementor 대시보드 소개

Elemnetor 대시보드에 액세스하려면 먼저 WordPress 사이트에 Elementor를 설치해야 합니다. Elementor 설치는 파이만큼 쉽습니다. 아래 단계에 따라 Elementor를 즉시 설치하고 활성화하십시오.

WordPress에 Elementor를 설치하고 활성화하는 방법은 무엇입니까?

• 01단계: WordPress 대시보드 > 플러그인 > 새로 추가 로 이동합니다.

• 02단계: 검색 상자에 "Elementor"를 입력하고 검색 결과에서 Elementor를 찾습니다. 그런 다음 설치 버튼을 클릭합니다.

• 03단계: 마지막으로 활성화 버튼을 클릭하여 Elementor를 활성화하고 사용합니다.

엘리멘터 설정

Elementor 페이지 빌더를 활성화하면 아래 표시된 인터페이스로 이동합니다. 또는 WP 대시보드 > Elementor 로 이동하여 이 인터페이스를 가져옵니다.

설정 :

• 일반: Elementor 설정의 일반 탭에서 사용하려는 게시물 유형을 선택하고 기본 색상 및 글꼴을 비활성화할 수 있습니다.

• 스타일: 기본 일반 글꼴, 태블릿 및 모바일 중단점 설정, 이미지 라이트박스 활성화 확인란이 포함된 옵션을 찾을 수 있습니다.

• 고급: CSS 인쇄 방법을 설정하고, 서버 문제를 해결할 때 로더 방법을 전환하고, SVG 지원을 활성화하는 옵션을 찾을 수 있습니다.

역할 관리자 :

• 다양한 유형의 사용자는 역할에 따라 웹사이트에 대한 액세스 수준이 다를 수 있습니다. Pro 버전이 있는 경우 사용자의 액세스 권한을 콘텐츠로만 제한할 수도 있습니다.

도구:

• 일반: 일반 도구를 사용하면 웹사이트에서 CSS를 재생성하고 필요한 경우 Elementor 라이브러리를 수동으로 동기화할 수 있습니다.

• URL 바꾸기: URL 바꾸기 탭은 이름에서 알 수 있듯이 사이트 주소를 변경한 경우 URL을 바꿀 수 있는 곳입니다.

• 유지 관리 모드: 유지 관리 모드 탭에서는 웹사이트의 유지 관리 모드에 필요한 모든 제어 기능을 사용할 수 있습니다.

• Font Awesome: 1,500개 이상의 놀라운 Font Awesome 5 아이콘에 액세스하고 더 빠른 성능과 디자인 유연성을 즐길 수 있습니다.

엘리멘터 대시보드

• Elementor 대시보드에 액세스하려면 WordPress 대시보드 > 페이지 > 새로 추가 로 이동합니다.

• 그런 다음 페이지 제목을 입력하고 오른쪽 템플릿 드롭다운에서 Elementor Canvas 옵션을 선택합니다.

• 마지막으로 " Elementor로 편집 " 버튼을 클릭하고 가장 강력한 페이지 빌더로 작업을 시작하십시오.

• 그러나 Elementor로 흥미진진한 페이지를 편집하려면 모든 페이지> 페이지 위로 마우스 이동 으로 이동하십시오.

• 그런 다음 " Elementor로 편집 " 버튼이 나타납니다. 이제 버튼을 클릭하고 페이지 편집을 시작하십시오.

여기있어. 대망의 Elementor 대시보드 . 그 속으로 들어가 보자.

드래그 앤 드롭 요소로 페이지를 디자인하고 사이트의 실시간 미리보기를 볼 수 있는 인터페이스입니다.

• 왼쪽 상단에는 일부 기본 및 전역 설정에 대한 햄버거 아이콘이 있습니다.

• 오른쪽 상단에는 메인 패널로 돌아가기 위한 다이얼 버튼이 있습니다.

• 그 후, 목록 및 필수 위젯을 빠르게 찾을 수 있는 검색 상자가 나타납니다.

• 왼쪽 패널에서 모든 유용한 모듈을 찾을 수 있습니다.

• 하단에는 페이지 설정, 빠른 탐색, 기록, 반응 모드 및 미리보기에 대한 몇 가지 유용한 아이콘이 있습니다.

• 또한 여기에 게시 버튼이 표시되어 페이지를 게시하거나 나중에 사용할 수 있도록 초안/템플릿을 저장할 수 있습니다.

또한 패널 오른쪽에 나타나는 화살표를 클릭하여 모듈 패널을 사라지게 할 수 있습니다.

이런 식으로 페이지의 전체 미리보기를 볼 수 있습니다.

보너스 포인트: HappyAddons와 같은 타사 도구를 사용하여 Elementor 경험을 향상할 수 있습니다.

Elementor는 의심할 여지 없이 WordPress의 강력한 페이지 빌더입니다. 그러나 웹 사이트를 디자인하는 동안 더 강력하고 유연성을 높이기 위해 타사 애드온이 역할을 합니다.

HappyAddons는 미래 지향적인 차세대 디자인을 만드는 데 도움이 되는 타사 애드온입니다. 200,000개 이상의 활성 설치가 있는 HappyAddons는 Elementor와 원활하게 작동하는 가장 인기 있는 애드온 중 하나입니다. 그것은 함께 제공,

• 100개 이상의 위젯
• 200개 이상의 미리 만들어진 블록
• 도메인 간 복사 붙여넣기
• 무제한 섹션 네스팅
• 이미지 마스킹
• 행복한 입자 효과
• 500+ 라인 아이콘
• 동일한 높이, 그리고 더 많은 것

Elementor와 함께 HappyAddons를 사용하면 귀하의 사이트에 즉시 프리미엄 모양을 부여할 수 있습니다.

WordPress에서 Elementor를 사용하는 방법

앞서 말했듯이 Elementor에는 끌어서 놓기 페이지 빌더와 테마 빌더가 함께 제공됩니다. 이제 이 두 빌더를 사용하는 방법과 Elementor를 사용하여 템플릿을 만드는 방법을 알아보겠습니다.

1. Elementor 페이지 빌더를 사용하는 방법
2. Elementor 테마 빌더를 사용하는 방법
3. Elementor에서 팝업을 만드는 방법

따라서 기본적으로 튜토리얼은 이 섹션에서 시작합니다. 이전에 Elementor에 대해 알게 되었고 이제 실제 방식으로 작업할 것입니다.

Elementor 페이지 빌더를 사용하는 방법

Elementor 페이지 빌더를 사용하는 방법을 보여주기 위해 이제 여행 웹사이트용 홈페이지 를 만들 것입니다. 아래 단계에 따라 편집기에서 나만의 홈페이지를 디자인하여 빠르게 배워보세요.

01단계: 새 페이지 만들기

• WordPress 대시보드 > 페이지 > 새로 추가 로 이동합니다.

• 이 페이지에 이름을 지정합니다. 여기서는 홈페이지라고 이름을 지정했습니다.
• Elementor로 전체 페이지를 구축하고 싶기 때문에 기본 템플릿을 " Elementor Canvas "로 설정합니다. Elementor Full Width 를 선택하면 메뉴 없이 전체 페이지를 사용자 지정할 수 있습니다.
• 그런 다음 오른쪽 사이드바에서 페이지를 게시합니다. 초안으로 보관할 수도 있습니다.
• " Edit with Elementor "를 클릭하면 Elementor 페이지 빌더로 리디렉션됩니다.

02단계: 여행 웹사이트 홈페이지에 적합한 템플릿 선택

Elementor에는 무료 및 프로 사전 제작 템플릿이 많이 제공되므로 처음부터 페이지를 만들 필요조차 없습니다. 기존 템플릿을 선택하여 여정을 시작할 수 있습니다.

• 템플릿 추가 버튼을 클릭합니다.

• 템플릿 중 하나를 선택하고 필요에 따라 사용자 지정할 수 있는 미리 만들어진 템플릿을 얻을 수 있습니다.
• 사용할 것을 결정한 후 삽입 옵션을 클릭하십시오.

03단계: 홈페이지에 헤더 추가

템플릿을 삽입하면 페이지가 준비되고 여행 웹사이트에 사용하도록 사용자 정의할 수 있습니다.

• 먼저 페이지에 헤더를 추가하여 웹사이트의 이름과 태그라인을 표시합니다. 드래그 앤 드롭과 약간의 스타일 지정으로 이를 수행하는 방법은 다음과 같습니다.

헤더는 방문자가 웹사이트에 들어오면 즉시 브랜드 아이덴티티를 표시하는 데 도움이 됩니다. 헤더를 사용자 정의한 후 이제 홈페이지 본문을 사용자 정의합니다.

04단계: 호텔 시설 강조

헤더 작업이 끝나면 홈페이지의 주요 부분을 디자인할 차례입니다. 그것은 누군가가 당신의 호텔에 머물기를 원하는 경우 당신이 호텔에서 제공하는 것과 같은 호텔 시설입니다.

• 로컬 저장소에서 이미지를 업로드하거나 기존 이미지를 미디어 섹션에서 이미 업로드된 이미지로 바꿀 수 있습니다. 그렇게하려면 아래 gif 파일을 따르십시오.
• 편집 옵션에서 높이, 너비, 불투명도, 여백, 패딩 및 모든 것을 조정할 수 있습니다.
• 버튼, 텍스트, 설명 추가는 모두 편집 옵션에서 가능합니다.

05단계: 비디오 및 평가 추가

• 주변 환경이 어떤지, 사람들이 리조트에 왔을 때 어떻게 즐기는지 보여주는 비디오를 추가할 수 있습니다.
• 평가를 추가하는 것은 사람들에게 귀하에 대한 고객의 의견을 알리는 현명한 결정입니다.

06단계: 문의 양식 추가

• 방문자가 귀하에게 연락할 수 있도록 연락처 양식을 추가하십시오. 방문자가 질문이 있는 경우 전화를 걸 수 있도록 연락처 페이지에 전화번호, 이메일 또는 Whatsapp 번호와 같은 연락처 번호를 설정하십시오.
• 사람들이 당신의 위치를 ​​찾을 수 있도록 Google 지도를 추가할 수도 있습니다.

07단계: 플랫폼 전반에 걸쳐 반응형으로 만들기

• 페이지가 완전히 반응하고 모든 기기에서 제대로 표시되는지 확인하세요. 그렇게 하려면 반응 모드 옵션을 클릭합니다.
• 사용자 정의가 완료되면 업데이트 버튼을 클릭합니다.

홈페이지 개요

다음은 방금 만든 홈페이지의 최종 보기입니다. 이것이 바로 Elementor 페이지 빌더를 사용하여 홈페이지, 연락처 페이지, 기능 페이지 또는 기타 페이지를 포함한 모든 페이지를 즉시 구축하는 방법입니다.

Elementor 테마 빌더를 사용하는 방법

Elementor 테마 빌더는 웹사이트를 위한 맞춤형 머리글, 바닥글 및 기타 동적 콘텐츠를 만들 수 있기 때문에 페이지 빌더에 익숙한 모든 사람을 위한 게임 체인저입니다. 심지어 WordPress 테마의 여러 ​​측면을 재정의할 수 있으므로 작동하는 것을 유지하고 원하는 대로 변경할 수 있습니다!

이 섹션에서는 Elementor 테마 빌더로 아름다운 헤더를 만드는 방법을 보여 드리겠습니다.

참고: Elementor 테마 빌더는 해당 프로 버전에서 사용할 수 있습니다. 무료 버전에는 매우 제한된 기능이 제공됩니다.

01단계: 템플릿 유형 선택

• WordPress 대시보드 > 템플릿 > 테마 빌더 로 이동합니다.
• 그런 다음 새로 추가 버튼을 클릭합니다. 또는 이미 마음에 드는 헤더를 본 경우 시작점으로 사용하기 위해 가져올 수 있습니다.

• 새로 추가 버튼을 클릭하면 팝업 화면이 눈앞에 나타납니다. 템플릿 유형에서 선택할 수 있는 드롭다운 메뉴가 표시됩니다.
• 사원 유형을 선택합니다. 여기서는 헤더를 선택합니다.
• 그런 다음 이름을 지정합니다.
• 마지막으로 템플릿 만들기 옵션을 클릭합니다.

참고: Elementor Free에는 섹션 및 페이지 템플릿만 포함됩니다. Pro 버전에는 전역 위젯, 머리글, 바닥글, 단일 및 아카이브를 포함한 몇 가지 추가 템플릿 범주가 포함되어 있습니다.

02단계: Elementor에서 헤더 사용자 지정

자신의 헤더를 디자인하도록 선택하거나 Elementor 템플릿 라이브러리에서 미리 만들어진 헤더를 선택할 수 있습니다.

• 템플릿 추가 옵션을 클릭하여 미리 만들어진 헤더를 편집기에 로드합니다.

이 단계가 친숙해 보인다면 이전에 전체 페이지를 만들 때 사용한 것과 똑같은 편집기이기 때문입니다. 이제 여기에서 그 경험을 사용하여 웹사이트의 헤더를 만드십시오.

헤더를 사용자 정의하고 ' 게시 ' 버튼을 클릭한 후 원하는 경우 헤더를 표시할 위치에 대한 조건을 설정할 수 있습니다.

참고: 동일한 단계에 따라 웹사이트의 바닥글도 만들 수 있습니다. Elementor Theme Builder를 사용하여 바닥글을 디자인할 때 템플릿 유형으로 '바닥글'을 선택해야 합니다.

Elementor에서 팝업을 만드는 방법

Elementor로 팝업을 만드는 것은 매우 쉽습니다. 모든 것이 드래그 앤 드롭되는 Elementor의 시각적 인터페이스로 팝업을 디자인할 수 있습니다. Elementor는 미리 만들어진 팝업 템플릿도 제공하므로 작업이 더욱 쉬워집니다. 템플릿을 선택하고 게시하고 트리거를 설정하기만 하면 됩니다. 그게 다야!

참고: Elementor 테마 빌더는 해당 프로 버전에서만 사용할 수 있습니다.

01단계: 새 파일 추가

• WordPress 대시보드 > 템플릿 > 팝업으로 이동합니다. 그런 다음 상단에 있는 새로 추가 버튼을 클릭합니다.

• 팝업에 이름을 지정하고 CREATE TEMPLATE 버튼을 클릭합니다.

• 사용할 팝업 템플릿을 선택하세요. 그 위에 마우스를 놓고 삽입 버튼을 클릭하여 Elementor 편집기로 이동합니다.

참고: 팝업을 처음부터 만들고 싶다면 템플릿 라이브러리를 닫고 Elementor 편집기를 열면 됩니다.

02단계: 팝업 사용자 지정

미리 디자인된 팝업을 편집기에 삽입한 후에는 해당 팝업을 사용자 정의할 차례입니다. Elementor 편집기에서 팝업을 사용자 지정할 수 있습니다. 기본 콘텐츠를 자신의 콘텐츠로 바꿀 수 있습니다.

미리 디자인된 Elementor 템플릿을 사용자 지정하는 방법을 이미 보여 드렸습니다.

완료되면 PUBLISH 버튼을 클릭합니다.

03단계: 표시 조건 및 트리거 설정

다음 단계에서는 표시 조건과 트리거를 설정하라는 메시지가 표시됩니다. 고급 규칙을 설정하는 옵션도 있습니다.

• 표시 조건: 웹사이트 전체에서 팝업이 표시되는 페이지를 결정합니다. 전체 웹사이트, 특정 페이지, 특정 게시물, 특정 카테고리 등에 팝업이 나타나도록 설정할 수 있습니다.

• 트리거: 트리거는 팝업을 표시하는 작업입니다. Elementor는 페이지 로드 시, 스크롤 시, 요소로 스크롤 시, 클릭 시, 비활성 후, 페이지 종료 의도의 6가지 트리거 유형을 지원합니다.

• 고급 규칙: 팝업이 표시되려면 요구 사항이 충족되어야 합니다. 예를 들어 방문자가 검색 엔진이나 특정 UR을 통해 웹사이트를 방문하는 경우 팝업이 표시되도록 설정할 수 있습니다. Elementor Popup Builder 자체에는 선택할 수 있는 7가지 고급 규칙 옵션이 있습니다.

사용자가 버튼을 클릭할 때 팝업을 표시하려면 트리거 탭을 열고 클릭 시 옵션을 활성화합니다. 그런 다음 저장 및 닫기 를 클릭합니다.

04단계: 페이지에 팝업 연결

새 페이지/게시물을 만들고 Elementor로 편집합니다(기존 페이지도 편집할 수 있음).

• 버튼 위젯을 왼쪽 패널에서 캔버스 영역으로 드래그하여 추가합니다. 또는 이미 단추가 포함된 기존 페이지를 편집하는 경우 단추 위젯을 클릭하여 편집 모드로 전환합니다.

• 콘텐츠 탭 아래의 버튼 옵션에서 링크를 팝업 으로 설정합니다. 이렇게 하려면 링크 섹션에서 동적 을 클릭하면 됩니다.

• 팝업 필드에서 렌치 아이콘을 클릭하고 방금 생성한 팝업을 선택합니다. 팝업 이름을 입력하여 팝업을 찾습니다.

페이지 편집이 완료되면 게시/업데이트 를 클릭합니다.

게시/업데이트 버튼을 클릭하기 전에 먼저 페이지를 미리 보고 팝업이 이미 작동하는지 확인할 수 있습니다.

Elementor 고급 기능 사용 방법

이 섹션에서는 주로 두 가지 주제에 중점을 둘 것입니다. 그들은,

• Elementor에서 WooCommerce 제품 페이지를 사용자 정의하는 방법
• JSON 파일에서 Elementor 템플릿을 가져오는 방법

그럼 공을 굴려봅시다.

Elementor에서 WooCommerce 제품 페이지를 사용자 정의하는 방법

WooCommerce 제품 페이지를 사용자 정의하기 전에 WordPress 대시보드에 WooCommerce를 설치하고 활성화해야 합니다. 또한 웹사이트에 몇 가지 제품을 추가해야 합니다. 이를 위해 이 WooCommerce 설정(단계별) 가이드에서 도움을 요청할 수 있습니다.

설정 후 제품 페이지를 디자인할 수 있습니다. 이 단계를 따르세요.

1단계: 단일 제품 템플릿 생성

• WordPress 대시보드에서 Elementor > 내 템플릿 으로 이동합니다.
• 새로 추가 버튼을 클릭합니다.
• 템플릿 유형으로 단일 제품 을 선택하고 템플릿 생성 을 클릭합니다.

2단계: 미리 디자인된 제품 페이지 템플릿을 선택하거나 처음부터 만들기

• Elementor 라이브러리가 로드됩니다.
• 그런 다음 미리 디자인된 제품 페이지 템플릿을 선택하거나 처음부터 만듭니다.
• 미리 만들어진 제품 페이지 템플릿을 선택하는 경우 디자인 기술에 따라 사용자 지정합니다(이 섹션 직전에 페이지를 사용자 지정하는 방법을 보여 주었기 때문에 이제 디자인을 사용자 지정할 수 있는 경험이 있습니다).

03단계: 다양한 제품 위젯을 추가하여 페이지 사용자 지정

• 이제 제품 페이지를 구성할 요소를 만들 차례입니다. 아래 스크린샷을 따라 제품 페이지를 디자인하세요. 필요한 위젯을 추가하거나 제거할 수 있습니다.

04단계: 페이지 게시

• 페이지를 미리 볼 준비가 되면 왼쪽 하단 패널에 있는 눈 아이콘을 클릭합니다.
• 설정 을 클릭한 다음 표시할 제품을 선택합니다.
• 페이지를 게시하려면 왼쪽 하단 패널에서 녹색 게시 버튼을 클릭합니다.

아래 이미지처럼 보일 수 있습니다.

JSON 파일에서 Elementor 템플릿을 가져오는 방법

Elementor를 사용하면 JSON 파일에서 템플릿을 가져올 수 있습니다. 이렇게 하려면 두 가지 방법을 사용할 수 있습니다. 그들이 어떻게 작동하는지 알아보자!

1. 템플릿 라이브러리를 통해

• 템플릿 추가 버튼을 클릭합니다.

• 화살표 아이콘을 클릭하십시오 – 템플릿 가져오기 .
• 이제 SELECT FILE 버튼을 클릭하여 가져올 JSON 파일을 선택합니다.

• 템플릿 라이브러리의 내 템플릿 탭에서 방금 가져온 템플릿을 찾을 수 있습니다.

방금 가져온 템플릿이 나타나지 않으면 새로 고침 아이콘을 클릭하여 템플릿을 다시 로드합니다. 템플릿 위에 마우스를 놓고 삽입 버튼을 클릭하여 Elementor 캔버스에 로드합니다.

2. 템플릿 관리자를 통해

• WordPress 대시보드에서 템플릿 > 저장된 템플릿 으로 이동합니다.
• 템플릿 가져오기 버튼을 클릭합니다.
• 그런 다음 파일 선택 버튼을 클릭하여 JSON 파일을 선택합니다.
• 마지막으로 지금 가져오기 버튼을 클릭하여 가져옵니다.

다음은 JSON 파일에서 Elementor 템플릿을 가져오는 두 가지 방법입니다. 작업을 완료하는 방법 중 하나를 선택할 수 있습니다.

WordPress 사이트에서 Elementor Page Builder 사용의 장단점

모든 것에도 어두운 면이 있다는 것은 분명합니다. 그러나 Elementor의 관점에서 보면 실제로 어두운 면이 아닙니다. 대신 시간이 지남에 따라 개선할 수 있는 몇 가지 제한 사항이 있다고 말할 수 있습니다. 그것들은 무엇입니까?

자, 그 전에 장단점을 한 눈에 확인해보자.

WordPress에서 Elementor 사용의 장점

• 무료 플러그인입니다! 대부분의 사용자는 프로 버전으로 업그레이드하지 않고도 사이트를 완전히 구축할 수 있습니다.
• 무료 플러그인의 경우 매우 다양한 기능이 있습니다. 무료 버전의 기능 세트는 많은 유료 플러그인과 경쟁합니다.
• 실시간 편집기를 사용하면 사이트를 변경하고 실시간으로 상황을 확인할 수 있으므로 여러 화면을 왔다갔다 할 필요가 없습니다.
• 사이트, 데스크톱, 모바일 및 태블릿의 여러 버전을 편집하고 볼 수 있으며 각 버전을 고유하게 변경할 수 있습니다.

WordPress에서 Elementor 사용의 단점

• Elementor는 강력한 편집기이지만 모든 유연성과 사용자 정의 옵션으로 인해 모든 것을 올바르게 만들기가 어려울 수 있습니다.
• 때때로 페이지에 다른 콘텐츠 오버레이의 레이어가 있을 수 있으며 편집하려는 영역을 찾는 것이 어렵고 시간이 많이 소요될 수 있습니다.
• Elementor를 사용하여 사이트를 구축하는 경우 플러그인을 계속 설치해야 합니다. 그렇지 않으면 모든 디자인과 사용자 정의를 잃게 됩니다.

디자인을 향상시키는 최고의 타사 Elementor 애드온

타사 애드온은 Elementor의 최강자입니다. Elementor가 80개 이상의 Fantastic Elements를 제공하고 있음에도 불구하고 더 발전되고 독특한 것을 원할 가능성이 매우 높습니다. 이것이 바로 타사 개발자가 Elementor 기능을 확장하고 자체 Elementor Addons를 개발하기로 결정한 이유입니다.

그 외에도 고급 가격 책정, 팀, 소셜 요소, 크리에이티브 요소, 양식 스타일 요소, ​​카운트다운 등과 같은 추가 기능과 함께 많은 특수 목적 요소를 얻게 됩니다.

결과적으로 Elementor는 이제 공식적으로 Elementor의 공식 페이지에 표시하여 기여자로 공식적으로 인정합니다. 그 중 WordPress 웹 사이트를 디자인하는 동안 사용할 수 있는 최고의 타사 Elementor 애드온 목록이 있습니다.

1. Happy Addons: 100개 이상의 위젯과 200개 이상의 블록이 제공되므로 더 적은 시간과 예산으로 웹사이트를 자유롭게 디자인할 수 있습니다.
2. Elementor용 프리미엄 애드온: 55개 이상의 고도로 사용자 정의 가능한 Elementor 필수 애드온 및 위젯, 300개 이상의 사전 제작된 Elementor 템플릿을 제공하여 더 짧은 시간에 쉽게 웹사이트를 디자인할 수 있습니다.
3. Elementor 전용 애드온: 700개 이상의 사전 제작 블록과 10개 이상의 사용 가능한 템플릿 모음을 통해 코딩 없이 더 짧은 시간에 웹사이트를 구축할 수 있습니다.
4. Elementor용 PowerPack: 60개 이상의 창의적인 Elementor 위젯과 확장을 제공하여 Elementor 경험을 향상시킵니다.

이 애드온은 놀라운 기능과 레이아웃으로 웹사이트 디자인을 강화할 수 있는 기회를 제공합니다. 또한 Elementor 확장 기능을 사용하여 특별한 분위기를 연출할 수 있습니다.

무료 튜토리얼: Elementor 및 Happy Addons를 사용하여 전자 상거래 웹사이트 구축

Elementor를 사용하여 전자 상거래 웹사이트를 만드는 것은 매우 쉽습니다. 그리고 HappyAddons와 Elementor를 결합하여 웹사이트를 디자인하는 것이 더 재미있습니다. 우리의 요구 사항에 따라 설계할 수 있는 무한한 유연성과 같은 것입니다. Elementor와 HappyAddons를 사용하여 전자상거래 웹사이트를 쉽게 디자인할 수 있는 방법을 확인해 봅시다.

전자 상거래 사이트를 만들기 위한 전제 조건은 다음과 같습니다.

1. 도메인 이름 및 웹 호스팅 계획 선택
2. WordPress 및 WooCommerce 설치
3. 엘리멘터 설치
4. 마지막으로 HappyAddons 설치(무료 + 프로)

05: 전자 상거래 템플릿 선택

• WordPress 대시보드 > 페이지 > 새로 추가 로 이동합니다.
• 이 페이지에 이름을 지정합니다.
• Elementor로 전체 페이지를 구축하고 싶기 때문에 기본 템플릿을 " Elementor Canvas "로 설정합니다. Elementor Full Width 를 선택하면 메뉴 없이 전체 페이지를 사용자 지정할 수 있습니다.
• 그런 다음 오른쪽 사이드바에서 페이지를 게시합니다. 초안으로 보관할 수도 있습니다.
• " Edit with Elementor "를 클릭하면 Elementor 페이지 빌더로 리디렉션됩니다.

• HappyAddons 기호를 클릭하여 전자 상거래 사이트용으로 미리 디자인된 템플릿을 추가하십시오.

• 미리 디자인된 템플릿을 선택하고 삽입 옵션을 클릭합니다.

06: 템플릿 사용자 지정

전체 사용자 지정 프로세스는 이전 섹션인 Elementor Page Builder 사용 방법에서 설명한 것과 동일합니다. 동일한 단계를 따라 디자인을 완료하십시오.

로고, 색 구성표, 탐색 링크, 웹사이트 사본 및 기타 원하는 기능을 변경할 수 있습니다. Elementor 및 Happy Addons 위젯을 사용하여 웹사이트에 특정 기능을 추가할 수도 있습니다.

07단계: 페이지 게시

웹사이트의 디자인, 인터페이스 및 기능에 완전히 만족했다면 이제 웹사이트를 게시할 차례입니다.

• 사이트를 미리 보려면 아이콘을 클릭합니다.
• 결과에 만족하면 게시/업데이트 버튼을 클릭합니다.
• 게시된 페이지를 보려면 '보기'를 클릭하세요.

엘리멘터 FAQ

너에게로

WordPress에서 Elementor를 사용하는 것은 실제로 그렇게 복잡하지 않습니다. 이 단계별 자습서와 같이 완전히 포괄적인 가이드가 있으면 더 재미있을 수 있습니다.

이 가이드를 따르고 개선을 위해 계속 연습하고 Elementor의 거장이 될 마인드 설정을 준비하십시오. 그것이 Elementor를 사용하고 WordPress 웹사이트를 순식간에 구축하는 데 필요한 전부입니다.

Elementor를 사용하는 동안 문제가 발생하거나 WordPress에서 Elementor를 사용하는 방법에 대한 이 가이드에 대한 제안 사항이 있는 경우 아래 의견란을 통해 알려주십시오. 행운을 빕니다!