[Wordpress] 워드프레스 Elementor(엘리멘터) 랜딩페이지 만들기

 

1. 랜딩 페이지 만들기 - 엘레멘토로 편집하기

2. 설정 - 페이지레이아웃 "Elementor Canvas" 변경 (메뉴가 없는 깨끗한 페이지)

 

3. +클릭 - 스트레치 섹션 활성화 (화면이 전체로 확장하도록)

 

너비 조절

 

4. 전체 메뉴보기 - 제목위젯을 드레그하여 상단에 갖다 놓기 - 텍스트 입력하기

 

5. 위와 같은 방법으로 텍스트 위젯, 버튼 위젯을 드레그 드롭으로 추가

5-1. 글자 크기, 색 편집은 스타일에서 가능 (옵션)

 

6. 배경에 색, 그레디언트을 넣을 수 있음 (옵션)

6-1. 배경에 이미지 넣기 (하나의 이미지, 이미지 슬라이드 쇼(youtube), 동영상재생)

 

 

7. 이미지 또는 동영상 크기 편집, (전체 or 크기조절)

왼쪽 전체 설정, 오른쪽 크기 조절

사진일 때 반복으로 할지, 전체 크기에 맞게 할지 등 설정

 

8. 배경 오버레이 (배경 글자 강조, 셀로판지 씌우기 등)

 

 

9. 버튼 마우스 호버시 액션, 색상, 크기 등 편집 (영상 19:40 부터 참고)

 

10. 블록 추가 후, 아이콘 박스 추가

위젯에서 아이콘 박스 마우스 드롭

아이콘 원하는 것 선택, 글 입력.  해당 아이콘 클릭시 이동할 웹페이지 URL

테두리 입체감 주기, 외곽선 주기

아이콘 클릭 후 색상 변경 가능

여백 조절 하기

 

11.  2컬럼으로 제목, 텍스트, 버튼 + 사진 추가하기

여러개를 추가할 때, 마우스 드레그로 땡겨보면 자리가 하이라이트 됨, 그곳에 배치

사진 드레그 드롭으로 추가 가능

섹션 편집으로 전체적인 너비조절 가능

 

12. 여백 삽입은 스페이서로 가능

두 섹션간 간격을 넓히고 싶을때, 스페이서 이용

 

13. 이미지 캐러셀(회전목마) 배치  (이미지 슬라이딩)

        갤러리 삽입하기 (파일을 드레그 드롭으로 복사 가능)

        이미지 배치를 하면 순서대로 우측으로 슬라이딩하며 선택 가능

이미지가 우측이나 좌측으로 슬라이딩이 됨.

 

이미지의 크기설정 ( 단 원본파일 크기 기준 )

몇개를 표시할 지 선택

 

 

 

 

(아래영상 참고)

https://www.youtube.com/watch?v=MX4EkmLGwdA 

 

 

전문가의 손길의 도움을 받아 빠르게 제작하고 싶은경우 아래 참고

https://ansan-survivor.tistory.com/920

무료 홈페이지 제작 서비스 제공 "바른web" 개인, 작은 비즈니스 운영 웹사이트