섹션을 추가하는 방법은 크게 두 가지가 있습니다.
편집 화면에서 섹션을 선택한 후 활성화되는 섹션 추가 버튼을 클릭합니다. 선택한 기존 섹션의 위 혹은 아래에 추가가 가능합니다.
왼쪽 상단 섹션 버튼 클릭 후, 빈 섹션 추가를 클릭하거나 샘플 섹션을 선택하여 추가합니다. 나인하이어팀이 준비해 둔 샘플 섹션을 활용하면 조금 더 빠르게 쉽게 채용 홈페이지를 편집하실 수 있습니다.
섹션을 선택하면, 우측 상단에 섹션 편집 툴바가 나타납니다. 이 툴바의 버튼을 활용해 섹션 설정, 섹션 고정 및 이동, 다른 페이지로 이동, 복사, 삭제 등이 가능합니다.
톱니바퀴 모양의 설정 버튼을 클릭하면 섹션 설정 모달이 나타납니다. 이 모달에서 섹션 명을 설정할 수 있고, 전체 화면 사이즈에 맞춤 설정과 배경 설정, 오버레이 설정도 가능합니다.
편집 중인 섹션명을 설정할 수 있습니다. 특정 섹션으로 이동시킬 수 있는 링크 설정에 활용됩니다. 어어지는 이미지와 내용을 참고해 주세요.
위 이미지처럼 링크 설정이 가능한 블록(버튼, 이미지, 텍스트 등)에는 섹션 이동을 설정할 수 있습니다. 이때 특정 섹션을 찾을 때 위에서 설정한 섹션명이 활용됩니다.
이 설정을 켜면, 채용 홈페이지에 접속하는 사용자의 화면 비율을 기준으로 이미지나 동영상의 비율이 적용됩니다.
위 이미지의 예시(오른쪽)를 보면, 화면 전체 사이즈에 섹션이 맞춰지는 것을 확인할 수 있습니다.
이 설정은 사용자의 화면의 전체 화면을 가득 채우는 방식으로 적용됩니다.
그러므로, 사용자의 화면 가로 세로/ 비율과 이미지(동영상)의 가로/세로 비율이 다를 경우 이미지나 동영상의 가장자리로부터 가로나 세로의 일정 부분이 표시되지 않을 수 있습니다. 또는 화면의 비율에 따라 확대되는 것처럼 보일 수 있습니다.
중요한 컨텐츠는 넣지 않고 추상적인 배경 이미지로 활용하는 것을 추천합니다.
섹션 배경은 설정한 색, 이미지 혹은 동영상 위에 텍스트나 버튼 등 다양한 블록을 층층이 쌓아 디자인할 수 있는 '배경' 역할을 합니다. 또한 여백 블록을 활용하면 섹션 전체를 빈틈 없이 배경으로 꽉 채울 수 있습니다. 이미지 위에 다른 요소를 얹을 수 없는 이미지 블록과 달리, 여러 콘텐츠를 결합하여 자유로운 화면 구성이 가능합니다.
같은 페이지 내에서도 섹션별로 다른 색, 이미지, 동영상을 적용할 수 있습니다.
섹션 배경 색의 경우, 컬러 픽커를 클릭하여 단색 혹은 그라데이션으로 설정이 가능합니다.
이미지와 동영상은 파일을 업로드하는 방식으로 설정합니다. 동영상 블록과 달리 섹션 배경의 동영상 설정은 링크가 아닌 파일 업로드 방식이며, 50MB 이하의 제한이 있습니다. 업로드가 가능한 동영상의 확장자는 “.mp4 .avi .mkv .wmv .mov .flv .m4v”입니다.
섹션 배경을 설정했는데 왜 미리보기나 실제 채용 홈페이지에서는 보이지 않나요?
채용 홈페이지 섹션 배경에 색, 이미지 혹은 동영상을 설정했음에도 미리보기나 실제 채용 홈페이지에 보이지 않는다면, 해당 섹션 내부에 추가된 블록이 있는지 확인해 주세요. 섹션 내에 블록이 하나도 없을 경우 배경 이미지는 노출되지 않습니다.
섹션 배경만 단독으로 노출하고 싶을 때 설정 방법
배경이 설정된 섹션에 [레이아웃] 추가
해당 레이아웃 안에 [여백] 블록 삽입
여백 블록의 높이를 조절하면, 조절한 만큼 배경 이미지가 화면에 노출
섹션의 배경으로 지정된 색, 이미지, 동영상 등에 오버레이 색상을 입혀 섹션 배경보다 그 위에 표현된 컴포넌트들이 강조되는 효과를 줄 수 있습니다.
섹션 선택 후 표시되는 옵션 중 [📌고정 핀]을 클릭하면 해당 섹션을 화면의 상단에 고정시킬 수 있습니다.
해당 섹션이 화면에 노출되기까지는 스크롤이 진행되고, 해당 섹션이 화면의 상단에 도달한 후에는 섹션이 화면 상단에 고정되며, 아래쪽 섹션만 스크롤이 진행됩니다.
상단에 상시 노출하고 싶은 내용이 있다면 섹션 고정 기능을 활용할 수 있습니다.