원페이지 홈페이지는 몇 년 전에 유행하던 형식으로 요즘은 잘 사용되지 않습니다. 워드프레스에서는 대부분의 인기 테마에서 원페이지 레이아웃의 데모를 제공하고 있습니다. 그리고 원리를 알면 쉽게 원페이지 포맷의 홈페이지를 만들 수 있습니다.
워드프레스로 원페이지 홈페이지 만들기
아바다 테마, 엔폴드 테마 등의 인기 다목적 워드프레스 테마에는 원페이지 (One Page) 포맷의 데모가 제공됩니다. 다음은 Enfold 테마에서는 제공하는 원페이지 데모 중 일부를 보여줍니다.
두 번째 데모의 경우 스크롤할 때 메뉴가 상단에 고정이 안 되어 사용자 입장에서 이동하기가 조금 불편해 보이네요. 이 경우 메뉴를 고정하는 옵션을 선택할 수 있습니다.
현재 사용 중인 테마에서 원페이지 데모를 제공하지 않는 경우에는 직접 원페이지 레이아웃으로 사이트를 만들 수 있습니다. 원리는 각 섹션에 CSS ID를 지정하고 메뉴에 링크를 추가할 때 #ID를 끝에 붙이는 것입니다. 다음 글을 참고해보시기 바랍니다.
페이지 빌더를 사용하는 경우 쉽게 섹션(Section)에 CSS ID를 지정할 수 있습니다. 예를 들어, 엘리멘터 페이지 빌더에서는 섹션 편집 (Edit Section) > 고급 (Advanced) 탭에서 CSS ID와 CSS 클래스를 지정할 수 있습니다.
위의 그림을 보면 쉽게 이해가 될 것입니다. 동영상으로 확인하면 Elementor 페이지 빌더에 CSS ID를 지정하는 것이 보다 쉽게 이해할 수 있을 것입니다.
페이지 빌더를 사용하는 경우 비슷한 방식으로 지정이 가능합니다.
마치며
앞서 언급했지만 원페이지 홈페이지는 SEO(검색엔진최적화)에 불리하므로 그다지 추천하지는 않습니다만, 원페이지 형식으로 만들고 싶은 경우 테마에서 제공하는 데모를 사용하거나 페이지 빌더를 이용하는 경우 쉽게 섹션에 ID를 지정하여 원페이지 레이아웃으로 사이트를 만들 수 있습니다.