사이트의 포트폴리오 페이지와 프로젝트를 맞춤 설정하는 방법을 살펴보세요.

포트폴리오 페이지는 방문자를 프로젝트로 연결하는 스타일리시한 랜딩 페이지입니다. 포트폴리오 페이지는 브랜드와 스타일에 맞게 맞춤 설정이 가능합니다. 이 가이드에서 포트폴리오 페이지와 개별 프로젝트의 스타일 옵션을 찾는 방법을 살펴보세요. 포트폴리오 페이지를 만들고 콘텐츠를 추가하려면 포트폴리오 페이지로 이동하세요.

포트폴리오 페이지 VS 포트폴리오 프로젝트

포트폴리오 페이지는 크게 두 부분으로 구성됩니다. 하나는 방문자가 포트폴리오를 살펴볼 때 클릭하는 대표 이미지 그리드나 링크 목록을 생성하는 메인 포트폴리오 페이지이고, 다른 하나는 이러한 링크가 연결되는 개별 프로젝트로 여기에서 콘텐츠를 추가할 수 있습니다.

스타일 옵션 열기

포트폴리오 페이지와 프로젝트의 스타일은 두 군데에서 지정할 수 있습니다.

• 포트폴리오 페이지 - 포트폴리오 페이지에서 편집을 클릭한 다음 포트폴리오 섹션에서 연필 아이콘을 클릭합니다.
• 프로젝트 - 포트폴리오 페이지에서 프로젝트를 클릭하여 열고 편집을 클릭한 다음 스타일을 지정하려는 섹션에서 연필 아이콘을 클릭합니다. 각 프로젝트는 여러 섹션으로 구성되어 있으며, 각 섹션은 고유한 스타일 옵션을 가지고 있습니다.

포트폴리오 페이지

포트폴리오 페이지는 모든 프로젝트를 대표 이미지 또는 텍스트 링크로 표시하며, 방문자는 이를 클릭해 개별 프로젝트를 열 수 있습니다.

포트폴리오 섹션 스타일에서 다음 세부 사항을 사용자 지정할 수 있습니다.

• 형식 - 포트폴리오 페이지의 레이아웃을 설정합니다. 그리드 레이아웃과 호버 레이아웃에는 고유한 형식 옵션이 있습니다.
• 배경 - 프로젝트 링크에 배경 이미지나 배경 비디오, 배경 아트를 추가합니다.
• 색상 - 사이트 색상을 설정하거나 포트폴리오의 섹션 테마를 변경합니다.

명심할 사항:

• 이러한 변경 사항은 동일한 레이아웃을 사용하는 모든 포트폴리오 페이지에 영향을 미칩니다.
• 특정 레이아웃의 변경 사항은 새 레이아웃으로 변경하는 경우에도 저장됩니다. 따라서 이전 레이아웃으로 돌아가면 설정이 복원됩니다.
• 포트폴리오 페이지에 있는 프로젝트의 수에 따라 일부 스타일 조정이 레이아웃에 영향을 미치지 않을 수 있습니다. 예를 들어, 프로젝트가 많은 마우스오버: 배경 레이아웃의 경우, 특정 높이가 되어야 프로젝트 링크를 모두 표시할 수 있어 높이 조정이 눈에 띄는 효과를 내지 못할 수 있습니다. 이 경우, 대신 수직 링크 간격 조정을 사용하세요.

그리드 레이아웃 서식 지정

그리드 레이아웃은 프로젝트의 대표 이미지를 그리드 형식으로 표시합니다. 방문자는 이미지나 제목 텍스트를 클릭해 프로젝트를 열 수 있습니다. 섹션 스타일의 서식 탭에 있는 옵션은 선택한 그리드 레이아웃에 따라 다르게 표시됩니다.

마우스오버 레이아웃 서식 지정

마우스오버 레이아웃은 프로젝트를 링크 목록으로 표시하며, 커서를 올리면 대표 이미지가 표시됩니다. 방문자는 링크를 클릭해 프로젝트를 열 수 있습니다. 섹션 스타일의 서식 탭에 있는 옵션은 선택한 마우스오버 레이아웃에 따라 다르게 표시됩니다. 마우스오버 레이아웃의 프로젝트 대표 이미지에는 반투명 오버레이가 설정되어 있습니다. 반투명 오버레이 효과는 높이거나 제거할 수 없습니다.

프로젝트 제목 텍스트

각 프로젝트의 제목은 메인 포트폴리오 페이지에 표시되며 레이아웃에 따라 대표 이미지의 아래, 대표 이미지 위에 겹쳐서, 또는 링크 목록에 표시됩니다. 제목 텍스트는 프로젝트 설정에서 편집할 수 있습니다. 제목 텍스트는 사이트 전체의 글꼴과 색상 스타일을 따릅니다.

제목 글꼴

프로젝트 제목 글꼴의 스타일을 지정하는 방법은 다음과 같습니다.

1. 페이지 편집 도중 사이트 스타일 열기를 클릭한 후 글꼴을 클릭합니다.
2. 표제를 클릭합니다.
3. 글꼴 모음을 선택하고 다른 스타일 설정을 변경합니다.
4. 크기에서 표제 슬라이더를 사용해 제목 크기를 조정합니다.

사용할 수 있는 슬라이더는 포트폴리오 페이지 레이아웃에 따라 다릅니다.

• 그리드: 심플 - 표제 4
• 그리드: 오버레이 - 표제 3
• 마우스오버 레이아웃 - 표제 1

표제의 서식을 변경하면 동일한 서식을 사용하는 가진 모든 텍스트가 변경됩니다. 제목 텍스트의 글꼴과 크기를 개별적으로 변경하려면 스타일 할당을 클릭하고 레이아웃에 맞는 제목 조정을 찾아 스타일과 크기를 사용자 지정으로 변경하세요.

변경 사항을 마친 후 저장을 클릭하여 변경 사항을 저장하고 계속 편집하거나, 나가기를 클릭한 후 저장을 클릭하여 편집기를 닫으세요.

제목 색상

프로젝트 제목 색상의 스타일을 지정하는 방법은 다음과 같습니다.

1. 페이지 편집 도중 사이트 스타일을 열고 색상을 클릭합니다.
2. 포트폴리오 섹션의 색상 구성표에서 연필 아이콘을 클릭합니다.
3. 아래로 스크롤해 레이아웃과 일치하는 포트폴리오 섹션을 찾습니다.
4. 프로젝트 제목 조정을 사용해 색상을 변경합니다. 각 포트폴리오 레이아웃에는 고유한 프로젝트 제목 조정 기능이 있습니다.
5. 저장을 클릭하여 변경 사항을 저장하고 계속 편집하거나, 나가기를 클릭한 후 저장을 클릭하여 편집기를 닫으세요.

구분 기호

인라인 링크를 사용하는 마우스오버 레이아웃에서는 '구분 기호'나 구두점을 추가해 프로젝트 링크를 시각적으로 구분할 수 있습니다.

구분 기호를 선택하거나 숨기는 방법은 다음과 같습니다.

1. 포트폴리오 페이지에서 편집을 클릭합니다.
2. 포트폴리오 섹션에 커서를 올리고 연필 아이콘을 클릭합니다.
3. 서식 탭에서 링크 형식을 인라인으로 설정합니다.
4. 아래로 스크롤해 구분 기호를 클릭한 후 옵션 중 하나를 선택합니다. 구분 기호를 숨기려면 없음을 선택합니다.
5. 저장을 클릭하여 변경 사항을 저장하고 계속 편집하거나, 나가기를 클릭한 후 저장을 클릭하여 편집기를 닫으세요.

프로젝트

프로젝트는 페이지 섹션으로 구성되어 있습니다. 따라서 스타일 지정 옵션은 어떤 섹션을 추가하느냐에 따라 달라집니다. 블록 섹션, 갤러리 섹션 또는 자동 레이아웃을 추가할 수 있습니다.

섹션에 커서를 올렸을 때 표시되는 연필 아이콘을 클릭해 섹션의 스타일을 지정합니다. 자세한 내용은 스타일 변경하기를 참고하세요.

프로젝트 페이지 매김

포트폴리오의 다음 프로젝트와 이전 프로젝트로 연결되는 링크는 각 프로젝트의 하단에 표시됩니다. 모든 포트폴리오 페이지는 서로 다른 레이아웃을 사용하더라도 동일한 페이지 매김 스타일을 사용합니다.

페이지 매김 글꼴

페이지 매김 글꼴 스타일을 지정하는 방법은 다음과 같습니다.

1. 페이지 편집 도중 사이트 스타일 열기를 클릭한 후 글꼴을 클릭합니다.
2. 표제를 클릭합니다.
3. 글꼴 모음을 선택하고 다른 스타일 설정을 변경합니다.
4. 크기에서 표제 3 슬라이더를 사용해 제목 크기를 조정합니다.

표제의 서식을 변경하면 동일한 서식을 사용하는 가진 모든 텍스트가 변경됩니다. 제목 텍스트의 글꼴과 크기를 개별적으로 변경하려면 스타일 할당을 클릭하고 포트폴리오: 아이템에서 페이지 매김 조정을 찾아 스타일과 크기를 사용자 지정으로 변경하세요.

변경 사항을 마친 후 저장을 클릭하여 변경 사항을 저장하고 계속 편집하거나, 나가기를 클릭한 후 저장을 클릭하여 편집기를 닫으세요.

페이지 매김 색상

페이지 매김 색상은 프로젝트 하단 섹션의 색상 구성표를 따릅니다. 프로젝트 하단 섹션끼리 서로 다른 색상 테마를 사용하는 경우, 프로젝트마다 페이지 매김 색상이 다를 수 있습니다.

페이지 매김 색상의 스타일을 지정하는 방법은 다음과 같습니다.

1. 페이지 편집 도중 사이트 스타일을 열고 색상을 클릭합니다.
2. 포트폴리오 섹션의 색상 구성표에서 연필 아이콘을 클릭합니다.
3. 아래로 스크롤해 포트폴리오: 아이템 조정을 찾습니다.
4. 프로젝트 페이지 매김 제목 조정을 사용해 제목 텍스트를 변경하고 프로젝트 페이지 매김 아이콘 조정을 사용해 페이지 매김 아이콘을 변경합니다.
5. 저장을 클릭하여 변경 사항을 저장하고 계속 편집하거나, 나가기를 클릭한 후 저장을 클릭하여 편집기를 닫으세요.

변경 사항은 동일한 색상 구성표를 사용하는 모든 섹션에 영향을 미칩니다.

글꼴과 색상

포트폴리오 페이지와 프로젝트의 색상과 글꼴은 사이트 전체의 글꼴 및 색상 조정을 따릅니다. 포트폴리오 페이지 섹션과 프로젝트의 섹션의 색상 구성표를 섹션 스타일 에디터에서 변경할 수도 있습니다.

자신의 포트폴리오 색상 구성표에서 레이아웃에 맞는 포트폴리오 색상 조정을 사용하세요. 각 프로젝트의 마지막 섹션의 색상 구성표에서 포트폴리오: 항목 조정을 사용하여 각 프로젝트 하단의 페이지 번호를 스타일링하세요. 이는 프로젝트마다 하단 섹션이 사용하는 색상 구성표에 따라 다를 수 있습니다. 

모바일

큰 브라우저에서의 열 수나 링크 서식과 관계없이 모바일 기기나 태블릿에서는 포트폴리오 레이아웃이 하나의 열로 쌓입니다.

대부분의 모바일 브라우저에서는 마우스오버 효과가 지원되지 않습니다. 따라서 마우스오버 후 제목이 표시되도록 설정된 그리드: 오버레이 레이아웃을 사용하는 경우, 모바일 기기 방문자에게 제목이 표시되지 않을 수 있습니다.

그리드: 오버레이 레이아웃의 제목이 모든 기기에서 표시되도록 하는 방법은 다음과 같습니다.

1. 포트폴리오 페이지에서 편집을 클릭한 후 포트폴리오 섹션에 커서를 올리고 연필 아이콘을 클릭합니다.
2. 서식 탭의 텍스트 표시 드롭다운 메뉴에서 마우스오버 전을 선택합니다.
3. 저장을 클릭하여 변경 사항을 저장하고 계속 편집하거나, 나가기를 클릭한 후 저장을 클릭하여 편집기를 닫으세요.