프로필 섹션은 여러분의 작품에 참여하는 사람들을 소개하기에 완벽한 방법입니다. 소개 페이지, 팀 쇼케이스 또는 바이오 섹션이 레이아웃을 사용하면 개인에게 우아함과 명확성을 표현할 수 있습니다.
각 사람의 특징을 강조하세요 사진, 이름, 역할, 스토리 개인적이고 매력적인 형식으로 제공됩니다. 크리에이티브 팀과 협력자부터 연사, 멘토, 기여자까지, 프로필 섹션은 브랜드나 프로젝트에 얼굴을 비추어 청중과 더 깊은 관계를 구축하는 데 도움을 줍니다.
간단한 사용자 정의 옵션과 깔끔하고 반응성 있는 디자인을 갖춘 프로필 섹션을 통해 귀하의 업무를 가능하게 하는 사람들을 쉽게 소개할 수 있습니다.
이 기사는 다음 주제들로 구성되어 있습니다 :
프로필 섹션
프로필 섹션은 사진, 이름, 직책 또는 직함, 그리고 간략한 설명을 추가할 수 있는 개별 프로필 모음입니다. 또한, 각 프로필과 관련된 상세 페이지나 외부 링크로 방문자를 안내하는 링크나 버튼을 추가할 수도 있습니다.
프로필 섹션 추가
- 페이지에 섹션을 추가할 수 있습니다. 이미 존재하는 페이지에 섹션을 추가하거나 새 페이지 만들기 귀하의 웹사이트 내에서.
- 귀하의 페이지에서은 클릭 파란색 + 아이콘 추가 새 섹션 귀하의 페이지에.
- 이제 섹션 카테고리 왼쪽에
- 선택 프로필 및 바이오링크 (1) 카테고리를 클릭 후 프로필 선택할 수 있는 탭(2) 다른 레이아웃 의 프로필 (3) 섹션.
목록 항목 추가 및 편집
목록 항목 추가
섹션을 추가한 후:
- 온 클릭 이미지 목록 편집 (1) 버튼을 눌러 목록 항목 패널을 엽니다.
- 온 클릭 항목 추가(2) 버튼을 눌러 새 목록 항목을 추가합니다.
- 당신은 선택할 수 있습니다 D복제 또는 삭제 (3) 목록 항목.
목록 항목 편집
편집할 목록 항목을 클릭합니다. 특정 목록 항목 편집 옵션이 열립니다.
여기에서 다음을 수행할 수 있습니다.
- 1차 및 XNUMX차 이미지 업로드/제거 (XNUMX)
당신은 XNUMX 차 이미지 함께 기본 이미지 각 목록 항목에 대해. 사용자가 항목 위에 마우스를 올리면 보조 이미지가 표시되어 기본 이미지를 대체합니다. 또한 다음을 설정할 수 있습니다. 이미지 강조 색상, 이미지에 호버하면 표시됩니다. - 추가 할 Title (2), 자막 (3), 및 설명 (4) 목록 항목의.
- 선택한 레이아웃에 따라 특정 목록 항목에서 자막 및 설명 옵션을 찾지 못할 수 있습니다.
설명을 추가하기 전에 확인하십시오. 이 문서를 참조하십시오.
5. 클릭 시 액션
개별 항목의 클릭 동작을 사용자 정의할 수 있습니다. 프로필 섹션. 사용 가능한 옵션은 다음과 같습니다.
- 링크로 이동
이 옵션을 선택하면 다음이 열립니다. 링크 빌더, 이 항목에 하이퍼링크를 추가할 수 있습니다. 이 링크는 사용자를 웹사이트 내의 다른 페이지나 외부 URL로 안내할 수 있습니다. 더 많이 알아라. about 링크 빌더. - 라이트박스에서 열기
이 옵션은 항목을 확대하여 표시합니다. 라이트 박스 클릭하면 보기가 나타납니다. 이 모드에서는 부제 기술설명 해당 항목과 관련된 내용은 그리드 보기에는 나타나지 않지만 라이트박스 모드에서는 표시됩니다. - 조치 없음
이 옵션을 선택하면 항목을 클릭할 수 없게 됩니다. 선택하면 항목을 클릭해도 아무런 동작이 트리거되지 않습니다.
6. 새 창에서 링크 열기: 다음에서 열리도록 링크 설정 새 탭이나 같은 탭에서. 이것은 다음과 같은 경우에만 표시됩니다. 링크로 이동 옵션이 선택되었습니다 클릭 시 동작 메뉴를 선택합니다.
7. 버튼 및 아이콘: 모든 유형 추가 (링크) 목록 항목에. 버튼/이미지 링크/소셜 아이콘/텍스트 링크를 추가할 수 있습니다. 상세보기.
8. 카드 스타일 오버라이드
섹션에서 글로벌 카드 스타일 설정을 재정의할 수 있습니다. 스타일 설정 프로필 섹션에서 각 항목의 카드를 개별적으로 사용자 지정할 수 있습니다. 이렇게 하면 목록 항목마다 고유한 스타일을 적용하여 더욱 효과적으로 사용자 지정할 수 있습니다.
상세보기 동적 섹션의 카드 옵션에 대한 정보입니다.
9. 모양 스타일 재정의
프로필 섹션에서 각 이미지에 개별적으로 다른 모양을 지정하려면 재정의 옵션을 사용하면 모든 항목의 시각적 스타일을 더 효과적으로 제어할 수 있습니다. 상세보기 셰이프 마스크에 대하여.
10. 저장: 사용자 지정을 한 후 변경 사항을 저장합니다.
- 사용 카드 옵션에서 스타일 설정 개별 항목에 맞게 카드를 재정의하고 사용자 정의합니다.
- 사용 셰이프 마스크 옵션에서 스타일 설정 각 항목에 대해 모양에 대한 스타일을 별도로 지정합니다.
작동 중인 이미지 목록 항목 편집을 참조하십시오.
시퀀스 목록 항목
- 목록 항목을 쉽게 드래그 앤 드롭하여 순서를 변경할 수 있습니다.
작동 중인 이미지 목록 항목의 시퀀싱을 참조하십시오.
목록 항목 삭제
목록 항목을 추가한 후에는 항목을 수정하고 삭제할 수 있습니다.
- 온 클릭 . 이미지 목록 항목 옆에 있는 아이콘.
- 네, 클릭 . 확인 팝업의 버튼.
- 마지막으로, 저장 당신의 변경.
작동 중인 이미지 목록 항목 삭제를 참조하십시오.
한번 삭제된 목록 항목은 복구할 수 없습니다.
프로필 섹션의 요소 관리
이미지 목록 섹션에는 다음이 포함됩니다. 요소 탭 섹션 내의 다양한 요소의 가시성을 쉽게 관리할 수 있게 해줍니다. 간단한 토글 스위치를 사용하면 요소 자체를 삭제하거나 수정하지 않고도 특정 요소를 활성화하거나 비활성화할 수 있습니다.
- 온 클릭 이미지 목록 편집 (1) 버튼.
- 선택 요소 (2) 탭.
- 변경 사항을 적용한 후에는 찜하기 (3) 버튼.
섹션 옵션
- 헤드라인 표시: 이미지 목록 섹션의 헤드라인 표시 여부를 설정합니다.
- 단추 표시: 버튼이 섹션 수준에 표시되는지 여부를 제어합니다.
아이템 옵션
- 이미지 표시: 이미지의 표시 여부를 전환합니다.
- 제목 표시: 제목 표시 여부를 제어합니다.
- 자막 표시: 자막을 활성화하거나 비활성화합니다.
- 설명 표시: 항목 설명의 가시성을 관리합니다.
- 단추 표시: 개별 항목에 대한 버튼을 표시할지 여부를 결정합니다.
섹션 레이아웃
- 온 클릭 이미지 목록 편집 (1) 버튼.
- 선택 레이아웃 (2) 탭.
- 클라임웍스와 함께 하늘과 닿는 여정을 시작하세요 귀하의 섹션에 대한 레이아웃 및 찜하기 (3) 변경 사항.
전체 너비 섹션/탭 목록 섹션을 만들려면 25~29 범위의 레이아웃을 선택하세요.
- 페이지에 탭 목록 레이아웃을 쉽게 추가할 수 있습니다.
- 가로 탭/세로 탭 레이아웃 중에서 선택할 수 있는 옵션이 있습니다.
- 비교 기반 섹션을 만드는 데 도움이 됩니다.
섹션 스타일 지정
- 를 클릭하십시오 이미지 목록 편집 (1) 버튼을 클릭합니다.
- 선택 스타일 (2) 탭.
- 섹션 요소의 스타일을 변경하고 저장 (3) 당신의 변경.
섹션에 대한 여러 스타일 옵션이 있습니다.
디스플레이
- 로 선택 항목 표시 in 행과 열 or 회전 목마
- 당신이 선택한 경우 행과 열 옵션을 선택하면 목록 항목이 행과 열로 정렬됩니다. 이 경우 행과 열의 수를 지정해야 합니다.
- 당신이 선택한 경우 회전 목마 옵션을 선택하면 목록 항목이 슬라이드쇼로 표시됩니다. 더 많이 알아라..
- 설정 열 수 이미지 목록의 경우. 1~10열 중에서 선택할 수 있습니다.
- 지정 열 사이의 공간 목록 항목 중.
- 지정 행 사이의 공백 목록 항목 중.
1단계에서 회전판 옵션을 선택한 경우 다음과 같은 추가 옵션이 표시됩니다.
- 부드러운 스크롤 활성화: 회전형 리스트 내에서 항목을 지속적으로 스크롤하여 원활하고 시각적으로 매력적인 경험을 제공합니다.
- 자동 슬라이드: 사용자 상호 작용 없이 슬라이드를 자동으로 회전합니다.
- 자동 재생 진행률 표시: 자동재생이 활성화되어 있는 동안 진행률 표시기를 표시하여 가시성을 높입니다.
- 자동 재생 지연: 자동 재생이 활성화되어 있을 때 각 슬라이드 전환 사이의 시간 간격을 설정합니다.
- 캐러셀 루프: 슬라이드를 연속적으로 반복할 수 있으므로 마지막 슬라이드 이후에 회전형 슬라이드가 원활하게 다시 시작됩니다.
- 캐러셀 컨트롤: 선택 탐색 컨트롤. 컨트롤 없음, 화살표 - 하단 중앙/오른쪽 상단/오른쪽 하단, 셰브론, 점 및 수평 스크롤 중에서 선택할 수 있습니다.
- 페이드 에지: 회전목마의 가장자리에 미묘한 페이딩 효과를 적용합니다. 뷰에 들어오거나 나갈 때 이미지를 부드럽게 혼합하여 사용자 경험을 향상시킵니다.
모바일 디스플레이
- 수를 설정 그리드 기둥 모바일 장치용. 최대 3개 열까지 설정할 수 있습니다.
- 정의 간격 그리드 사이(픽셀 단위).
Studio 설정에 따른 장치별 열 레이아웃:
조정
- 정렬 콘텐츠를 가로로 이미지 목록에서. 왼쪽, 오른쪽 또는 가운데 정렬로 설정할 수 있습니다.
- 정렬 콘텐츠를 세로로 이미지 목록에서 상단, 중앙, 하단 정렬로 설정할 수 있습니다.
- 선택 콘텐츠 순서 즉, 먼저 표시될 목록 항목의 이미지 또는 관련 텍스트입니다.
텍스트 크기
- 온 클릭 텍스트 스타일 변경 방문하기 버튼 디자인 섹션 글꼴 크기와 스타일을 관리하세요.
- 설정 Title 섹션의 목록 항목에 대한 글꼴 스타일.
- 설정 부제 섹션의 목록 항목에 대한 글꼴 스타일.
- 기본값 설정 기술설명 섹션의 목록 항목에 대한 글꼴 스타일.
- 이 옵션을 활성화하려면 어떤 숫자든 애니메이션 효과 적용 현재의 Title 부제 입력 필드입니다. 이 기능을 켜면 숫자 값이 동적인 카운팅 애니메이션과 함께 표시되어 시각적으로 더욱 매력적입니다.
간격
- 지정 이미지 폭 목록 항목의 경우.
- 지정 콘텐츠 너비 목록 항목에 대해.
- 지정 섹션 제목 아래 공간 px에서.
- 지정 이미지 아래 공간 목록 항목의 (%).
- 지정 제목 아래 공간 목록 항목의 (%).
- 지정 자막 아래 공간 목록 항목의 (%).
섹션 제목
- 수평 정렬 섹션 헤드라인 텍스트입니다. 왼쪽, 가운데, 오른쪽으로 설정할 수 있습니다.
- 활성화/비활성화 분할기 섹션 제목과 섹션 내용 사이.
- 설정 디바이더의 두께 (픽셀 단위).
- 지정 구분선 색상 색상 선택기에서.
- 선택 구분선 스타일 드롭 다운에서
- 설정 헤드라인 너비 섹션 제목이 표시되는 너비를 정의합니다. 최소 50%부터 시작합니다.
이미지
- 선택 I마법사 자르기 목록 항목의 경우. 이미지를 정사각형, 원형, 가로, 세로, 원본으로 설정할 수 있습니다.
- 목록 항목의 각 측면에 대해 공통 모서리 반경 또는 다른 모서리 반경을 갖도록 선택하고 C반경 목록 항목 이미지 중. 더 많이 알아라..
사용법 - 모서리 반경 필드에서 다양한 모양의 목록 항목 이미지를 만들 수 있습니다. 여기서 500px를 지정하면 이미지가 원 모양으로 표시됩니다.
- 분할 모서리를 선택한 경우 각 모서리에 대해 서로 다른 모서리 반경을 설정할 수 있습니다.
셰이프 마스크
- 모양 마스크: 이 토글을 활성화하면 이미지 목록 섹션의 이미지에 모양 마스크를 적용할 수 있습니다. 활성화하면 선택한 모양이 해당 모양에 시각적으로 잘립니다.
- 모양 선택: 미리 정의된 다양한 모양 중에서 선택하여 이미지에 적용할 수 있습니다. 둥근 모양, 마름모 모양, 물방울 모양 등 독특한 모양으로 이미지를 표시하여 콘텐츠를 창의적으로 꾸밀 수 있습니다.
- 뻗기: 이 옵션을 활성화하면 선택한 도형이 이미지 컨테이너에 더 잘 맞도록 늘어납니다. 이렇게 하면 도형이 사용 가능한 공간에 비례하여 채워져 다양한 화면 크기에 맞춰 시각적 정렬이 향상됩니다.
이미지 호버 시
- 선택 이미지 호버 색상 너는 악센트 색상 또는 될 지정. 선택했다면 악센트 색상을 지정한 다음 불투명각 항목의 악센트 색상을 지정할 수 있습니다. 항목 편집 패널.
- 당신이 선택한 경우 색상 지정 옵션을 설정한 다음 오버레이 색상 및 불투명도.
- 설정 오버레이 텍스트 색상 호버하면 표시됩니다.
- 로 선택 목록 항목 이미지에 애니메이션 적용 마우스를 올리면 예를 클릭합니다. 라이브 페이지에서 이 기능을 확인하십시오..
- 선택 애니메이션 스타일 커서를 이미지 위로 가져가면 이미지가 표시됩니다.
- 허용할지 여부를 선택하세요 이미지 전환 호버 여부.
- 를 선택 전환 스타일 호버 전환을 위해. 사용 가능한 옵션은 페이드와 플립입니다.
이미지 테두리
- 테두리 활성화 / 비활성화 토글을 전환하여 이미지 주변을 둘러보세요.
- 다음을 선택하세요. 공통 국경 이미지의 모든 면에 표시하거나 테두리를 별도로 각 측면에 대해.
- 지정 폭 국경의. 0으로 설정하면 테두리가 나타나지 않습니다. 이미지의 각 측면에 대해 개별적으로 테두리 너비를 설정할 수도 있습니다.
- 선택 테두리 색 색상 선택기에서.
- 선호하는 것을 선택하십시오 테두리 스타일 드롭 다운에서
- 결정 모바일의 테두리 너비 데스크탑용으로 선택한 너비에 맞춰 정렬합니다.
카드
- 방법을 참조하십시오 카드를 관리합니다.
그림자
- 디스플레이 – 항상 목록 항목 뒤에 그림자를 표시하거나 가리키기만 하면 표시되도록 선택합니다.
- 스타일 – 기존 사전 설정에서 선택하거나 사용자 지정 그림자를 만듭니다.
사용자 정의 옵션을 선택한 경우 다음을 방문하십시오. 상자 그림자 생성기 사용자 지정 그림자를 만듭니다. 마지막으로 복사 붙여넣기 상자 그림자 CSS. - 사전 설정 옵션을 선택한 경우 그림자 스타일 선택 드롭 다운에서
버튼 및 링크
- 방법을 참조하십시오 스타일링을 관리하기 위해 버튼 및 링크.
- 찜하기 모든 스타일이 변경됩니다.
