워드프레스 엘리멘터 빌더에서 글이나 커스텀 포스트 타입 글들을 나열할 수 있는 위젯으로 포트폴리오(Portofolio)와 포스트(Posts) 위젯이 있습니다. 둘은 비슷하면서 약간의 차이가 있습니다. 포트폴리오에서는 카테고리나 태그 필터 막대를 표시할 수 있지만, 포스트 위젯에서는 필터바를 표시할 수 있는 옵션이 제공되지 않습니다. 엘리멘터 포트폴리오: 카테고리 필터 표시하기 엘리멘터 프로에서는 Portfolio 위젯을 사용하여 블로그 글이나 커스텀 포스트 타입 글들을 포트폴리오 형식으로 나열할 수 있습니다. 포트폴리오 위젯에 카테고리 필터를 표시하고 CSS를 사용하 avada.tistory.com 포스트 위젯에서는 페이지네이션(페이징)을 표시할 수 있지만 포트폴리오에서는 페이지네이션 옵션이 없습니다. ..

엘리멘터 프로에서는 Portfolio 위젯을 사용하여 블로그 글이나 커스텀 포스트 타입 글들을 포트폴리오 형식으로 나열할 수 있습니다. 포트폴리오 위젯에 카테고리 필터를 표시하고 CSS를 사용하여 스타일을 조정할 수 있습니다. 엘리멘터 포트폴리오: 카테고리 필터 표시하기 그림과 같이 포트폴리오 위젯에 카테고리 필터 바(Filter Bar)를 표시하고 싶은 경우 Portfolio 편집 패널의 Filter Bar 섹션에서 필터 표시줄을 Show를 On으로 설정하면 Taxonomy에서 필터 표시줄에 표시할 항목을 선택할 수 있도록 표시됩니다. 카테고리나, 태그, 사품 카테고리, 상품 태그 등을 선택할 수 있습니다. 위의 그림에서는 카테고리를 선택할 때의 화면을 보여줍니다. CSS를 사용하여 필터바의 스타일을 ..

엘리멘터에서 토글이나 아코디언 위젯을 사용하여 자주 묻는 질문(FAQ) 등을 표시할 수 있습니다. 토글은 개별 항목이 독립적으로 작동하고 아코디언은 한 번에 하나 항목만 열립니다. 이 글에서는 모든 엘리멘터 토글 위젯 항목들이 열린 상태로 표시되도록 설정하는 방법에 대하여 살펴보겠습니다. 모든 엘리멘터 토글 아코디언 위젯 항목이 항상 열린 상태로 표시되도록 설정하는 방법 엘리멘터 페이지 빌더의 모든 토글 위젯 항목들이 열린 상태로 표시하고 싶은 경우 다음과 같은 CSS 코드를 사용할 수 있습니다. .elementor-toggle .elementor-tab-content { display: block !important; } 위의 코드를 사용하면 토글 항목들은 모두 열린 상태가 됩니다. 반면에 아코디언은 ..

네이버 카페에 워드프레스 Salient 테마에 엘리멘터 페이지 빌더를 사용하는 방법에 대한 질문이 올라왔었는데요. 비슷한 질문이 반복적으로 올라와서 페이지 빌더 사용 시 주의할 점에 대하여 살펴보겠습니다. 워드프레스 Salient 테마에서 엘리멘터 페이지 빌더를 사용할 수 있을까? Elementor와 같은 페이지 빌더를 사용하면 코딩 지식이 부족해도 쉽게 사이트를 만들 수 있다는 장점이 있습니다. 얼마 전에 네이버 카페에 워드프레스 Salient 테마에 엘리멘터 프로를 설치하여 사용하는 것에 대한 질문이 올라왔습니다. Salient 테마에는 WPBakery 페이지 빌더(이전 명칭 "비주얼 컴포저")가 설치되어 있습니다. WPBakery 페이지 빌더는 엘리멘터 이전에 인기를 끌었던 유료 페이지 빌더입니다...

워드프레스 엘리멘터 페이지 빌더를 사용하면 코딩 지식이 부족해도 쉽게 원하는 레이아웃의 페이지를 만들 수 있습니다. 상품 페이지나 포트폴리오 등의 페이지를 Elementor를 사용하여 만들고 싶지만 엘리멘터 편집 버튼이 표시되지 않는 경우가 있을 수 있습니다. 이 경우 해당 글 유형에 대하여 엘리멘터를 활성화시키면 엘리멘터를 사용하여 상품 페이지나 포트폴리오 페이지 등을 제작할 수 있습니다. Elementor 페이지 빌더: 글 유형 활성화/비활성화 예를 들어, 새 상품 페이지를 만들려고 할 때 아래 그림과 같이 엘리멘터 "편집하기" 아이콘이 표시되면 "편집하기" 아이콘을 클릭하여 엘리멘터로 상품 페이지를 만들 수 있습니다. 만약 상품 페이지나 포트폴리오 페이지에 엘리멘터 편집 아이콘이 표시되지 않는 경우..

워드프레스 인기 페이지 빌더인 엘리멘터 페이지 빌더의 유료 버전에서는 템플릿을 숏코드로 원하는 곳에 추가할 수 있습니다. 이 방법을 이용하면 엘리멘터 탭 안에 아코디언이나 토글, FAQ, 가격표(Pricing Table) 등을 표시할 수 있습니다. 엘리멘터 템플릿을 원하는 곳에 추가하는 방법 (예: 탭에 토글/아코디언 표시) 엘리멘터 페이지 빌더에서는 탭 기능을 사용하여 각 탭에 여러 가지 콘텐츠를 표시할 수 있습니다. 각 탭 내에 다른 엘리멘터 요소나 섹션을 추가하고 싶은 경우가 있습니다. 예를 들어, 다음 그 avada.tistory.com 엘리멘터 템플릿에 숏코드가 표시되지 않는 경우가 있을 수 있습니다. 이 경우 아래의 내용을 참고해보세요. 엘리멘터 페이지 빌더 템플릿 숏코드가 표시되지 않는 경우..

워드프레스 엘리멘터(Elementor) 페이지 빌더에서는 기기 해상도에 따라 다르게 레이아웃을 설정할 수 있도록 반응형 모드를 지원합니다. 사이트 설정에서 각 기기에 대한 분기점 해상도 범위를 지정할 수 있고, 추가적인 커스텀 분기점(Additional Custom Breakpoints) 기능을 활성화하면 더 많은 기기에 대하여 세부적으로 레이아웃을 지정하는 것도 가능합니다. 엘리멘터 페이지 빌더: 반응형 모드 엘리멘터(Elementor)에서는 기기 해상도에 따라 특정 섹션이나 요소(엘리멘트)를 표시하거나 숨길 수 있는 반응형 옵션을 제공합니다. 해당 요소나 섹션을 선택한 다음, 고급 탭 » 반응형 섹션의 가시성 부분에서 숨기고자 하는 기기 유형을 선택하면 해당 섹션이나 엘리먼트가 선택된 기기에서 표시되..

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

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

인기 워드프레스 페이지 빌더인 엘리멘터 업데이트 시 "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에서 해결되었다고 엘리멘터측에서..