이미지 카드

이미지 카드

이미지 카드는 사진이나 그림을 페이지에 추가해서 시각적인 매력을 높여주는 도구예요. 단순한 이미지 삽입을 넘어, 링크를 연결해서 방문자를 원하는 곳으로 유도하는 배너로도 활용할 수 있답니다.

1. 이미지 추가하기

페이지에 이미지 카드를 추가한 뒤, 폰 미리보기의 이미지 업로드하기 버튼을 누르면 이미지 추가하기 창이 열려요. 다음 세 가지 방법으로 이미지를 가져올 수 있어요.

• 내 이미지 (직접 업로드): 파일을 끌어다 놓거나 영역을 클릭해서 업로드할 수 있어요. 이미지 1장당 최대 10MB.
• 이미지 검색: Pexels의 고품질 무료 사진을 검색해서 바로 삽입할 수 있어요.
• GIF 검색: Giphy의 GIF를 검색해서 움직이는 이미지로 활용할 수 있어요.

업로드한 이미지는 내 이미지 라이브러리에 저장돼서 다른 카드에서도 재사용할 수 있어요. 자주 쓰는 이미지는 즐겨찾기에 추가해두면 빠르게 찾을 수 있고, 필요 없어진 이미지는 휴지통에서 복원하거나 영구 삭제할 수 있어요.

2. 이미지 관리하기

이미지를 선택한 뒤 다음 작업을 할 수 있어요.

• 이름 설정: 이미지마다 이름을 붙여두면 라이브러리에서 찾기 편해요.
• 변형: 좌우 반전, 회전으로 방향 조정.
• 복사 / 다운로드 / 삭제: 라이브러리 안에서 동일 이미지 복제, 컴퓨터로 다운로드, 휴지통으로 이동.

3. 🎨 이미지 디자인 꾸미기

3.1 비율 선택하기

업로드한 이미지의 가로세로 비율을 선택할 수 있어요.

• 원본: 업로드한 이미지 비율 그대로 표시
• 1:1: 정사각형
• 가로: 가로형 (4:3 등)
• 세로: 세로형 (3:4 등)

3.2 크기 조절하기

슬라이더로 카드 영역 안에서 이미지가 차지하는 크기를 조절할 수 있어요.

3.3 모양 변경하기

이미지의 모서리 모양을 선택해요.

• 각진 모양: 직각 모서리
• 둥근 모양: 라운드 모서리
• 원형 / 그 외: 모양 옵션에서 추가 선택

3.4 정렬하기

이미지를 카드 안에서 왼쪽 / 가운데 / 오른쪽 중 원하는 위치로 정렬할 수 있어요.

4. 이미지에 링크 걸기

링크 연결 섹션에서 이미지를 탭했을 때 이동할 URL을 설정할 수 있어요. URL 열기 외에도 전화 연결, 이메일, 페이지 이동 등 다양한 연결 방식을 지원해요. 제품 페이지나 예약 링크로 연결하면 클릭 유도 효과가 뛰어난 배너로 활용할 수 있답니다.

5. 카드 디자인 (배경·테두리·여백)

카드 디자인 섹션을 펼치면 이미지 카드 자체의 시각 요소를 다듬을 수 있어요.

• 배경: 카드 배경색·이미지 지정
• 테두리: 두께·색상으로 카드 경계 강조
• 모서리: 카드의 모서리 둥글기 (각진 / 둥근)
• 내부여백 (Padding): 카드 안쪽, 이미지와 카드 경계 사이 공간
• 외부여백 (Margin): 카드와 카드 사이 공간

💡 외부여백 활용 팁: 위 스크린샷처럼 첫 번째 이미지는 외부여백 0으로 설정하면 화면을 가득 채우는 풀-블리드(full-bleed) 표지처럼 보이고, 두 번째 이미지는 외부여백을 24 정도로 주면 다음 콘텐츠와 시각적으로 분리돼요. 카드 성격에 따라 자연스럽게 강·약을 만들 수 있답니다.

6. 레이어 추가하기

레이어 추가 섹션에서는 이미지 위에 텍스트, 도형, 아이콘 등을 겹쳐 배치할 수 있어요. 이벤트 포스터처럼 이미지 위에 행사명·날짜·태그를 얹을 때 유용해요.

💡 활용 팁: 이미지에 링크를 걸면 클릭 가능한 배너가 돼요. 이벤트 포스터, 제품 사진에 구매 페이지 링크를 연결해 보세요. 외부여백을 적절히 조절하면 한 페이지 안에서 시각적 리듬도 만들 수 있어요.