사이트에 최신 페이지를 추가하면 페이지의 구성 요소인 웹 파트를 추가하고 사용자 지정합니다. 일부 웹 파트를 서로 연결하여 페이지 뷰어에 대한 대화형 동적 환경을 만들 수 있습니다. 예를 들어 문서 라이브러리 웹 파트를 파일 및 미디어 웹 파트에 연결할 수 있습니다. 사용자가 문서 라이브러리 목록에서 파일 이름을 클릭하면 파일 뷰어에 해당 특정 파일의 내용이 표시됩니다. 또는 목록 웹 파트를 Embed 웹 파트에 연결하고 다양한 동적 환경에 대한 사용자 지정 코드를 추가합니다.
참고 사항:
-
일부 기능은 대상 릴리스 프로그램을 옵트인한 조직에 점진적으로 도입됩니다. 즉, 이 기능이 아직 표시되지 않거나 도움말 문서에 설명된 것과 다를 수 있습니다.
-
이 문서의 웹 파트는 클래식 페이지에서 사용할 수 없습니다.
연결할 수 있는 웹 파트에는 목록 속성 웹 파트, 파일 및 미디어 웹 파트 및 포함 웹 파트가 포함됩니다. 다음은 이러한 연결된 웹 파트를 사용하는 방법에 대한 몇 가지 예입니다.
사용자가 문서 라이브러리에서 선택한 항목에 따라 파일 표시(파일 및 미디어 웹 파트를 문서 라이브러리 웹 파트에 연결)
이 예제에서 사용자는 캠페인 문서 라이브러리를 탐색하고 페이지를 벗어나지 않고도 각 파일을 열지 않고 선택한 파일의 콘텐츠를 볼 수 있습니다.
그렇게 하려면 다음과 같이 하세요.
-
페이지에서 사용하려는 라이브러리가 있는 문서 라이브러리 웹 파트 를 추가하고 파일 및 미디어 웹 파트를 추가합니다.
-
파일 및 미디어 웹 파트를 처음으로 추가하는 경우 최근 문서 창이 열립니다. 이 창의 오른쪽 아래에서 취소 를 선택합니다.
-
파일 및 미디어 웹 파트의 왼쪽에서 웹 파트
-
속성 창의 오른쪽 위에 있는 타원(...)을 선택한 다음원본에 연결을 선택합니다.
-
원본에 연결에서 드롭다운 목록에서 사용할 문서 라이브러리를 선택합니다.
-
창 위쪽에서 X 를 선택하여 닫습니다.
-
페이지 위쪽에서 초안으로 저장 을 선택합니다.
-
선택한 문서 라이브러리에서 문서를 선택하여 연결을 테스트합니다. 파일 및 미디어 웹 파트에 문서가 표시됩니다.
-
대상 그룹이 페이지를 볼 준비가 되면 페이지 오른쪽 위에 있는 게시 를 선택합니다.
목록 웹 파트에서 사용자가 선택한 항목에 따라 목록에 항목 표시(목록 속성 웹 파트를 목록 웹 파트에 연결)
열이 많은 큰 목록이 있는 경우 사용자가 원하는 특정 정보를 찾기 어려울 수 있습니다. 목록 속성 웹 파트를 사용하면 사용자가 목록 웹 파트에서 항목을 선택하고 지정한 값만 볼 수 있습니다. 다음 예제에서 목록 웹 파트에는 지역 사무소 목록이 포함되어 있습니다. 사용자가 목록에서 항목을 선택하면 목록 속성 웹 파트에 Office 이름 및 판매 데이터만 표시됩니다.
그렇게 하려면 다음과 같이 하세요.
-
페이지에서 사용하려는 목록이 포함된 목록 웹 파트 를 추가한 다음 목록 속성 웹 파트를 추가합니다.
-
목록 속성 웹 파트의 왼쪽에서 웹 파트
-
속성 창의 오른쪽 위에 있는 타원(...)을 선택한 다음 원본에 연결을 선택합니다.
-
원본에 연결에서 드롭다운 목록에서 사용할 목록을 선택합니다.
-
표시에서 사용자가 페이지에 표시할 항목을 선택합니다.
-
표시할 필드 아래에서 값을 표시할 열 옆에 있는 검사 상자를 선택합니다.
-
페이지 위쪽에서 초안으로 저장 을 선택합니다.
-
선택한 목록에서 항목을 선택하여 연결을 테스트합니다. 목록 속성 웹 파트에 지정한 값이 표시됩니다.
-
대상 그룹이 페이지를 볼 준비가 되면 페이지 오른쪽 위에 있는 게시 를 선택합니다.
목록 웹 파트에서 사용자가 선택한 내용에 따라 비디오, 이미지 또는 위치 표시(포함 웹 파트를 목록 웹 파트에 연결)
Embed 웹 파트를 사용하면 변수를 사용하는 링크 또는 포함 코드를 입력할 수 있으므로 페이지 뷰어가 선택하는 항목에 따라 다양한 항목을 표시할 수 있습니다. 다음은 선택한 이미지, 비디오 및 위치를 표시하는 방법에 대한 세 가지 예입니다.
선택한 YouTube 동영상 표시
이 예제에서 목록 웹 파트에는 여러 YouTube 동영상에 대한 비디오 제목 및 ID가 포함된 목록이 포함되어 있습니다. 사용자가 목록에서 비디오를 선택하면 포함 웹 파트에 해당 비디오가 표시됩니다. Embed 웹 파트의 링크는 변수를 사용하여 목록에서 사용자가 선택한 비디오의 비디오 ID를 나타냅니다.
그렇게 하려면 다음과 같이 하세요.
-
위의 예제와 같이 비디오 ID에 대한 제목 열과 열이 있는 목록을 만듭니다. ID는 비디오를 식별하는 YouTube 링크의 일부이며 링크의 "v=" 부분 다음에 있습니다. 예를 들어 다음 링크에서 기울임꼴 부분은 비디오 ID입니다.
https://www.youtube.com/watch?v=0YEPy7HRf60
-
페이지에서 목록 웹 파트 를 추가하고 비디오 ID가 있는 목록을 선택합니다.
-
웹 파트 포함의 왼쪽에서 웹 파트
-
속성 창의 오른쪽 위에 있는 타원(...)을 선택한 다음 원본에 연결을 선택합니다.
-
원본에 연결에서 드롭다운 목록에서 목록을 선택합니다.
-
웹 사이트 주소 또는 포함 코드에서 YouTube 링크를 추가합니다. 하지만 개별 비디오 ID를 사용하는 대신 ID를 포함하는 목록 열의 이름을 변수로 사용합니다. 변수는 이름 뒤의 여는 대괄호, $및 닫는 대괄호로 표시됩니다. 다음은 비디오 ID가 열 이름인 예제입니다.
-
페이지 위쪽에서 초안으로 저장 을 선택합니다.
-
선택한 목록에서 항목을 선택하여 연결을 테스트합니다. Embed 웹 파트에 표시되는 비디오가 표시됩니다.
-
대상 그룹이 페이지를 볼 준비가 되면 페이지 오른쪽 위에 있는 게시 를 선택합니다.
선택한 이미지 표시
이 예제에서 목록 웹 파트에는 SharePoint 사이트에 저장된 이미지에 대한 이미지 제목 및 URL이 포함됩니다. 사용자가 목록에서 이미지를 선택하면 포함 웹 파트에 해당 이미지가 표시됩니다. 이 예제에서 IFrame 코드는 Embed 웹 파트에서 사용되며 변수는 이미지 링크를 나타냅니다.
그렇게 하려면 다음과 같이 하세요.
-
이미지 URL에 대한 제목 열과 열이 있는 목록을 만듭니다.
팁: 이미지의 URL을 가져오려면 이미지가 저장된 라이브러리로 이동하여 이미지를 마우스 오른쪽 단추로 클릭하고 링크 복사를 클릭합니다. 그런 다음 복사를 클릭합니다. 이제 링크를 목록에 붙여넣을 수 있습니다.
-
페이지에서 목록 웹 파트 를 추가하고 이미지 URL이 있는 목록을 선택합니다.
-
웹 파트 포함의 왼쪽에서 웹 파트
-
속성 창의 오른쪽 위에 있는 타원(...)을 선택한 다음원본에 연결을 선택합니다.
-
원본에 연결에서 드롭다운 목록에서 목록을 선택합니다.
-
웹 사이트 주소 또는 포함 코드에서 포함 코드를 추가합니다. 이 예제에서 포함 코드는 다음과 같습니다.
<iframe width="693" height="390" src="[$Image URL]" frameborder="0" allowfullscreen="" allow="accelerometer; 자동 실행; encrypted-media; 자이로스코프; 그림 속"></iframe>
여기서 [$Image URL]은 이미지 URL의 열 이름을 나타내는 변수입니다.
-
페이지 위쪽에서 초안으로 저장 을 선택합니다.
-
선택한 목록에서 항목을 선택하여 연결을 테스트합니다. Embed 웹 파트에 표시되는 이미지가 표시됩니다.
-
대상 그룹이 페이지를 볼 준비가 되면 페이지 오른쪽 위에 있는 게시 를 선택합니다.
선택한 위치 표시
이 예제에서 목록 웹 파트에는 위치 및 해당 좌표가 포함됩니다. 사용자가 목록에서 위치를 선택하면 포함 웹 파트에 Bing 맵에 해당 위치가 표시됩니다. 이 예제에서 IFrame 코드는 Embed 웹 파트에서 사용되며 변수는 좌표를 나타냅니다.
그렇게 하려면 다음과 같이 하세요.
-
경도 및 위도에 대한 제목 열과 열이 있는 목록을 만듭니다.
-
페이지에서 목록 웹 파트 를 추가하고 위치 정보가 포함된 목록을 선택합니다.
-
웹 파트 포함의 왼쪽에서 웹 파트
-
속성 창의 오른쪽 위에 있는 타원(...)을 선택한 다음 원본에 연결을 선택합니다.
-
원본에 연결에서 드롭다운 목록에서 목록을 선택합니다.
-
웹 사이트 주소 또는 포함 코드에서 포함 코드를 추가합니다. 이 예제에서 포함 코드는 다음과 같습니다.
<iframe width="500" height="400" src="https://www.bing.com/maps/embed?h=400& w=500& cp=[$Latitude]~[$Longitude]& lvl=13& typ=d& sty=r& src=SHELL& FORM=MBEDV8" frameborder="0" scrolling="no"> </iframe>
여기서 [$Latitude] 및 [$Longitude]은 각 점의 열 이름을 나타내는 변수입니다.
-
페이지 위쪽에서 초안으로 저장 을 선택합니다.
-
선택한 목록에서 항목을 선택하여 연결을 테스트합니다. 포함 웹 파트에 표시되는 위치를 보여 주는 Bing 맵이 표시됩니다.
-
대상 그룹이 페이지를 볼 준비가 되면 페이지 오른쪽 위에 있는 게시 를 선택합니다.
참고 사항:
-
포함 코드는 iframe 기반이어야 합니다(즉, <iframe> 태그로 시작 및 종료). <스크립트> 태그를 사용하는 포함 코드는 지원되지 않습니다.
-
보안 웹 사이트만 포함할 수 있습니다. 웹 사이트의 URL이 HTTPS로 시작하는지 확인합니다.
다른 목록 또는 라이브러리의 선택 항목에 따라 목록 필터링
동적 필터링을 사용하면 다른 목록에서 선택한 항목에 따라 하나의 목록을 필터링할 수 있습니다. 다음 예제에서는 계획 문서 라이브러리가 프로젝트 정보 목록의 선택 항목으로 필터링됩니다. 프로젝트 팀 열의 "마케팅" 값이 선택되므로 마케팅 팀이 소유한 문서만 계획 문서 라이브러리에 표시됩니다.
그렇게 하려면 다음과 같이 하세요.
-
페이지에서 목록 웹 파트 또는 라이브러리 웹 파트 를 추가하고 필터링할 값이 있는 목록 또는 라이브러리를 선택합니다.
-
다른 목록 웹 파트 또는 라이브러리 웹 파트 를 추가하고 필터링할 정보가 포함된 목록 또는 라이브러리를 선택합니다.
-
필터링할 목록 또는 라이브러리 웹 파트를 선택하고 웹 파트 왼쪽의 웹 파트
-
동적 필터링에서 토글을 켜기 위치로 밀어 놓습니다.
-
필터링할 [목록 이름]의 열 필드에서 필터링할 열을 선택합니다.
-
필터 값이 포함된 목록 또는 라이브러리 아래에서 1단계에서 페이지에 추가한 목록 또는 라이브러리를 선택합니다.
-
필터 값이 포함된 열 아래에서 필터링할 값이 있는 열을 선택합니다.
-
적용을 선택합니다.
섹션의 시작 부분에 있는 예제 이미지를 사용하여 문서 계획 라이브러리에 대한 동적 필터링 옵션은 다음과 같습니다.
-
완료되면 페이지 위쪽에서 초안으로 저장 을 선택하거나, 대상 그룹이 페이지를 볼 준비가 되었으면 페이지 오른쪽 위에 있는 게시 를 선택합니다.
