이미지 구성 요소 image-component

자르기 시작

이 옵션을 선택하면 자르기 비율을 사전 정의하는 드롭다운이 열립니다.

• 자르기 제거 옵션을 선택하면 원본 자산이 표시됩니다.

자르기 옵션이 선택되면 파란색 핸들이 사용하여 이미지에서 자르기 크기를 조정합니다.

오른쪽 회전

이 옵션을 사용하여 오른쪽으로(시계 방향으로) 이미지를 90° 회전합니다.

확대/축소 재설정

이미지가 이미 확대/축소되었다면 이 옵션을 사용하여 확대/축소 레벨을 재설정합니다.

확대/축소 슬라이더 열기

이 옵션을 사용하여 이미지의 확대/축소 레벨을 제어하는 슬라이더를 표시합니다.

페이지에서 추천 이미지 상속 옵션은 링크된 페이지의 추천 이미지를 사용하거나 이미지가 링크되지 않은 경우 현재 페이지의 추천 이미지를 사용합니다.

이미지 자산 - 페이지에서 추천 이미지 상속 ​을 선택한 경우 자동으로 채워집니다. 다음 옵션을 설정하여 이미지를 수동으로 정의하려면 선택 해제합니다.

• 자산 브라우저에서 자산을 드롭하거나 검색 옵션을 탭하여 로컬 파일 시스템에서 업로드할 수 있습니다.

• 지우기 ​를 탭하거나 클릭하여 현재 선택된 이미지 선택을 해제합니다.

• 선택 ​을 탭하거나 클릭하여 자산 브라우저를 열고 이미지를 선택할 수 있습니다.

  • 원격 자산 지원이 활성화된 경우 자산 선택을 위한 여러 옵션이 있습니다.

    • 로컬 ​은 로컬 AEM 자산 라이브러리에서 선택할 수 있습니다.
    • 원격 ​은 AEM 인스턴스 외부의 Dynamic Media 라이브러리에서 선택할 수 있습니다.

• 편집 ​을 탭하거나 클릭하여 자산 편집기에서 자산 렌디션을 관리합니다.

접근성을 위한 그림 설명 필드에서는 시각 장애인 독자를 위한 이미지 설명을 정의할 수 있습니다.

• 페이지에서 그림 설명 상속 옵션은 DAM에 있는 dc:description 메타데이터 또는 연결된 자산이 없는 경우 현재 페이지의 연결된 자산 값에 대한 대체 설명을 사용합니다.

그림 설명을 제공하지 않음 - 이미지가 단순히 장식용이거나 페이지에 추가 정보를 전달하지 않는 경우 화면 판독기와 같은 보조 기술에서 무시되도록 이미지를 표시합니다.

사전 설정 유형 - 이는 사용 가능한 이미지 사전 설정 유형, 이미지 사전 설정 또는 스마트 자르기 중 하나를 정의하고, Dynamic Media 기능이 활성화되는 경우에만 사용할 수 있습니다.

• 이미지 사전 설정 - 이미지 사전 설정 ​의 사전 설정 유형 ​이 설정되면 사용 가능한 Dynamic Media 사전 설정을 선택하면서 드롭다운 이미지 사전 설정 ​을 사용할 수 있습니다. 선택한 자산에 대한 사전 설정이 정의되는 경우에만 사용할 수 있습니다.
• 스마트 자르기 - 스마트 자르기 ​의 사전 설정 유형 ​이 설정되면 선택한 자산에 대해 사용 가능한 렌디션을 선택하면서 드롭다운 렌디션 ​을 사용할 수 있습니다. 선택한 자산에 대해 렌디션이 정의되는 경우에만 사용할 수 있습니다.
• 이미지 수정자 - 사전 설정 유형 선택에 관계없이 명령을 제공하는 추가 Dynamic Media 이미지를 &로 구분하여 정의할 수 있습니다.

캡션 - 기본적으로 이미지에 대한 추가 정보가 이미지 아래에 표시됩니다.

• DAM에서 캡션 다운로드 - 확인 표시가 되어 있으면 이미지의 캡션 텍스트가 DAM의 dc:title 메타데이터 값으로 채워집니다.
• 팝업으로 캡션 표시 - 확인 표시가 되어 있으면 캡션은 이미지 아래에 표시되지 않고 마우스로 이미지를 가리키면 일부 브라우저에서 팝업으로 표시됩니다.

링크 - 이미지를 다른 리소스에 연결합니다.

• 선택 대화 상자를 통해 다른 AEM 리소스에 연결합니다.
• AEM 리소스에 연결되지 않은 경우 절대 URL을 입력합니다. 절대 URL이 아닌 URL은 AEM의 상대 URL로 해석됩니다.
• 새 탭에서 링크 열기 - 이 옵션을 통해 새 브라우저 창에서 링크를 열 수 있습니다.

ID - 이 옵션을 통해 HTML과 데이터 레이어에서 구성 요소의 고유 식별자를 제어할 수 있습니다.

• 비워 두면 고유 ID는 자동으로 생성되고 결과 페이지 검사를 통해 발견될 수 있습니다.
• ID가 지정된 경우 작성자는 ID가 고유한지 확인해야 합니다.
• ID가 변경되면 CSS, JS 및 데이터 레이어 추적에 영향을 미칠 수 있습니다.

DM 기능 활성화 - 확인 표시가 되어 있으면 Dynamic Media 기능을 사용할 수 있습니다.

• 이 옵션은 환경에서 Dynamic Media가 활성화된 경우에만 표시됩니다.

웹 최적화 이미지 활성화 - 선택하면 웹에 최적화된 이미지 게재 서비스는 WebP 형식으로 이미지를 전달하여 이미지 크기를 평균 25% 줄일 수 있습니다.

• 이 옵션은 AEMaaCS에서만 사용할 수 있습니다.
• 선택하지 않거나 웹 최적화된 이미지 게재 서비스를 사용할 수 없는 경우에는 적응형 이미지 서블릿이 사용됩니다.

레이지 로딩 비활성화 - 확인 표시가 되어 있으면 구성 요소가 레이지 로딩 없이 모든 이미지를 미리 로드합니다.

장식적 이미지 - 페이지에 이미지 구성 요소를 추가할 때 장식적 이미지 옵션이 자동으로 활성화되면 정의합니다.

DAM에서 그림 설명 다운로드 - 페이지에 이미지 구성 요소를 추가할 때 DAM에서 그림 설명을 검색하는 옵션이 자동으로 활성화되면 정의합니다.

DAM에서 캡션 다운로드 - 페이지에 이미지 구성 요소를 추가할 때 DAM에서 캡션을 검색하는 옵션이 자동으로 활성화되면 정의합니다.

팝업으로 캡션 표 - 페이지에 이미지 구성 요소를 추가할 때 팝업으로 이미지 캡션을 표시하는 옵션이 자동으로 활성화되면 정의합니다.

폭 조정 - 이 값은 DAM 자산인 베이스 이미지의 폭을 조정하는 데 사용됩니다.

• 이미지의 종횡비가 유지됩니다.
• 값이 이미지의 실제 폭보다 크면 이 값은 효과가 없습니다.
• 이 값은 SVG 이미지에 영향을 주지 않습니다.

폭 이미지에 대해 폭 목록을 픽셀 단위로 정의하면 구성 요소는 브라우저 크기에 따라 가장 적절한 폭을 자동으로 로드합니다.

• 추가 버튼을 탭하거나 클릭하여 다른 크기를 추가합니다.

  • 그랩 핸들을 사용하여 크기 순서를 재배열합니다.
  • 삭제 아이콘을 사용하여 폭을 제거합니다.

• 기본적으로 이미지가 표시될 때까지 이미지 로드를 연기합니다.

  • 레이지 로딩 비활성화 옵션을 선택하여 페이지 로드에서 이미지를 로드할 수 있습니다.

JPEG 품질 - 변환된(예: 크기 조정된 또는 잘린) JPEG 이미지의 품질 인수(0~100 사이의 백분율)입니다.