Hero 웹 파트 사용

커뮤니케이션 사이트의 Hero 웹 파트: 토픽 및 쇼케이스

통신 사이트를 만들 때 빈 사이트로 시작하거나 각각 기본 웹 파트 집합과 함께 제공되는 다른 사이트 템플릿 중 하나를 선택할 수 있습니다. 이러한 통신 사이트 템플릿 중 일부는 다음과 같은 Hero 웹 파트와 함께 제공됩니다.

• Standard 통신: 뉴스, 이벤트 및 기타 콘텐츠와 같은 정보를 공유합니다.

• 쇼케이스: 사진 또는 이미지를 사용하여 제품, 팀 또는 이벤트를 소개합니다.

이러한 템플릿에서 Hero 웹 파트는 기본적으로 페이지에 포함됩니다. 사용자 고유의 이미지, 텍스트, 페이지, 링크 또는 문서를 표시하기 위해 변경하는 기본 이미지, 텍스트 및 링크로 미리 채워집니다.

Standard 통신 템플릿을 선택하면 기본 Hero는 타일 5개가 있는 타일 레이아웃입니다(1에서 5로 변경할 수 있음).

쇼케이스 템플릿을 선택하면 기본 Hero는 세 개의 레이어가 있는 세로 레이아웃입니다(1개에서 5개의 레이어로 변경할 수 있음).

단추(1) 속성 편집()을 사용하여 Hero 웹 파트의 레이아웃을 그리드에서 세로 레이어 또는 회전식으로 변경할 수 있으며 단추(2) 각 타일 또는 레이어에 대한 세부 정보 편집()을 사용하여 각 타일 또는 레이어에 대한 링크, 이미지 및 텍스트를 변경할 수 있습니다.

1. 웹 파트 편집 단추

2. 세부 정보 편집 단추

Hero 웹 파트의 레이아웃 변경

페이지에서 편집 모드가 아직 없는 경우 페이지 오른쪽 위에서 편집 을 선택합니다.

1. Hero 웹 파트에 사용할 수 있는 세 가지 레이아웃 중 하나인 회전식, 타일 및 레이어 중 하나를 선택할 수 있습니다. 웹 파트의 왼쪽 위에서 속성 편집 ()을 선택한 다음 레이아웃 드롭다운 메뉴에서 레이아웃을 선택하여 레이아웃을 선택합니다
   
   
   
   또는 웹 파트 속성 창에서 원하는 레이아웃 유형을 선택할 수 있습니다.
   
   

2. 웹 파트 속성 창에서 다음을 선택합니다.

   • 회전식 레이아웃에 대한 슬라이드 추가
      

     팁: 

     • 회전식 레이아웃의 경우 자동 슬라이드 전환을 사용하거나 사용하지 않도록 설정하려면 토글 자동 실행을 켜거나 끌 수 있습니다.

     • 

   • 타일 레이아웃에 대한 타일 추가

   • 레이어 레이아웃
     대한 레이어 추가

• 참고: 최대 5개의 타일(예: Standard 통신 사이트에서) 또는 최대 5개의 레이어(예: 쇼케이스 사이트)를 선택하거나 회전목마에서 최대 5개의 이미지를 선택할 수 있습니다. 

각 타일 또는 레이어에 대한 이미지, 텍스트 및 링크 변경

페이지에서 편집 모드가 아직 없는 경우 페이지 오른쪽 위에서 편집 을 선택합니다.

1. 변경할 타일 또는 레이어의 오른쪽 아래에서 세부 정보 편집()을 선택합니다.

2. 속성 창에서 변경을 선택한 다음 링크를 가져올 위치를 선택합니다.

   • 최근: 최근에 이미지, 페이지 또는 문서를 연 경우 여기에 나열된 이미지를 찾을 수 있습니다.

   • 스톡 이미지 스톡 이미지는 Microsoft에서 제공합니다. 고품질이며 사용하기에 적합한 크기입니다. SharePoint 관리자인 경우 CDN(Content Delivery Network) 을 사용하도록 설정하여 이미지 가져오기 성능을 개선하는 것이 좋습니다.

   • 웹 검색: Bing에서 Creative Common 라이선스를 활용하는 이미지를 찾을 수 있습니다. 페이지에 삽입하기 전에 이미지에 대한 라이선스를 검토할 책임이 있습니다. Microsoft 365에서만SharePoint.

   • organization: organization 승인된 자산 집합을 지정한 경우 여기에서 해당 집합 중에서 선택할 수 있습니다.  SharePoint 관리 사용자 organization 대한 자산 라이브러리를 만드는 방법을 알아보려면 organization 자산 라이브러리 만들기를 참조하세요.

   • OneDrive: OneDrive에 저장한 문서 또는 이미지에 대한 링크를 가져올 수 있습니다. Microsoft 365에서만SharePoint.

   • 사이트: 지정한 사이트에서 문서, 이미지 또는 페이지에 대한 링크를 가져올 수 있습니다.

   • 업로드: 개인 디바이스에서 문서 또는 이미지를 업로드할 수 있습니다.

   • 링크에서: Microsoft 365에서 OneDrive 또는 SharePoint 페이지, 문서 또는 이미지에 대한 링크를 입력합니다.

     참고: 사이트 외부의 링크는 미국 정부 GCC High 및 DoD에서 이미지 미리 보기를 표시하지 않으며 21Vianet에서 작동하는 Office 365.

3. 이미지, 페이지 또는 문서를 선택하고 열기를 선택합니다.

4. 속성 창의 배경 이미지에서 사용자 지정 이미지 또는 색만을 선택합니다(색은 타일 레이아웃에만 사용할 수 있고 색은 사이트 테마 색에 해당).

   자동 선택 옵션은 연결할 페이지 또는 문서에서 이미지를 사용할 수 있는 경우 자동으로 선택합니다.

5. 이미지의 헤더를 입력합니다.

   • 토글을 예로 전환하여 작업 호출 링크를 표시할 수 있습니다. 그런 다음 , 작업 호출 텍스트 (예: "자세히 알아보기")를 추가합니다. 작업 호출 링크는 계층화된 레이아웃의 각 레이어에 대해 사용할 수 있지만 타일 레이아웃에서 가장 큰 타일에만 사용할 수 있습니다.
     
     ​​​​​​​

     참고:  회전식 레이아웃에는 3개 새로운 스타일이 있습니다. 각 슬라이드에 대해 다양한 스타일 (이미지 오버레이, 텍스트 블록, 대각선 분할)을 설정하여 콘텐츠 프레젠테이션을 변경할 수 있습니다.

     

이미지의 초점 변경

Microsoft 365의 SharePoint Hero 웹 파트 내에서 선택한 이미지의 초점을 변경하여 프레임에서 그림의 가장 중요한 부분을 가져올 수 있습니다.

1. 페이지에서 편집 모드가 아직 없는 경우 페이지 오른쪽 위에서 편집 을 선택합니다.

2. 변경하려는 Hero 이미지 아래쪽의 도구 모음에서 초점 설정을 선택합니다.

3. 이미지에서 원하는 위치를 끌어다 옵니다.
   
   

회전식 이미지, 타일 또는 레이어 순서 다시 지정

원하는 위치로 이동하여 회전식 이미지, 타일 또는 레이어의 순서를 변경할 수 있습니다.

1. 페이지에서 편집 모드가 아직 없는 경우 페이지 오른쪽 위에서 편집 을 선택합니다.

2. 속성 창에서 이미지, 타일 또는 레이어 옆에 있는 세 개의 점 줄임표를 선택한 다음 위로 이동 또는 아래로 이동을 선택하여 순서를 다시 지정합니다. 타일 및 레이어의 경우 이미지를 선택한 다음 원하는 위치에 타일 또는 레이어를 길게 끌어다 붙일 수도 있습니다.

Hero 웹 파트를 두 개 또는 세 개의 열 중 하나에 넣습니다.

Hero 웹 파트는 페이지의 전체 너비를 차지하도록 설계되었습니다. Hero 웹 파트가 전체 너비를 차지하지 않는다면 섹션의 레이아웃을 변경하여 수행할 수 있습니다.

1. 편집 모드가 아직 없는 경우 페이지 오른쪽 위에서 편집 을 선택합니다.

2. Hero 웹 파트 바로 위에 마우스를 가져가고 웹 파트 왼쪽에서 원을 그리는 + 를 선택합니다.

3. 구역 레이아웃에서 두 개의 열 또는 세 개의 열을 선택합니다.

4. 이제 Hero 웹 파트가 섹션에 있는 두 개 또는 세 개의 열의 왼쪽 열에 있습니다. 

5. Hero 웹 파트를 이동하려면 이미지를 선택한 다음 원하는 열로 길게 끌어옵니다.

페이지에 빈 Hero 웹 파트 추가

팀 사이트 또는 커뮤니케이션 사이트의 페이지에 Hero 웹 파트를 추가할 수 있습니다. 그렇게 하려면 다음과 같이 하세요.

1. 페이지에서 편집 모드가 아직 없는 경우 페이지 오른쪽 위에서 편집 을 선택합니다. 오른쪽에 있는 도구 상자 ()를 찾습니다.

2. 모든 웹 파트 보기를 선택한 다음, 웹 파트 목록에서 Hero를 선택하거나 끌어서 놓습니다.

3. 속성 편집()을 선택하고 원하는 레이아웃 유형을 선택합니다. 1~5개의 타일에서 그리드를 사용하거나 1~5개의 세로 레이어를 사용할 수 있습니다.

4. 변경할 각 타일에 대한 링크 선택을 선택합니다 .

5. 각 타일의 도구 상자에서 선택을 선택한 다음 링크를 가져올 위치를 선택합니다.

   도구 상자에서 변경을 선택한 다음 링크를 가져올 위치를 선택합니다.

   • 최근: 최근에 이미지, 페이지 또는 문서를 연 경우 여기에 나열된 이미지를 찾을 수 있습니다.

   • 웹 검색: Bing에서 Creative Common 라이선스를 활용하는 이미지를 찾을 수 있습니다. 페이지에 삽입하기 전에 이미지에 대한 라이선스를 검토할 책임이 있습니다. Microsoft 365에서만SharePoint.

   • organization: organization 승인된 자산 집합을 지정한 경우 여기에서 해당 집합 중에서 선택할 수 있습니다.  SharePoint 관리 사용자 organization 대한 자산 라이브러리를 만드는 방법을 알아보려면 organization 자산 라이브러리 만들기를 참조하세요.

   • OneDrive: OneDrive에 저장한 문서 또는 이미지에 대한 링크를 가져올 수 있습니다. Microsoft 365에서만SharePoint.

   • 사이트: 지정한 사이트에서 문서, 이미지 또는 페이지에 대한 링크를 가져올 수 있습니다.

   • 업로드: 개인 디바이스에서 문서 또는 이미지를 업로드할 수 있습니다.

   • 링크에서: Microsoft 365에서 SharePoint 위해 OneDrive의 페이지, 문서 또는 이미지에 대한 링크를 입력합니다.

6. 이미지, 페이지 또는 문서를 선택하고 열기를 클릭합니다.

7. 도구 상자의 이미지에서 사용자 지정 이미지 또는 색만을 선택합니다. 자동 선택 옵션은 연결할 페이지 또는 문서에서 이미지를 사용할 수 있는 경우 자동으로 선택합니다. 색 은 타일 레이아웃에만 사용할 수 있으며 색은 사이트 테마 색에 해당합니다.

8. 이미지의 대체 텍스트를 입력합니다.

9. 토글을 예로 전환하여 작업 호출 링크를 표시할 수 있습니다. 그런 다음 , 작업 호출 텍스트 (예: "자세히 알아보기")를 추가합니다. 작업 호출 링크는 계층화된 레이아웃의 각 레이어에 대해 사용할 수 있지만 타일 레이아웃에서 가장 큰 타일에만 사용할 수 있습니다.

Hero 웹 파트의 이미지 크기 조정

Hero 웹 파트에 적합한 크기의 이미지를 선택하려면 다음을 고려합니다.

• 웹 파트는 화면의 너비에 맞게 전체 피 레이아웃에 맞게 설계되었습니다.

• 타일 레이아웃에서 웹 파트의 높이가 8:3의 가로 세로 비율을 따르도록 조정되고 웹 파트 내의 이미지는 가로 세로 비율 4:3으로 조정됩니다.

• 레이어 레이아웃에서 개별 레이어는 가로 세로 비율 8:3으로 조정되고 각 레이어 내의 이미지는 9:16에 가까운 가로 세로 비율로 확장됩니다.

회전식 레이아웃은 언제 사용할 수 있나요?

일반 공급(전 세계, GCC, GCC High 및 DoD): 출시는 2025년 1월 중순에 시작되어 월말까지 완료됩니다.

회전식 레이아웃이 추가된 후 기존 레이아웃은 어떻게 되나요?

Hero 웹 파트 업데이트의 일부로 다음과 같은 변경 사항이 적용되었습니다.

• 항목 관리 업데이트

  Hero 웹 파트에서 항목을 관리하는 방법이 변경되었습니다. 이제 항목 수(1-5)를 설정하는 대신 직관적인 새 슬라이드 인터페이스를 사용하여 항목을 직접 추가하거나 삭제할 수 있습니다. 이렇게 하면 특정 요구 사항에 맞게 Hero 웹 파트를 사용자 지정하는 프로세스가 간소화됩니다.

• 속성 창 조정

  타일 및 레이어 레이아웃에 대한 속성 창의 UI가 최신 환경을 위해 새로 고쳐졌지만 이러한 레이아웃의 기능은 변경되지 않습니다.

•  기존 레이아웃에 영향을 주지 않음

  현재 타일 또는 레이어 레이아웃을 사용하는 경우 그대로 유지됩니다. 새 회전목마 레이아웃으로 자동 변환되지 않으며 기존 페이지가 예상대로 계속 표시되고 작동하도록 합니다.