템플릿은 웹페이지 내에서 디자인을 가져오는 가장 빠른 방법입니다. 많은 사람들이 HTML을 Elementor 페이지 템플릿으로 변환하는 방법을 모릅니다. 그 결과 일이 더 복잡해집니다. 이 문제를 해결하기 위해 Elementor 템플릿을 쉽게 만드는 방법을 보여드리겠습니다.
템플릿을 만드는 동안 미리 만들어진 페이지가 필요하다는 것을 기억해야 합니다. 물론 지금 바로 웹페이지를 만들어서 작업을 시작할 수 있습니다. 우리는 Elementor로 페이지를 디자인할 것입니다.
하지만 이번 이벤트에서는 다음에서 만든 위젯을 사용하고 있습니다. Element Pack. HTML을 엘리멘터 페이지 템플릿으로 변환하는 방법을 알아보려면 이 블로그를 자세히 읽어보세요.
1단계: 템플릿용 페이지 디자인하기
우선 페이지를 만들어야 합니다. 시작해 보겠습니다.
회원님의 워드프레스 대시보드 > 페이지 > 새로 추가.
페이지 이름을 지정하고 Elementor로 편집. 이제 Elementor 편집기에서 페이지가 열립니다.
그런 다음 원하는 대로 페이지를 만듭니다. 위 이미지에서는 제목, 스크롤 탐색, 고급 버튼, 검색 및 슬라이더 위젯을 사용하여 페이지를 만들었습니다. 이 엘리멘터 애드온 위젯 는 모두 Element Pack에서 만들었습니다. 이제 페이지를 엘리멘터 페이지 템플릿으로 변환할 준비가 되었습니다.
2단계: Elementor 페이지 템플릿으로 변환하기
템플릿을 만들려면 몇 가지 단계를 수행해야 합니다. 먼저 위 이미지를 따라 오른쪽 메뉴 하단에 있는 템플릿으로 저장을 클릭합니다. 업데이트 버튼 옆에 있는 화살표를 클릭하여 옵션이 나타나도록 해야 합니다. 이것이 엘리멘터 페이지 템플릿을 만드는 첫 번째 단계입니다.
그러면 새 팝업 창이 나타납니다. 여기에서 템플릿에 이름을 지정하고 저장을 누르면 됩니다. 템플릿이 엘리멘터 라이브러리에 저장됩니다.
일부 사용자는 온라인에 HTML에서 엘리멘터로 변환하는 변환기나 프로세스를 간소화할 수 있는 HTML에서 엘리멘터로 변환하는 플러그인이 있는지 문의하기도 합니다. Elementor에는 직접 변환기가 없지만 다음 단계에 따라 디자인을 쉽게 빌드하고 저장할 수 있습니다.
3단계: 템플릿을 로컬 드라이브로 내보내기
템플릿을 저장하면 템플릿 라이브러리가 나타납니다. 거기에서 새로 만든 템플릿에 표시된 점을 클릭합니다. 두 가지 옵션이 표시됩니다. 이제 가져오기를 클릭합니다.
템플릿이 다운로드되어 Json 형식으로 저장됩니다. 이제 이 파일을 로컬 디렉토리> wp-content> 템플릿에 넣을 수 있습니다. 이 파일은 엘리멘터 템플릿 JSON 파일.
이렇게 파일을 저장하면 모든 워드프레스 대시보드에서 이 템플릿에 액세스할 수 있습니다.
사용자 정의 HTML로 작업하는 경우 다음에 대한 가이드가 표시될 수 있습니다. HTML에서 JSON 엘리멘터로 또는 HTML에서 엘리멘터 JSON으로하지만 Elementor는 템플릿을 내보내고 가져올 때 대부분의 작업을 자동으로 처리합니다.
최고의 웹 솔루션: 저희 제품으로 웹사이트를 강화하고 싶으신가요?
4단계: 엘리멘터 페이지 템플릿 삽입하기
로컬 디렉토리에 템플릿 Json 파일이 있으므로 이제 워드프레스 라이브러리 안에 있습니다. 이제 페이지에 삽입하는 방법을 살펴보겠습니다.
먼저 새 페이지를 만들고 엘리멘터로 편집합니다. 그런 다음 위 그림에 표시된 템플릿 폴더를 클릭합니다.
이제 템플릿 라이브러리를 볼 수 있습니다. 거기에서 템플릿을 마우스로 가리키고 삽입을 클릭한 다음 예를 누릅니다.
끝입니다! HTML 대신 엘리멘터 템플릿이 페이지에 표시됩니다. 웹사이트를 엘리멘터로 변환하거나 디자인을 재사용하려는 경우 특히 유용합니다.
Elementor 페이지에서 html 요소를 숨기는 방법은 무엇인가요?
HTML 템플릿을 엘리멘터로 변환하고 싶지 않다면 일시적으로 숨기면 다시 HTML 버전으로 돌아갈 수 있습니다.
엘리멘터 페이지에서 HTML 템플릿을 숨기는 가장 쉬운 단계는 다음과 같습니다:
1단계: 회원님의 Elementor 페이지 을 클릭하고 엘리멘터 HTML 위젯.
2단계: 왼쪽 메뉴 표시줄에서 사전 탭을 클릭합니다.
3단계: 아래로 스크롤하여 목록에서 반응형 메뉴를 찾습니다.
4단계: 필요에 따라 데스크톱, 모바일, 태블릿에서 토글을 활성화하여 숨기세요.
여기까지입니다. HTML 템플릿은 Elementor 페이지에 표시되지 않습니다. 하지만 일시적으로 숨겨지는 것이므로 토글을 비활성화하면 언제든지 표시할 수 있습니다.
자주 묻는 질문:
Elementor로 만든 페이지 HTML 소스 코드를 보는 방법은 무엇인가요?
페이지를 마우스 오른쪽 버튼으로 클릭하고 "페이지 소스 보기"를 클릭합니다. 그러면 HTML 요소 구조입니다.
Elementor에서 HTML을 편집하는 방법은 무엇인가요?
왼쪽 메뉴에서 HTML을 검색합니다. 왼쪽 메뉴에서 요소 HTML 코드 편집기 옵션을 클릭하고 편집 후 게시 를 클릭하여 변경 사항을 저장합니다.
워드프레스 Elementor에서 HTML 코드를 추가하는 방법은 무엇인가요?
삽입 워드프레스 엘리멘터 HTML 코드 블록 또는 엘리멘터 HTML 위젯 를 클릭하고 사이에 코드를 추가합니다.
Elementor 디자인을 HTML로 내보낼 수 있나요?
예, 하지만 Elementor는 기본적으로 JSON을 내보냅니다. 다음과 같은 경우 도구 또는 수동 방법이 필요합니다. 엘리멘터 페이지를 HTML로 변환또는 HTML로 엘리멘터 내보내기.
결론
HTML을 엘리멘터 페이지 템플릿으로 변환하거나 Elementor 디자인을 JSON으로 내보내는 것은 어려운 작업이 아니며 여러분도 할 수 있습니다. 단계를 제대로 따르기만 하면 됩니다.
일부 사용자는 역방향 프로세스를 선호하여 엘리멘터 - HTML 변환기 또는 엘리멘터 페이지를 HTML로 내보내기. 이러한 경우 브라우저의 저장 기능이나 플러그인을 사용할 수 있습니다. 엘리멘터를 HTML로 변환.
이 블로그는 다음에서 후원합니다. Element Pack를 위한 올인원 위젯 팩입니다. Elementor. 이 블로그를 읽어주셔서 감사합니다. 좋은 하루 되세요.
