디자인·위젯 꾸미기

랜딩페이지를 우리 회사 분위기에 맞게 꾸미는 과정입니다. 대표 색상과 테마를 정하고, 이미지를 넣고, 신청을 늘려주는 위젯(접수 카운터·마감 타이머·팝업 등)을 켜 봅니다. 오른쪽 미리보기에 모든 변경이 바로바로 반영되니, 저장 전에 마음껏 바꿔 보세요.

---

1. 편집 화면 한눈에 보기

프로젝트 목록에서 프로젝트를 누르면 편집 화면이 열립니다.

• ① 기본정보 탭 — 색상, 테마, 이미지 등 디자인 설정이 모여 있습니다.
• ② 위젯 탭 — 접수 카운터, 타이머, 팝업 같은 부가 기능을 켜고 끕니다.
• ③ 미리보기 — 고객이 휴대폰에서 보게 될 모습입니다. 설정을 바꾸면 저장하기 전에도 즉시 여기에 반영됩니다.

2. 대표 색상 바꾸기

기본정보 탭을 아래로 내리면 대표 색상이 있습니다. 버튼과 주요 요소에 쓰이는 우리 브랜드의 색입니다.

• ① 색상 네모를 누르면 색상판이 열려 눈으로 고를 수 있습니다.
• ② 브랜드 색상 코드를 알고 있다면 #C2410C처럼 직접 입력해도 됩니다.

색을 바꾸면 미리보기의 다음 버튼이 바로 새 색으로 바뀝니다. 이렇게 확인하면서 우리 로고 색과 어울리는 색을 찾아 보세요.

3. 테마 — 밝기와 배경 연출

테마에서는 랜딩 전체의 분위기를 정합니다.

• 화면 모드: 라이트(밝은 배경, 기본) / ① 다크(어두운 배경, 고급스러운 인상)
• 배경 연출: ② 글로우(대표 색상의 은은한 광원)를 비롯해 네트워크·오로라·격자·도트 중에서 고를 수 있습니다.

다크 + 글로우를 고르면 미리보기가 이렇게 바뀝니다. 프리미엄 시공, 하이엔드 브랜드처럼 고급스러운 인상을 주고 싶을 때 잘 어울립니다.

4. 이미지 넣기 (콘텐츠 블록)

시공 사례 사진, 상세 설명 이미지는 콘텐츠 블록에서 넣습니다. ① 이미지 버튼을 누르면 이미지 블록이 하나 추가됩니다. (유튜브 영상, 텍스트, 지도, 이미지 슬라이더 등도 같은 방법으로 추가합니다.)

• ① 클릭하여 이미지 업로드를 누르고 내 컴퓨터의 사진을 고르세요.
• 업로드 영역 아래에 권장 크기가 적혀 있습니다 (본문 이미지는 너비 1440px 이상 권장). 권장 크기에 맞춰 올리면 어떤 휴대폰에서도 선명하게 보입니다.
• 일반 이미지는 5MB, 움직이는 GIF는 10MB까지 올릴 수 있습니다.

업로드가 끝나면 블록 안에 사진이 보입니다. 블록 왼쪽의 점 여섯 개 손잡이를 끌면 순서를 바꿀 수 있고, 오른쪽 빨간 휴지통으로 삭제합니다.

인터넷 연결 문제 등으로 업로드가 실패하면 위처럼 "이미지 업로드에 실패했습니다" 안내가 뜹니다. 잠시 후 같은 자리를 눌러 다시 업로드하면 됩니다.

5. 저장하기

설정을 바꾸면 화면 아래에 "저장하지 않은 변경사항이 있습니다" 막대가 나타납니다. ① 모두 저장을 누르면 지금까지의 디자인 변경이 저장됩니다. 미리보기에 보인다고 저장된 것이 아니니, 꾸미기를 마치면 꼭 저장을 누르세요.

6. 위젯 — 신청을 늘려주는 장치들

위젯 탭에는 랜딩에 얹을 수 있는 부가 기능이 카드로 나열되어 있습니다. 쓰고 싶은 위젯의 ① 스위치를 켜면 상세 설정이 열립니다. 하나씩 살펴볼게요.

6-1. 접수 카운터

"지금까지 몇 명이 신청했는지"를 보여줘서 신뢰를 높입니다.

• ① 표시 위치 — 폼 위/아래, 특정 블록 위/아래 중에서 고릅니다.
• ② 표시 문구 — {count} 자리에 실제 신청 수가 자동으로 들어갑니다. 예: "지금까지 {count}명이 견적을 신청했어요"

켜자마자 미리보기 맨 위에 문구가 나타나는 것을 확인할 수 있습니다.

6-2. 목표 카운터

"선착순 마감까지 30명 남았습니다"처럼 남은 자리를 보여줘 서두르게 만듭니다.

• ① 목표 인원수 — 이 숫자에서 실제 신청 수를 뺀 값이 표시됩니다.
• ② 앞/뒤 문구 — "선착순 마감까지 / 명 남았습니다"를 원하는 표현으로 바꾸세요.

6-3. 마감 타이머

이벤트 마감까지 초 단위 카운트다운을 보여줍니다.

• ① 마감 일시 — 달력에서 날짜와 시간을 고릅니다.
• ② 표시 형식 — 일/시/분/초 또는 시/분/초.
• 마감이 지나면 타이머 대신 "이벤트가 종료되었습니다" 문구(수정 가능)가 표시됩니다.

6-4. 실시간 접수 현황

"박OO님이 신청했습니다"처럼 최근 신청자를 팝업으로 보여주는 기능입니다. 신청자의 이름·전화번호 일부가 가려진 채 랜딩에 노출되기 때문에, 켜면 먼저 개인정보 안내가 나옵니다.

• ② 개인정보처리방침 예시 문구 복사 — 이 문구를 회사 개인정보처리방침에 넣어 주세요.
• ① 내용을 확인했으면 동의 스위치를 켭니다. 그래야 상세 설정이 열립니다.

동의 후 표시 건수·간격·위치를 정하면, 미리보기에 샘플 팝업("박OO님이 신청했습니다")이 주기적으로 나타납니다. 실제 랜딩에서는 진짜 신청자 정보가 가려진 채 표시됩니다.

6-5. 전화연결 플로팅

화면 구석에 떠 있는 전화 버튼입니다. 고객이 누르면 바로 전화가 걸립니다.

• ① 전화번호 — 상담 전화번호를 입력하세요.
• ② 위치 — 우측/좌측 하단. 기본은 모바일에서만 보이도록 되어 있습니다.

6-6. 팝업

방문하자마자, 또는 나가려는 순간에 띄우는 안내 팝업입니다.

• ① 실행 조건 — 페이지 로드 시 / 이탈 시도 시 / 스크롤 위치 / 시간 지연.
• ② 텍스트 — "지금 신청하면 시공 견적 10% 할인!" 같은 혜택 문구를 넣으세요. 이미지 팝업도 올릴 수 있습니다.

입력하는 즉시 미리보기에 팝업이 떠서 모양을 확인할 수 있습니다.

위젯 저장

위젯 설정을 마쳤으면 ① 위젯 저장을 누르세요. "위젯 설정이 저장되었습니다" 메시지가 보이면 완료입니다.

7. 카카오톡·페이스북 공유 모습 정하기 (SNS 공유 설정)

고객이 링크를 카카오톡으로 공유할 때 보이는 제목·설명·이미지입니다. 고급 탭의 "SNS 공유 설정"에서 정합니다.

• ① 공유 제목 — 예: "모던인테리어 무료 견적 신청"
• ② 공유 설명 — 한 줄 소개. 예: "우리집에 딱 맞는 인테리어, 30초 만에 무료 견적을 받아보세요."
• ③ 공유 이미지 — 권장 1200×630px, 가로형. 대표 시공 사진을 넣으면 좋습니다.
• ④ 공유 설정 저장을 눌러 마무리합니다.

이미지 업로드가 실패하면 이런 빨간 안내가 나타납니다. 인터넷 연결을 확인하고 다시 시도해 주세요.

---