Iterable에 맞춤형 이미지를 추가하는 방법
이미 Iterable로 전송하고 있는 Handlebars 필드를 사용하여, 각 사용자에 대해 이미지에 이름, 예약 내역 또는 잔액을 표시하세요.
최초 게시일: Iterable에 저장된 데이터를 사용자가 보는 이미지에 반영하세요.
Iterable 템플릿은 이미 Handlebars를 통해 프로필 및 이벤트 데이터를 불러옵니다. Sendtric 맞춤형 이미지 한 걸음 더 나아가, 이러한 정보를 글꼴과 레이아웃을 활용해 이미지로 표현해 보세요. 예를 들어, 사용자의 이동 경로가 표시된 탑승권 스타일의 그래픽이나 최신 잔액이 표시된 리워드 카드 등이 있습니다. 이 이미지는 이메일을 열면 생성됩니다.
Iterable의 드래그 앤 드롭 편집기에는 생동감 넘치는 이미지 Image 블록에 있는 이 옵션은 Handlebars가 포함된 URL에서 이미지를 불러오며, Sendtric의 공식 문서에서는 해당 이미지를 생성하기 위해 외부 이미지 서비스를 활용하도록 안내하고 있습니다. Sendtric이 바로 그러한 서비스 중 하나입니다. 사용자가 이미지를 디자인하면, 해당 URL에 Iterable 필드 정보가 포함됩니다.
Iterable에서 맞춤형 이미지를 활용해 할 수 있는 일
- 여행 및 예약 요약: 예약 내역에 포함된 출발 도시, 도착 도시 및 날짜를 하나의 여행 정보 그래픽에 정리한 것입니다. 참조: 이미지에 삽입된 맞춤 텍스트 예를 들면.
- 앱의 주요 이정표: 축하 이메일에 사용자 지정 프로필 필드의 “30회 운동 완료” 또는 “12개 레슨 완료”와 같은 내용을 포함합니다.
- 충성도 관련 진술: 월간 여정 이메일에 포함된 카드 이미지의 포인트, 등급 및 회원 이름.
- 연말 결산: 하나의 배경 위에 사용자 프로필의 여러 통계 항목을 표시하는 것, 이는 흔히 다음과 같은 용도로 사용됩니다. 한 해를 돌아보며 이메일.
| 이미지 기능 | Free | Micro | Standard | 권력과 기업 |
|---|---|---|---|---|
| 이미지별 맞춤 텍스트 레이어 | 1 | 2 | 4 | 20 |
| 사용자 정의 이미지 레이어(로고, 제품) | No | No | Yes | Yes |
| 단색 배경 | No | No | Yes | Yes |
| 투명한 배경 | No | No | No | Yes |
Iterable에 맞춤형 이미지를 추가하는 방법
1단계: 이미지 디자인하기
Sendtric에서 다음으로 이동하세요. 이미지 맞춤 설정 그리고 클릭하세요 새로 만들기. 미디어 라이브러리에서 배경을 선택하거나, 단색 또는 투명한 캔버스를 선택한 다음, 다음을 추가하세요. 동적 텍스트 각 값에 대한 레이어를 만듭니다. 텍스트는 줄바꿈은 되지만 크기가 줄어들지는 않으므로, 예상되는 가장 긴 값에 맞춰 각 텍스트 상자의 크기를 조정하세요.
2단계: 각 레이어의 ‘Iterable’ 필드에 값을 입력합니다.
각 다이내믹 텍스트 레이어에 대해 변수 이름을 소문자로 지정하십시오. 변수 이름 그리고 Iterable Handlebars 표현식을 다음 위치에 넣으세요 ESP 태그 병합, 예를 들어 {{firstName}}. 필드는 프로젝트마다 다르므로, 사용자 프로필에 표시된 이름 그대로를 사용해야 하며, 중첩된 필드의 경우 점 표기법도 포함해야 합니다. 예를 들어, {{address.city}} 해당 도시가 주소 객체 내에 포함된 경우. 다음을 추가하세요. 대안 텍스트 값이 없는 사용자의 경우.
3단계: 코드를 저장하고 복사하기
저장 이미지. 처음 저장하면 코드 상자가 나타나며, 각 변수가 이미지 URL에 추가되고 사용자의 Iterable 표현식으로 채워집니다. 정렬 방식을 선택한 후 클릭하세요. 코드 복사.
4단계: HTML 블록에 붙여넣기
Iterable 템플릿을 열고 다음을 클릭하세요. 디자인 편집. 드래그 앤 드롭 편집기에서 다음을 드래그하여 HTML ~에서 차단 내용 타브 키를 눌러 원하는 위치로 이동한 다음, 해당 위치를 선택하고 HTML 편집기에 코드를 붙여넣으세요. WYSIWYG 또는 나란히 보기 편집기에서는 소스 코드에 코드를 붙여넣으세요.
5단계: 실제 사용자를 대상으로 미리 보기
클릭 미리 보기, 사용자의 이메일 주소(또는 사용자 ID)를 입력하고 클릭하세요 사용자 데이터 불러오기 해당 값이 포함된 이미지를 확인해 보세요. 사용자 이름이 긴 계정과 해당 필드가 비어 있는 계정을 각각 하나씩 시도해 보세요. 그런 다음 증빙 자료를 보내주세요. 자신에게, 이 기능은 사용자의 프로필 정보로 해당 필드를 자동으로 채워줍니다.
HTML 대신 이미지 블록 사용하기
Image 블록을 그대로 두고 싶다면, src Sendtric의 코드에서, 다음을 끌어다 놓으세요. 이미지 차단, 켜기 생동감 넘치는 이미지 그리고 해당 주소를 다음 위치에 붙여넣으세요. 동적 URL. 디자인하는 도중에 블록이 비어 있는 것처럼 보인다면, 체크인하세요 미리 보기 사용자의 데이터가 로드된 상태에서.
Iterable 또는 Sendtric의 대안 처리 방식
Sendtric의 대안 Text 기능을 사용하여 빈 값을 처리하거나, 태그 내에서 Iterable의 헬퍼를 다음과 같이 사용할 수 있습니다. {{defaultIfEmpty firstName 'there'}}. 표현식이 이미지의 큰따옴표로 묶인 주소 안에 위치하므로, 기본값에는 작은따옴표를 사용하세요. Iterable이 기본값을 제공하면 Sendtric의 대안 값은 절대 표시되지 않습니다.
Iterable 맞춤형 이미지 자주 묻는 질문
프로필 필드뿐만 아니라 이벤트 데이터도 사용할 수 있나요?
네. 이메일을 렌더링할 때 Iterable이 해결할 수 있는 모든 Handlebars 값은 레이어에 포함될 수 있으며, 여기에는 여정이나 캠페인을 트리거한 이벤트의 필드도 포함됩니다. Iterable 문서에 따르면, 프로필 필드와 이름이 동일한 이벤트 필드가 우선 적용되며, {{profile.fieldName}} 프로필 값을 명시적으로 읽습니다.
값에 공백이나 특수 문자가 포함되어 있다면 어떻게 될까요?
특정 필드에 공백이나 다음과 같은 문자가 포함될 수 있는 경우 & 또는 #, 이를 Iterable의 urlEncode 예를 들어, 블록 헬퍼 {{#urlEncode}}{{city}}{{/urlEncode}}, 그러면 이미지 주소가 그대로 유지됩니다. 그런 다음 ‘미리보기’에서 결과를 확인하세요.
해당 필드가 비어 있는 사용자에게는 무엇이 표시되나요?
'대안 텍스트'가 설정되어 있으면 사용자에게는 대안 텍스트만 표시되므로, 이를 완전한 문장으로 작성해야 합니다. 이 설정이 없으면 변수 주변의 단어를 포함해 레이어 전체가 숨겨집니다.
보낸 후에 이미지를 수정할 수 있나요?
네. Sendtric에서 저장하면 다음에 이메일을 열었을 때부터 발송된 모든 이메일의 이미지가 변경됩니다. 렌더링된 버전은 값의 조합별로 약 1시간 동안 캐시되며, 저장하면 해당 캐시가 지워집니다.
미리보기도 조회수에 포함되나요?
Sendtric 편집기의 미리보기에서는 그렇지 않습니다. 이미지를 실제로 불러올 때마다(열어서 반복해서 확인하는 Iterable 교정본 포함) 해당 현상이 나타납니다.
이 가이드에서는 Sendtric의 기능 중 하나를 다룹니다. 이메일 맞춤 설정 플랫폼. 모든 맞춤형 이미지 옵션 및 예시는 메인 페이지를 참조하십시오.
Iterable 가이드 더 보기
- 카운트다운 타이머 - 반복 가능한 객체에 카운트다운 타이머를 추가하는 방법
- 카운트다운 타이머 - 반복 가능한 객체에 동적 타이머 추가하기
- 실시간 설문조사 - Iterable에 실시간 설문조사를 추가하는 방법
- 규칙 기반 이미지 - Iterable에 규칙 기반 이미지를 추가하는 방법
- 변화무쌍한 날씨 - Iterable에 변화무쌍한 날씨 정보를 추가하는 방법
- 중요 알림 - Iterable에 중요 알림을 추가하는 방법
- 소셜 프루프 카운터 - Iterable에 소셜 프루프 카운터를 추가하는 방법
다른 플랫폼을 사용 중이신가요? 다음을 참조하세요. 모든 Sendtric 연동 기능.
