직접 디자인한 이미지 버튼 추가하기

텍스트 위젯을 통해 포토샵 등을 사용해 직접 제작한 이미지 버튼을 추가할 수 있습니다. 이미지 위젯을 사용해, 이미지 버튼을 삽입하는 것도 가능하지만, 정밀한 편집 및 이미지 크기 조절이 필요하신 경우 다음 도움말을 참고해 추가할 수 있습니다.

이 도움말에서는 버튼을 예시로 설명하지만, 필요에 따라 버튼이 아닌 다른 디자인을 사용하셔도 됩니다.

중요: 이 방법을 통해 이미지 버튼을 추가하시는 경우 모든 크기의 디스플레이에 대응이 어려울 수 있습니다. 꼭 필요한 경우가 아닌 한 이미지는 이미지 위젯을 사용하실 것을 권장합니다.

1단계: 이미지 버튼 추가 및 링크 걸기

직접 디자인한 이미지를 업로드하고, 클릭 시 이동하도록 링크를 추가합니다.

  1. 디자인 모드에 접속합니다. 접속방법
  2. 왼쪽 상단의 위젯 추가 + 아이콘을 클릭합니다.
  3. 텍스트 위젯을 클릭합니다.
  4. 텍스트 위젯을 마우스로 더블-클릭합니다.
  5. 텍스트 도구의 이미지 첨부  버튼을 클릭합니다.
  6. 내 PC에서 업로드할 파일을 선택하고 확인을 클릭합니다.
  7. 아래 그림처럼 옵션 메뉴가 나타나면 링크 버튼을 클릭합니다. 옵션 메뉴가 나타나지 않는 경우, 업로드한 이미지를 마우스로 클릭해 보세요.

  8. 링크(URL)를 입력합니다. (예: http://imweb.me/faq)
  9. 삽입을 클릭해 링크 추가를 완료합니다.

2단계: 이미지 크기 편집하기

업로드한 이미지의 크기를 조절할 수 있습니다.

  1. 업로드한 이미지를 마우스로 클릭합니다.
  2. 옵션 메뉴가 나타나면 이미지 크기  버튼을 클릭합니다.
  3. 높이를 숫자로 입력하고, 업데이트를 클릭합니다.
    참고: 둘 중 하나만 입력해도 상대 비율에 따라 자동 조절됩니다.

3단계: 이미지 정렬하기

업로드한 이미지 버튼은 정렬 기능을 통해 텍스트 위젯 영역 안에서 왼쪽/가운데/오른쪽으로 정렬할 수 있습니다.

  1. 이미지를 마우스로 클릭합니다.
  2. 옵션 메뉴가 나타나면 정렬  버튼을 클릭합니다.
  3. 왼쪽, 가운데, 오른쪽 중 하나를 선택합니다.
  4. 텍스트 에디터 바깥 영역을 클릭해 텍스트 에디터를 종료합니다.

4단계: 작동여부 확인하기

  1. 디자인 모드 오른쪽 상단의 미리보기 아이콘을 클릭해 작동여부를 확인합니다.
  2. 문제가 없다면 디자인 모드로 돌아가 게시하기 버튼을 클릭해 적용합니다.
목록으로

시작이 어려우신가요?

교육 받아보시면 쉽습니다.

온라인 교육 바로가기

한 번 이용하면 팬이 됩니다.

아임웹에서 당신의 생각을 표현해보세요.
905.7K
누적 사이트 이용 수
이미 수만 명이 아임웹 팬이 되어
각자의 생각을 표현하고 있습니다.
315
일 평균 사이트 개설 수
지금 이 순간에도 매일
새로운 브랜드가 소개되고 있습니다.
1.9K
전국 파트너/리셀러 수

아임웹과 함께하는 제휴사

아임웹은 페이팔, KG이니시스, 네이버, KCP, 나이스페이, 이지페이, 엑심베이 공식파트너입니다.