갤러리 그리드

갤러리 그리드를 사용하여 한 번에 여러 이미지를 행과 열로 표시할 수 있습니다.

페이지에 이미지 갤러리를 추가하려면 다음과 같이 하십시오.
  1. 편집할 페이지로 이동하고 편집 스위치편집으로 설정되어 있는지 확인합니다.
  2. 페이지에 구성요소를 추가합니다. 사용할 이미지를 선택할 때까지 갤러리 그리드 구성요소는 위치 표시자 이미지를 보여줍니다.
  3. 하나 이상의 이미지를 갤러리에 추가하려면 메뉴 아이콘 구성요소 메뉴 아이콘을 누르고, 설정을 선택하고, 일반 사항 탭에서 이미지를 누릅니다.
  4. 이미지 추가를 누릅니다.
  5. 하나 이상의 이미지를 선택합니다.

    주:

    모든 사용 가능한 파일이 창에 표시됩니다. 컨텍스트에 적합한 파일 유형을 선택해야 합니다. 예를 들어, 이미지 파일을 선택하는 경우 적합한 이미지 형식의 파일(GIF, JPG, JPEG, PNG, SVG)을 선택해야 합니다.
    1. 사용할 이미지를 찾아 선택합니다.

      디지털 자산이 보이지 않으면 자산 필터 아이콘을 누르고 모음 필터를 모두로 변경합니다.

    2. 문서 폴더에서 이미지를 선택한 경우, 이를 사이트에 복사하는 대신 파일에 링크할 수 있습니다. 파일에 링크하려면 사이트에 파일을 복사하는 대신 원본 파일의 참조 사용을 선택합니다. 이 옵션을 선택하지 않으면 파일의 복사본이 사이트에 저장되고, 사이트에서 참조됩니다. 원본 파일에 링크하면 콘텐츠가 복제되지 않습니다. 링크를 통해 사이트 방문자는 파일에 대한 권한이 변경되거나 보기 권한이 제한되는 경우에도 콘텐츠를 볼 수 있습니다.
    3. 확인을 누릅니다.
    4. 디지털 자산을 선택한 경우, 특정 표현을 선택할 수 있습니다. 표현을 선택하지 않으면 원래 크기가 사용됩니다. 사이트가 게시될 때 자산의 최신 버전이 게시되도록 하려면 자산의 최신 버전 사용을 선택합니다.
    선택한 이미지가 이미지 목록에 추가됩니다. 이미지 끌어 놓기로 목록에서(그리드에서) 재정렬합니다. 각 이미지의 기본 제목은 확장자 없는 파일 이름입니다.
  6. 특정 이미지의 제목, 설명 또는 기타 옵션을 변경하려면 목록에서 이미지를 누르고 적절히 변경합니다.
    또한 갤러리의 이미지에 링크나 다른 동작을 연관시킬 수 있습니다.
    1. 특정 이미지의 설정 패널에서 링크 필드를 누릅니다.
    2. 다음 옵션 중 하나를 선택합니다.
      • 링크 없음: 사용자가 이미지를 누를 때 아무 동작도 수행하지 않습니다.

      • 웹 페이지: 외부 페이지나 사이트의 전체 URL을 지정하고 링크를 열 위치를 선택합니다.

      • 사이트 페이지: 페이지 선택기를 사용하여 현재 사이트에서 페이지를 선택하고 링크를 열 위치를 선택합니다. key1=value1&key2=value2 형식으로 추가 URL 매개변수를 지정할 수 있습니다. 비어 있는 값이 지원됩니다(예: key1=&key2=value2). 또한 URL 앵커를 지정할 수 있지만 앵커 링크를 확인할 대상 사이트 페이지의 위치에 특수한 앵커 섹션 레이아웃을 추가하고, 트리거 작업을 정의할 때 사용한 레이아웃 설정에서 동일한 앵커 이름을 지정해야 합니다.

        주:

        URL 앵커를 사용하는 데 필요한 앵커 섹션 레이아웃은 OCE Toolkit에서 배포됩니다. 툴킷을 얻는 방법에 대한 자세한 내용은 OCE Toolkit으로 개발을 참조하십시오.
      • 파일 다운로드: 저장소에서 선택한 파일을 다운로드합니다. 파일을 선택합니다.

        디지털 자산을 선택한 경우, 특정 표현을 선택할 수 있습니다. 표현을 선택하지 않으면 원래 크기가 사용됩니다. 사이트가 게시될 때 자산의 최신 버전이 게시되도록 하려면 자산의 최신 버전 사용을 선택합니다. 자산의 최신 버전 사용을 선택하지 않으면 가장 최근 초안 버전이 아닌 가장 최근 게시된 버전이 사용됩니다.

      • 콘텐츠 항목: 연관된 자산 저장소에서 콘텐츠 항목을 선택하고, 표시할 세부정보 페이지를 선택하고, 페이지가 동일한 창 또는 새 창에서 열리도록 지정합니다.

      • 전자메일: 적합한 전자메일 주소와 제목(선택사항)을 지정합니다. 결과 메시지가 열리고 기본 전자 메일 클라이언트를 통해 전송됩니다.

      • 이미지 미리보기: 선택된 이미지가 페이지에 중첩되어 나타납니다.

      • : 적합한 주소 또는 좌표를 입력하고 데스크톱 및 모바일 브라우저에서 맵을 열 위치를 선택합니다.

      • 전화 통화: 적합한 전화 번호를 입력합니다.

    3. 뒤로를 눌러 이미지 설정 패널로 돌아갑니다. 뒤로를 다시 눌러 이미지 목록으로 돌아가서 업데이트할 다른 이미지를 선택합니다.
    4. 개별 이미지 업데이트가 완료되면 뒤로를 눌러 갤러리 옵션을 지정합니다.
  7. 레이아웃 옵션을 사용하여 그리드에 이미지를 배열합니다.
    • 석조
    • 사용자정의
    각 옵션은 다음 단계에서 설명합니다.
  8. 석조 레이아웃을 선택하여 가용 공간 내에 행으로 이미지를 자동으로 배열합니다.
    결과 행은 높이가 균일하지만 정의된 열은 없습니다.
    GUID-4CAF671A-F931-4177-BB92-E5F082663996-default.png에 대한 설명이 이어집니다.
    그림 설명 ''GUID-4CAF671A-F931-4177-BB92-E5F082663996-default.png''
    1. 높이를 지정하여 모든 이미지를 지정된 높이(픽셀)에 비례하여 조정합니다.
    2. 이미지 간격을 지정하여 행의 이미지 사이 간격을 늘리거나 줄입니다.
  9. 레이아웃을 선택하여 이미지를 행과 열로 배열합니다.
    1. 확장/축소 옵션을 선택하여 그리드의 이미지 표시를 조정합니다.
      • 자르기: 두 치수(너비 또는 높이)가 더 작으면 가용 공간에 맞게 조정하고, 더 큰 치수는 잘라서 이미지 늘이기를 막습니다.

      • 맞춤: 전체 이미지가 이미지 왜곡 없이 가용 공간에 맞도록 각 이미지가 조정됩니다.
      예를 들어, 다음 그리드는 4개 열을 사용하고 이에 맞게 6개 이미지를 조정합니다.
      GUID-4AB0B5DD-89B4-492D-A968-45482B3953CE-default.png에 대한 설명이 이어집니다.
      그림 설명 ''GUID-4AB0B5DD-89B4-492D-A968-45482B3953CE-default.png''


      GUID-3B1C55AE-E995-41C4-A9D9-F52FA75FF7E3-default.png에 대한 설명이 이어집니다.
      그림 설명 ''GUID-3B1C55AE-E995-41C4-A9D9-F52FA75FF7E3-default.png''
      은 이미지가 잘린 동일한 그리드입니다.

    2. 가로 세로 비율을 지정하여 그리드의 셀 모양을 결정합니다.
      • 사각형: 가로 세로 비율 1:1

      • 가로: 가로 세로 비율 16:9

      • 세로: 가로 세로 비율 9:16
      • 사용자정의: 가로 세로 비율에 고유의 숫자 값을 지정합니다.

    3. 개수를 지정합니다.
      동일 너비의 열을 생성하도록 그리드가 자동으로 조정됩니다.
    4. 이미지 간격을 지정하여 행과 열의 이미지 사이 간격을 늘리거나 줄입니다.
  10. 사용자정의 레이아웃을 선택하여 사용자가 지정한 이미지 크기와 너비에 준하여 이미지를 행과 열로 배열합니다.
    1. 확장/축소 옵션을 선택하여 그리드의 이미지 표시를 조정합니다.
      • 자르기: 두 치수(너비 또는 높이)가 더 작으면 가용 공간에 맞게 조정하고, 더 큰 치수는 잘라서 이미지 늘이기를 막습니다.

      • 맞춤: 전체 이미지가 이미지 왜곡 없이 가용 공간에 맞도록 각 이미지가 조정됩니다.
    2. 이미지 높이이미지 너비를 지정하여 그리드의 셀 모양을 결정합니다.
      사용자가 지정한 치수의 셀을 생성하도록 그리드가 자동으로 조정됩니다.
    3. 이미지 간격을 지정하여 행과 열의 이미지 사이 간격을 늘리거나 줄입니다.
  11. 맞춤, 너비, 간격 옵션을 지정하여 슬롯 내에 그리드를 배치합니다.
    너비를 사용하여 슬롯 내에 갤러리의 너비(픽셀)를 지정합니다. 채우기 이외의 맞춤 옵션을 눌러 너비를 지정합니다. 너비를 설정한 후 채우기를 사용하여 지정된 너비로 이미지를 늘릴 수 있습니다.