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

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

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

엘리멘터 페이지 빌더에서는 탭 기능을 사용하여 각 탭에 여러 가지 콘텐츠를 표시할 수 있습니다. 각 탭 내에 다른 엘리멘터 요소나 섹션을 추가하고 싶은 경우가 있습니다. 예를 들어, 다음 그림과 같이 FAQ 페이지에서 주제별로 다른 탭에 FAQ 항목을 추가하고 싶을 수 있습니다. (아래 그림은 인기 워드프레스 테마인 Divi 테마의 탭 기능을 사용하여 FAQ 항목들을 탭으로 표시하는 방법에 대한 글에서 인용한 것입니다. Elementor에서도 비슷하게 구현이 가능합니다.) 엘리멘터 템플릿을 원하는 곳에 추가하는 방법 (예: 탭에 토글/아코디언 표시) 엘리멘터 프로에서는 템플릿을 숏코드로 원하는 곳에 자유롭게 추가할 수 있습니다. 예를 들어, FAQ 페이지에 탭 위젯을 추가한 다음, 개별 FAQ 항목들을 ..

워드프레스 검색 시 Search Results for: 문구는 보통 테마의 search.php 파일을 커스텀하거나 Loco Translate와 같은 플러그인을 사용하여 번역할 수 있습니다. 엘리멘터 프로에서 아카이브 페이지 또는 검색 결과 페이지 템플릿을 만든 경우 "Search Results for:" 문구를 Loco Translate 플러그인을 사용하여 번역할 수 없습니다. 엘리멘터 프로를 사용하는 경우 다음과 같은 방법으로 Search Results for: 텍스트를 한글로 바꾸고 검색 결과 아카이브 템플릿을 커스텀할 수 있습니다. 참고로 엘리멘터의 Theme Builder를 통해 Archive(아카이브) 템플릿을 만들면, 검색 시 "검색 결과 아카이브" 템플릿이 없을 경우 "아카이브" 템플릿을 통..

엘리멘터 페이지 빌더의 우커머스 상품(Woocommerce Products) 위젯을 사용하여 우커머스 상품들을 컬럼 형식으로 나열할 수 있습니다. 전체 상품 또는 특정 카테고리 내의 상품들을 표시하거나 세일 중인 상품들이나 추천 상품들을 표시하는 등 다양한 옵션이 제공됩니다. [참고*엘리멘터 프로의 테마 빌더를 사용하면 우커머스 아카이브 페이지와 우커머스 상품 페이지 템플릿을 만들어 커스텀할 수 있습니다. 자세한 정보는 엘리멘터 공식 문서를 참조해보세요.*] 워드프레스 엘리멘터 우커머스 상품 (Woocomerce Products) 위젯 WooCommerce Products 위젯은 Elementor Pro에서 제공되는 기능 중 하나로 특정 카테고리의 상품들이나 할인 중인 상품들을 상품들을 원하는 곳에 나열..

엘리멘터 페이지 빌더(Elementor Website Builder)는 현재 500만 개가 넘는 워드프레스 사이트에 설치되어 사용되고 있는 인기 플러그인입니다. 페이지 빌더에서는 보통 HTML/자바스크립트 코드를 추가할 수 있는 요소를 제공합니다. 엘리멘터(엘레멘토) 페이지 빌더에서도 HTML 코드를 추가할 수 있는 위젯이 제공됩니다. HTTML 코드 추가하기 HTML 코드를 추가하려면 엘리멘츠 탭에서 html로 검색합니다. 그러면 HTML 위젯이 검색 결과에 표시됩니다. HTML 위젯을 끌어다가 원하는 곳에 놓습니다. 그러면 HTML 코드를 추가할 수 있는 상자가 왼쪽에 표시됩니다. 원하는 코드를 추가하도록 합니다. JS/CSS 코드 추가하기 페이지 빌더에서 직접 CSS 코드를 추가하는 기능은 엘리멘터..

워드프레스 인기 페이지 빌더인 엘리멘터 플러그인의 유료 버전인 Elementor Pro에서는 포트폴리오 위젯을 사용하여 글이나 페이지, 커스텀 포트 타입을 포트폴리오 형식으로 표시할 수 있습니다. 이 글에서는 엘리멘터 페이지 빌더의 포트폴리오 위젯에 대해 간략하게 살펴보겠습니다. 워드프레스 Elementor Pro 라이선스 활성화하기 (엘리멘터 프로 설치 및 템플릿 로드) 워드프레스 엘리멘터 페이지 빌더(Elementor Page Builder)는 무료로 사용할 수 있지만 프로 기능과 더 많은 템플릿을 사용하려면 엘리멘터 프로 라이선스를 활성화해야 합니다. 이 글에서는 엘리멘터 avada.tistory.com 워드프레스 엘리멘터 포트폴리오 위젯 워드프레스 테마에서 제공하는 포트폴리오 기능과 엘리멘터의 포..

요즘 나오는 많은 유료 워드프레스 테마에 비주얼 컴포저(Visual Composer)가 기본적으로 탑재되어 나오지만, 사실 VC는 사이트 속도를 크게 떨어뜨릴 뿐만 아니라 다양한 문제를 야기하기도 합니다. 그래서 가급적이면 VC는 피하는 것이 좋을 것 같다는 것이 개인적인 생각입니다. 워드프레스 페이지 빌더의 장점과 단점 무료 페이지 빌더로는 Elementor가 비교적 가볍고 괜찮다는 평이 많네요. 페이지 빌더를 사용하려는 경우 Elementor를 고려해볼 수 있을 것 같습니다. 무료 워드프레스 페이지 빌더 Elementor Page Builder Pro 버전을 이용할 경우 프로 템플릿을 비롯하여 다양한 기능을 이용할 수 있습니다. 블랙 프라이데이 기간 동안 Elementor Pro가 25% 할인 중입니다.