본문으로 바로가기

워드프레스/Elementor

해당되는 글 67
  • thumbnail
    워드프레스/Elementor (1)

    엘리멘터 모바일 메뉴 레이아웃 변경 (햄버거 메뉴 vs. PC 메뉴)

    워드프레스 엘리멘터 페이지 빌더로 사이트를 제작할 때 모바일에서 메뉴는 보통 햄버거 메뉴로 표시됩니다. 모바일에서도 PC 메뉴와 같이 수평 내비게이션 레이아웃을 원하는 경우 모바일 드롭다운에 대한 분기점(Breakpoint) 설정을 조정할 수 있습니다. 엘리멘터 모바일 메뉴 레이아웃 변경 Elementor Pro를 사용하는 경우 테마 빌더를 통해 헤더 레이아웃을 만들 수 있습니다. 여러 개의 헤더 템플릿을 만들어서 페이지에 따라 다른 헤더를 사용하도록 지정할 수 있습니다. 헤더 템플릿을 새로 만들거나 기존 템플릿을 수정하려면 워드프레스 알림판 » 템플릿 » Theme Builder를 클릭하고 Header를 선택합니다. Add New를 클릭하여 새 템플릿을 만들거나 기존 템플릿을 편집할 수 있습니다. 헤더..
  • thumbnail
    워드프레스/Elementor (1)

    엘리멘터: 페이지 전체 화면을 배경 이미지로 채우는 방법

    그림과 같이 페이지 전체 화면을 배경 이미지로 채우고 싶은 경우 HTML/CSS 코드 또는 자바스크립트를 사용하여 구현할 수 있습니다. 워드프레스에서 엘리멘터 페이지 빌더를 사용하는 경우에는 매우 간단한 방법으로 페이지 전체를 배경 이미지로 채울 수 있습니다. 엘리멘터 페이지 빌더에서 페이지 전체 화면을 배경 이미지로 채우는 방법 Elementor 페이지 빌더를 사용하는 경우 섹션에 배경 이미지를 지정하고, 배경 이미지가 화면 전체를 채우도록 설정할 수 있습니다. 1. 페이지 편집 화면에서 페이지 템플릿에 Elementor 캔버스를 지정하도록 합니다. 2. 엘리멘터 페이지 빌더 편집 화면에서 섹션을 추가하고 섹션 편집 패널에서 스타일 탭을 클릭합니다. 위의 그림과 같이 백그라운드 이미지를 지정하고 위치(..
  • thumbnail
    워드프레스/Elementor

    워드프레스 엘리멘터 Deprecated: Elementor\DB::is_built_with_elementor 에러

    인기 워드프레스 페이지 빌더인 엘리멘터 업데이트 시 "Deprecated: Elementor\DB::is_built_with_elementor 함수는 버전 3.2.0 이후로 폐기예정입니다..." 혹은 "Deprecated: Function Elementor\DB::is_built_with_elementor is deprecated since version 3.2.0!..." 에러가 발생하는 경우가 있습니다. 워드프레스 엘리멘터 Deprecated: Elementor\DB::is_built_with_elementor 에러 PHP 7.4에서 일부 사이트에서 엘리멘터 페이지 빌더를 최신 버전으로 업데이트 시 오류가 발생할 수 있습니다. 이 문제가 Elementor 버전 3.7.0에서 해결되었다고 엘리멘터측에서..
  • thumbnail
    워드프레스/Elementor (2)

    워드프레스 엘리멘터 슬라이드 위젯 (+버튼 두 개 표시)

    워드프레스에는 무료 및 유료 슬라이더 플러그인이 있습니다. 무료 플러그인으로는 Smart Slider 3, MetaSlider 등이 많이 사용되고 있습니다. 유료 플러그인으로는 유명한 Slider Revolution이 있습니다. 엘리멘터 페이지 빌더의 경우 Elementor Pro에서 Slides 위젯을 제공합니다. 엘리멘터 페이지 빌더의 슬라이드 위젯을 사용하여 외부 플러그인을 설치하지 않고 슬라이더를 만들 수 있습니다. 워드프레스 엘리멘터 슬라이드 위젯 엘리멘터 페이지 빌더에서 슬라이드를 만들려는 경우 참고해보세요. 1. 먼저 섹션을 만들고 섹션 편집에서 내용 너비를 전체 너비(Full-width)로 지정하도록 합니다. 2. 엘리멘츠에서 Slide로 검색하여 Slides 위젯을 원하는 섹션으로 드래그..
  • thumbnail
    워드프레스/Elementor (1)

    모바일에서 엘리멘터 Tabs 위젯의 탭 레이아웃 유지하기

    워드프레스 엘리멘터 페이지 빌더의 Tabs 위젯을 사용하여 탭 레이아웃을 쉽게 만들 수 있습니다. 탭은 수평 스타일과 수직 스타일 모두 가능합니다. 하지만 모바일 기기에서는 탭 레이아웃이 유지되지 않고 세로로 쌓이는 형식으로 표시됩니다. 모바일에서 엘리멘터 Tabs 위젯의 탭 레이아웃 유지하기 Elementor 페이지 빌더의 탭 기능을 사용하여 탭을 만들었을 때 모바일에서도 PC에서와 비슷한 레이아웃을 유지하고 싶은 경우 다음 방법을 이용할 수 있습니다. 1. 먼저 Tabs 편집 패널에서 고급(Advanced) 탭을 클릭한 다음, CSS ID 필드에 [**mobile-tabs**]를 입력합니다. 2. 엘리멘터 프로를 사용하는 경우 Custom CSS 섹션에 다음 사용자 정의 CSS 코드를 입력합니다. /..
  • thumbnail
    워드프레스/Elementor (2)

    엘리멘터에서 페이지를 템플릿으로 저장하는 방법

    워드프레스 엘리멘터 페이지 빌더에서는 페이지를 템플릿으로 저장하여 활용할 수 있습니다. 또한, 섹션도 템플릿으로 저장하는 것이 가능합니다. 엘리멘터에서 페이지를 템플릿으로 저장하는 방법 Elementor 페이지 빌더에서 페이지를 템플릿으로 저장하고 싶은 경우 페이지 편집 화면에서 왼쪽 하단의 "발행" 또는 "업데이트" 버튼 옆의 화살표(🔺)를 클릭하도록 합니다. 이미 발행된 페이지는 위의 그림과 같이 "업데이트"가 표시됩니다. 발행되지 않은 글은 "발행"이 표시됩니다. 발행/업데이트 버튼 옆의 위쪽 화살표를 클릭하면 템플릿으로 저장(Save As Template)이 나타납니다. 템플릿으로 저장을 클릭합니다. 라이브러리에 페이지 저장하기 팝업이 표시됩니다. 템플릿 이름을 입력하고 저장 버튼을 클릭합니다. ..
  • thumbnail
    워드프레스/Elementor

    엘리멘터 "페이지에서 내용 영역을 찾을 수 없습니다" 오류 해결 방법

    워드프레스 엘리멘터 페이지 빌더로 페이지를 편집하려고 시도할 때 다음 그림과 같이 "죄송합니다, 페이지에서 내용 영역을 찾을 수 없습니다" 오류가 발생하는 경우가 있습니다. 이 오류가 발생하는 경우 해결 방법에 대해 살펴보도록 하겠습니다. 워드프레스 엘리멘터 "페이지에서 내용 영역을 찾을 수 없습니다" 오류 해결 방법 페이지 편집하려고 시도할 때 다음과 같은 오류 메시지가 표시되면서 페이지 편집을 할 수 없는 경우가 있습니다. 죄송합니다, 페이지에서 내용 영역을 찾을 수 없습니다. (Sorry, the content area has not been found on your page) You must call 'the_content' function in the current template, in ord..
  • thumbnail
    워드프레스/Elementor (4)

    엘리멘터 폼 개인정보 및 이용약관 동의 필드

    워드프레스에서 방문자로부터 문의, 의뢰 또는 피드백을 받고 싶은 경우 문의 폼 플러그인이나 워드프레스 테마에서 제공하는 문의 폼 기능을 사용할 수 있습니다. 무료 문의 폼 플러그인으로 Contact Form 7과 WPForms가 있으며 유료 컨택트 폼 플러그인으로 Quform 등이 있습니다. 아바다 테마 등 일부 테마에서는 자체적으로 문의 폼 기능을 제공하기도 합니다. 엘리멘터 페이지 빌더의 경우 Elementor Pro에서 Form 위젯을 제공합니다. Form 엘리먼트를 사용하면 별도의 컨택트 폼 플러그인을 설치할 필요 없이 자체 기능으로 웬만한 문의 양식을 만들 수 있습니다. https://avada.tistory.com/2462 워드프레스 엘리멘터 문의폼 위젯(Form 요소) 워드프레스에서 방문자나..
  • thumbnail
    워드프레스/Elementor (9)

    엘리멘터 이미지 캐러셀 - 개별 이미지에 다른 링크 설정하기(플러그인 미사용)

    워드프레스 엘리멘터 이미지 캐러셀(Image Carousel)을 사용하면 고객사 리스트 슬라이드 등을 만들 수 있습니다. 하지만 Elementor의 이미지 캐러셀에 추가한 이미지들에 링크를 설정할 경우 해당 캐러셀 내의 모든 이미지에 동일한 링크가 추가됩니다. 링크 옵션에 대하여 "사용자 URL"을 선택하면 위의 그림과 같이 하나의 링크만 지정이 가능합니다. 개별 이미지에 다른 링크를 설정하고 싶은 경우 Custom links in Elementor Image Carousel이라는 무료 플러그인을 사용할 수 있습니다. 그러나 이미지 캐러셀 한 두 개 때문에 플러그인을 설치하는 것이 마음에 들지 않을 수 있을 것입니다. 아래의 방법을 이용하면 플러그인을 사용하지 않고 자바스크립트(Javascript)로 각..
  • thumbnail
    워드프레스/Elementor (4)

    워드프레스 Elementor 페이지 빌더: 고객사 리스트 슬라이드 만들기 (이미지 캐러셀)

    고객사 소개 페이지에서 고객사 로고들을 왼쪽 또는 오른쪽으로 움직이는 슬라이드(좌우 롤링 배너)로 만들어 표시하는 경우가 많이 있습니다. 쉽게 이해하기 위해 다음 영상을 보시면 기업 로고들이 배열되어 가로로 회전하고 있습니다. 테스트용으로 임의의 이미지를 업로드하여 만들어 보았습니다. 제대로 만들려면 먼저 크기가 일정한 고객사 로고 파일을 준비하면 되겠죠. 위의 영상과 같이 고객사를 소개하는 회전 슬라이더를 워드프레스에서 만들려는 경우, 테마 기능이나 플러그인을 사용할 수 있습니다. 예를 들어, 베스트셀링 테마인 아바다 테마에서는 이미지 캐러셀(image carousel) 기능을 사용하여 비슷하게 구현할 수 있습니다. 워드프레스 아바다(Avada)에서 Image Carousel 사용하기 - 워드프레스 중..

    가성비가 뛰어난 웹호스팅

    저렴하고 가성비 좋은 웹호스팅

    저도 같은 사람한테 당했는 데... 청산사랑 => 이 ⋯

    💬Xenoint

    플러그인 사용이전하는 방법이로군요^^

    💬空空(공공)

    트라도스서식 알아 갑니다^^

    💬空空(공공)

    예전에는 새로운 버전 출시 전 몇 달 전에 구입할 경우⋯

    💬워드프레스, 웹호스팅 정보를 제공하는 블로그 Avada

    무료로 업그레이드 해주면 더 충성도가 올라갈텐데요

    💬본연의 힘

    워드프레스 시작 가이드

    워드프레스 시작하기
    이모티콘창 닫기
    울음
    안녕
    감사해요
    당황
    피폐

    이모티콘을 클릭하면 댓글창에 입력됩니다.

    프리미엄 테마 그래픽 동영상 템플릿 무료 다운로드