워드프레스 The7 테마 헤더 투명 설정하기

워드프레스 인기 테마 중 하나인 The7 테마는 아바다와 같은 다른 인기 테마보다 훨씬 저렴한 39달러에 판매되고 있어 꾸준히 주간 베스트셀링 테마 리스트에 이름을 올라고 있습니다. 더세븐 테마는 비주얼 컴포저 (WPBakery Page Builder)를 기본 탑재했지만, 최근에는 엘리멘터 페이지 빌더용 데모도 제공하고 있습니다. 더세븐 테마를 사용하는 경우 비주얼 컴포저보다 엘리멘터 페이지 빌더를 선택하는 것이 바람직한 것 같습니다.

이 글에서는 The7 테마에서 헤더를 투명하게 설정하는 방법에 대해 살펴보겠습니다.

워드프레스 The7 테마 헤더 투명 설정하기

더세븐 테마에서는 다양한 테마 옵션과 기능을 제공하고 WPBakery Page Builder, 레볼루션 슬라이더, Go Pricing, Convert Plus 등 몇 가지 유료 플러그인이 번들로 포함되어 있습니다.

개인적으로는 WPBakery 페이지 빌더('비주얼 컴포저')는 선호하지 않습니다. 비주얼 컴포저는 사이트 속도를 느리게 할 수 있습니다. 다행히 The7 테마에서는 Elementor 페이지 빌더용 데모를 제공하기 시작했습니다. Elementor를 선택하는 경우 WPBakery Page Builder는 반드시 제거하시기 바랍니다.

더세븐 테마 헤더 투명 설정 방법

더세븐 테마에서는 개별 페이지에 대하여 투명 헤더를 설정할 수 있습니다. 투명 헤더 기능은 아바다 등의 테마에서도 제공됩니다.

아바다 테마의 헤더/메뉴를 투명하게 설정하는 방법

더세븐 테마에서 페이지에 투명 헤더를 설정하려면 관리자 페이지로 로그인한 후에 해당 페이지를 브라우저에서 방문하도록 합니다.

그런 다음 상단의 "페이지 편집" (Edit Page)을 클릭합니다.

그러면 기본 에디터(예: 구텐베르크)에서 페이지가 열립니다. 본문 아래로 마우스를 스크롤하여 내려서 Page Header Options (페이지 헤더 옵션) 섹션으로 이동합니다.

페이지 헤더 옵션에서 Transparent (투명)를 선택합니다. 그러면 숨겨져 있던 '투명' 관련 옵션이 표시됩니다.

Transparent background opacity 슬라이더를 왼쪽으로 끌어서 값이 '0'이 되도록 설정합니다. 저장한 다음 페이지를 리로드하면 헤더가 투명으로 바뀐 것을 확인할 수 있습니다.

투명 헤더 설정 전:

투명 헤더 설정 후:

더세븐 테마에서는 각 페이지별로 투명 헤더 설정이 가능합니다. 

참고로 카테고리 페이지 등 페이지의 헤더를 투명하게 설정하려는 경우 Theme Options > Page Titles를 클릭하고 Style 섹션을 이동한 다음, Background Image 옵션을 Enabled로 설정하고 이미지를 지정하거나 업로드합니다.

그런 다음 Header 섹션에서 Transparent를 헤더 스타일로 선택하고 헤더 색상을 투명하게 (위에서와 동일한 방법) 설정합니다.

이렇게 설정하면 모든 페이지(카테고리 페이지 포함)에서 페이지 타이틀 부분에 지정한 이미지가 표시되고 헤더가 투명하게 됩니다. 개별 페이지에서는 위에서 설명한 방법대로 개별 페이지 내에서 헤더 옵션을 지정할 수 있습니다.

마치며

이상으로 인기 워드프레스 테마 중 하나인 The7에서 헤더 섹션(메뉴 포함)을 투명하게 설정하는 방법에 대해 살펴보았습니다. 설정을 변경한 후에 실제 페이지에 적용되지 않으면 캐시 플러그인의 캐시를 삭제하고 브라우저 캐시를 삭제한 후에 테스트해보시기 바랍니다.

참고

워드프레스 아바다 테마와 데모 설치 및 제거 - 워드프레스 기본

워드프레스 Elementor 페이지 빌더로 만들어진 페이지를 수정하는 방법

새로운 워드프레스 페이지 빌더 Brizy, 제2의 엘리멘터가 될 수 있을까?