콘텐츠 구성 요소 사용 content-components

전자 메일 콘텐츠를 만들 때 콘텐츠 구성 요소를 사용하면 전자 메일에 배치한 후 사용할 수 있는 비어 있는 원시 구성 요소로 전자 메일을 개인화할 수 있습니다.

전자 메일 레이아웃을 정의하는 구조 ​에 필요한 수만큼 콘텐츠 ​를 추가할 수 있습니다.

콘텐츠 구성 요소 추가 add-content-components

이메일에 콘텐츠 구성 요소를 추가하고 필요에 맞게 조정하려면 아래 단계를 따르십시오.

  1. 이메일 Designer에서 기존 콘텐츠를 사용하거나 구조 ​를 빈 콘텐츠로 끌어다 놓아 이메일 레이아웃을 정의합니다. 방법 알아보기

  2. 선택한 콘텐츠 ​를 관련 구조 내부에 끌어다 놓습니다.

    콘텐츠 구성 요소를 전자 메일 Designer 구조에 끌어다 놓는 방법을 보여 주는 스크린샷입니다. {modal="regular"}

    note note
    NOTE
    여러 구성 요소를 단일 구조 및 구조의 각 열에 추가할 수 있습니다.
  3. 상황별 설정 탭을 사용하여 각 구성 요소에 대한 옵션을 조정합니다. 예를 들어 데스크탑 또는 모바일 디바이스에만 표시하거나 둘 다에 표시하도록 선택합니다. 이 탭에서 링크 옵션을 관리할 수도 있습니다. 링크 관리에 대해 자세히 알아보기

  4. 스타일 탭을 사용하여 각 구성 요소의 스타일 특성을 조정합니다. 예를 들어 각 구성 요소의 텍스트 스타일, 패딩 또는 여백을 변경합니다. 정렬 및 패딩에 대해 자세히 알아보기

    전자 메일 Designer의 콘텐츠 구성 요소에 대한 설정 탭을 표시하는 스크린샷입니다. {modal="regular"}

  5. 오른쪽 창에 있는 콘텐츠 ​의 고급 메뉴에서 필요에 따라 콘텐츠 구성 요소를 삭제하거나 복제합니다.

컨테이너 container

간단한 컨테이너를 추가하여 다른 콘텐츠 구성 요소를 추가할 수 있습니다. 이렇게 하면 컨테이너에 특정 스타일을 적용할 수 있습니다. 이는 내부에 사용된 구성 요소와 다릅니다.

예를 들어 컨테이너 구성 요소를 추가한 다음 해당 컨테이너 내부에 버튼 구성 요소를 추가하면 컨테이너에는 특정 배경을 사용하고 단추에는 다른 배경을 사용합니다.

전자 메일 Designer에서 컨테이너 구성 요소를 추가하는 방법을 보여 주는 스크린샷입니다. {modal="regular"}

버튼 buttons

버튼 구성 요소를 사용하여 이메일에 하나 이상의 버튼을 삽입하고 이메일 대상자를 다른 페이지로 리디렉션할 수 있습니다.

  1. 콘텐츠 목록에서 버튼 구성 요소를 드래그하여 구조 구성 요소에 놓습니다.

    이메일 Designer에서 단추 구성 요소를 드래그 앤 드롭하는 방법을 보여 주는 스크린샷 {modal="regular"}

  2. 텍스트를 개인화하고 설정스타일 탭에 액세스하려면 새로 추가한 단추를 클릭하십시오.

    전자 메일 Designer의 단추 구성 요소에 대한 설정 탭을 표시하는 스크린샷입니다. {modal="regular"}

  3. 설정 탭의 URL 필드에서 단추를 클릭할 때 리디렉션할 URL을 추가합니다.

  4. Target 드롭다운 목록을 사용하여 콘텐츠가 표시되는 방식을 선택하십시오.

    • None: 링크를 클릭한 프레임과 동일한 프레임에서 링크를 엽니다(기본값).
    • Blank: 새 창이나 탭에서 링크를 엽니다.
    • Self: 링크를 클릭한 프레임과 동일한 프레임에서 링크를 엽니다.
    • Parent: 상위 프레임에서 링크를 엽니다.
    • Top: 최상위 창에서 링크를 엽니다.

    전자 메일 Designer의 단추 구성 요소에 대한 대상 옵션을 보여 주는 스크린샷입니다. {modal="regular"}

  5. 스타일 탭에서 테두리, 크기, 여백 등의 스타일 특성을 변경하여 단추를 개인화할 수 있습니다.

텍스트 text

Text 구성 요소를 사용하여 전자 메일에 텍스트를 삽입하고 설정스타일 탭을 사용하여 스타일(테두리, 크기, 패딩 등)을 조정합니다.

  1. 콘텐츠 메뉴에서 텍스트 ​을(를) 구조 구성 요소로 끌어다 놓습니다.

    이메일 Designer에서 텍스트 구성 요소를 드래그 앤 드롭하는 방법을 보여 주는 스크린샷 {modal="regular"}

  2. 텍스트를 개인화하고 설정스타일 탭에 액세스하려면 새로 추가한 구성 요소를 클릭합니다.

  3. 상황별 도구 모음에서 다음 옵션을 사용하여 텍스트를 변경합니다.

    전자 메일 Designer에서 텍스트 편집 도구 모음을 표시하는 스크린샷입니다. {modal="regular"}

    • 텍스트 스타일 변경: 텍스트에 굵게, 기울임꼴, 밑줄 또는 취소선을 적용합니다.
    • 맞춤 변경: 텍스트를 왼쪽, 오른쪽, 가운데 또는 양쪽 맞춤 중에서 선택합니다.
    • 목록 만들기: 글머리 기호 또는 번호 목록을 텍스트에 추가합니다.
    • 제목 설정: 텍스트에 최대 6개의 제목 수준을 추가합니다.
    • 글꼴 크기: 텍스트의 글꼴 크기를 픽셀 단위로 선택합니다.
    • 이미지 편집: 텍스트 구성 요소에 이미지 또는 자산을 추가합니다.
    • 소스 코드 표시: 텍스트의 소스 코드를 표시합니다. 소스 코드는 수정할 수 없습니다.
    • 복제: 텍스트 구성 요소의 복사본을 추가합니다.
    • 삭제: 이메일에서 선택한 텍스트 구성 요소를 삭제합니다.
    • 개인화 추가: 개인화 필드를 추가하여 프로필 데이터의 콘텐츠를 사용자 정의합니다.
    • 조건부 콘텐츠 사용: 조건부 콘텐츠를 추가하여 구성 요소의 콘텐츠를 타겟팅된 프로필로 조정하십시오.
  4. 스타일 탭에서 텍스트 색상, 글꼴 모음, 테두리, 패딩, 여백 등의 다른 스타일 특성을 조정합니다.

    전자 메일 Designer의 텍스트 구성 요소에 대한 스타일 탭을 표시하는 스크린샷입니다. {modal="regular"}

구분선 divider

구분선 구성 요소를 사용하여 이메일의 레이아웃과 콘텐츠를 구성하기 위한 구분선을 삽입할 수 있습니다.

스타일 탭에서 선 색상, 스타일, 높이 등의 스타일 특성을 조정할 수 있습니다.

전자 메일 Designer에서 분할자 구성 요소를 추가하는 방법을 보여 주는 스크린샷입니다. {modal="regular"}

HTML HTML

HTML 구성 요소를 사용하여 기존 HTML의 일부를 복사하여 붙여 넣으십시오. 이를 통해 자유 모듈식 HTML 구성 요소를 만들어 외부 콘텐츠를 재사용할 수 있습니다.

  1. 구성 요소 ​에서 HTML 구성 요소를 드래그하여 구조 구성 요소에 놓습니다.

    이메일 Designer에서 HTML 구성 요소를 드래그 앤 드롭하는 방법을 보여 주는 스크린샷 {modal="regular"}

  2. 새로 추가된 구성 요소를 클릭한 다음 상황별 도구 모음에서 소스 코드 표시 ​를 선택하여 HTML을 추가합니다.

    이메일 Designer에서 HTML 구성 요소에 대한 소스 코드 옵션을 보여 주는 스크린샷. {modal="regular"}

NOTE
외부 콘텐츠가 이메일 DesignerAdobe 을 준수하도록 하려면 메시지를 처음부터 만들고 기존 이메일의 콘텐츠를 구성 요소로 복사하는 것이 좋습니다.

이미지 image

IMPORTANT
Assets 메뉴에 대한 액세스는 활성 Adobe Experience Manager as a Cloud Service 라이선스가 있는 사용자로 제한됩니다. 이 라이선스가 없으면 자산 메뉴를 사용할 수 없습니다.

이미지 구성 요소를 사용하여 컴퓨터의 이미지 파일을 전자 메일에 삽입합니다.

  1. 콘텐츠 메뉴에서 이미지 ​을(를) 구조 구성 요소로 끌어다 놓습니다.

    이메일 Designer에서 이미지 구성 요소를 드래그 앤 드롭하는 방법을 보여 주는 스크린샷 {modal="regular"}

  2. 에셋에서 이미지 파일을 선택하려면 찾아보기 ​를 클릭하십시오. 미디어 가져오기 ​를 선택할 수도 있습니다.

    Adobe Experience Manager에서 에셋을 업로드하고 추가하는 방법에 대한 자세한 내용은 Adobe Experience Manager as a Cloud Service 설명서를 참조하세요.

    이메일 Designer의 이미지 구성 요소에 대한 검색 옵션을 보여 주는 스크린샷. {modal="regular"}

  3. 폴더를 탐색하여 필요한 특정 에셋을 찾거나 검색 창을 사용하여 에셋을 효율적으로 찾습니다.

    찾고 있는 자산을 찾으면 선택 ​을 클릭하세요.

    전자 메일 Designer에서 자산 선택 프로세스를 보여 주는 스크린샷입니다. {modal="regular"}

  4. 새로 추가한 구성 요소를 클릭하고 설정 탭을 사용하여 이미지 속성을 설정합니다.

    • 이미지 제목 ​을 통해 이미지의 제목을 정의할 수 있습니다.
    • 대체 텍스트 속성을 사용하면 이미지에 연결된 캡션을 정의할 수 있습니다. 이는 대체 HTML 속성에 해당합니다.

    전자 메일 Designer의 이미지 구성 요소에 대한 설정 탭을 표시하는 스크린샷입니다. {modal="regular"}

  5. 대상자를 다른 콘텐츠로 리디렉션하기 위한 링크를 추가합니다. 자세히 알아보기

  6. 스타일 탭을 사용하여 여백, 테두리 및 기타 스타일과 같은 다른 스타일 특성을 조정합니다.

소셜 social

소셜 구성 요소를 사용하면 이메일 콘텐츠에 소셜 미디어 페이지에 대한 링크를 삽입할 수 있습니다.

  1. 구성 요소 메뉴에서 소셜 구성 요소를 드래그하여 구조 구성 요소에 놓습니다.

  2. 새로 추가된 구성 요소를 클릭합니다.

  3. 설정 탭의 소셜 필드에서 추가 또는 제거할 소셜 미디어를 선택합니다.

    전자 메일 Designer에서 소셜 구성 요소에 대한 설정 탭을 표시하는 스크린샷입니다. {modal="regular"}

  4. 이미지 크기 필드에서 아이콘의 크기를 선택합니다.

  5. 각 소셜 미디어 아이콘을 클릭하여 대상자가 리디렉션되는 URL ​을 구성합니다.

    이메일 Designer의 소셜 미디어 아이콘에 대한 URL 구성을 보여주는 스크린샷입니다. {modal="regular"}

  6. 필요한 경우 Source 필드에서 각 소셜 미디어의 아이콘을 변경합니다.

  7. 스타일 탭에서 스타일, 여백, 테두리 및 기타 스타일과 같은 다른 스타일 특성을 조정합니다.

recommendation-more-help
c39c2d00-ba9a-424b-adf9-66af58a0c34b