러브인포 · 페이지
페이지 만들기와 관리
러브인포 홈은 「페이지」를 옆으로 넘기는 구조입니다. 페이지는 보통 페이지(블록 쌓기)와 HTML 페이지 두 종류.
페이지 종류
- 보통 페이지
- 「+ 블록 추가」로 블록을 넣습니다.
- 블록 목록의 ⠿ 손잡이를 끌거나 ↑↓로 순서(폰도 됨). ⧉로 복제.
- ✎를 누르면 그 블록이 그 자리에서 펼쳐져 고치고, 「접기 ▴」로 닫습니다.
- HTML 페이지
- 코드를 통째로 붙여넣는 페이지. 파일 불러오기 가능. 머리글은 자동으로 숨겨집니다(체크로 다시 켬). HTML 페이지·블록 참고.
사진 자리img/li-pages-edit.png✎ 편집 창
- 여는 법 — 홈 오른쪽 위 ☰ 메뉴 → ✎ EDIT를 누르면 바로 「편집」 창이 열립니다.
- ☰ 메뉴는 아이콘 상자 + 이름 카드(TEMPLATE · EDIT, 맨 아래 넓은 LOGOUT)이고, 편집 중엔 EDIT 상자가 포인트색입니다.
- 예전 MOBILE 버튼은 없어졌습니다. 폰 화면은 편집 창 미리보기의 MOBILE로 보면 됩니다.
- 넓은 화면에서는 왼쪽 메뉴 · 가운데 편집 · 오른쪽 미리보기 세 칸이고, 지금 보고 있던 페이지가 골라진 채로 열립니다.
- 왼쪽 메뉴 맨 위 PAGES에 페이지가 P1 · P2 … 로 있습니다. 누르면 그 페이지를 창 안에서 바로 고치고, 아래 DESIGN · HOME · MORE는 꾸미기 칸이에요(꾸미기 창). 페이지를 오가거나 꾸미기 칸으로 가도 고친 내용은 그대로 남아요.
- PAGES 아래 「+ 새 페이지 · </> HTML 페이지 · ☰ 페이지 관리」.
- 메뉴 위 «를 누르면 왼쪽 메뉴가 번호만 남게 접히고 »로 다시 펼칩니다. 고른 상태는 이 브라우저에 기억돼요.
- 창 밖을 눌러도 닫히지 않습니다. 오른쪽 위 ✕로 닫으면 편집이 끝나고, 저장하지 않은 내용이 있으면 「저장하고 닫을까요?」를 한 번 물어봐요.
- 폰에서는 왼쪽 메뉴 대신 맨 위에 지금 칸 이름이 큰 제목으로 보여요(예: 01 · 색 · 글씨 ⌄). 누르면 페이지 · 꾸미기 칸을 고르는 창이 열려요.
- 그 아래 PAGES 줄에 페이지가 P1 · P2 … 칩으로 늘 보이고, 옆으로 밀면 「+ 새 페이지 · HTML 페이지 · 페이지 관리」가 이어져요. 칩을 누르면 그 페이지 편집이 따로 열려요. (2026.10.20)
사진 자리img/li-edit-phone.png
사진 자리img/li-menu.png
사진 자리img/li-edit-tools.png저장 · 페이지 추가 · 삭제
- 저장 — 아래 줄의 ● 저장을 눌러야 홈에 남습니다. 키보드는 Ctrl+S(맥은 ⌘S).
- 바뀐 내용이 있으면 점과 테두리가 포인트색으로 바뀌고 왼쪽에
● UNSAVED가 뜹니다. - 저장해도 창은 그대로라 이어서 고칠 수 있습니다.
- 바뀐 내용이 있으면 점과 테두리가 포인트색으로 바뀌고 왼쪽에
- 추가 — 새 페이지를 만들면 저장 옆에 「+ 페이지 추가」가 생깁니다. 누르면 그 페이지가 왼쪽 목록에 들어가요(비어 있어도). 아무것도 안 넣고 다른 곳으로 가면 빈 페이지는 만들어지지 않습니다.
- 삭제 — 저장 줄 오른쪽 끝 빨간 페이지 삭제 — 「삭제할까요?」를 한 번 더 확인한 뒤 휴지통으로 옮겨요(30일 보관 · 지운 직후 「되돌리기」). 확인 창은 「취소」에 먼저 놓여 있어 엔터 한 번에 지워지지 않아요.
- 제목을 비운 페이지는 홈에는 제목 없이 보이고, 편집 목록에서는 「HTML 페이지」 · 「블록 페이지」로 보여요.
- 페이지 설정(폭 · 비밀번호 · 숨김 · 주소 이름 · 페이지 디자인)은 접혀 있고, 한 줄로 지금 상태가 보입니다. 「펼치기」로 열어요.
사진 자리img/li-edit-new.png편집창 미리보기
- 넓은 화면(1000px 이상)에서는 오른쪽에 고치는 중인 페이지가 보입니다. 제목 · 블록 · 디자인을 바꾸면 저장 전에도 바로 반영돼요. 잠긴 페이지 · 숨긴 페이지도 편집 중인 내용 그대로.
- 미리보기는 실제 기기 화면 한 장 그대로입니다. MOBILE은 폰(390×760), PC는 PC(1280×800) 화면. 방문자가 처음 보는 만큼만 보이고, 그 아래는 미리보기 안에서 스크롤하면 나옵니다. 칸이 좁으면 비율대로 줄어들어요.
- 위쪽 MOBILE / PC는 꾸미기 미리보기와 같이 바뀌고, 고른 쪽은 이 기기에 기억됩니다.
- HTML 페이지도 보통 페이지와 같은 미리보기예요. 방명록 · 배너 자리(
data-li-slot)도 미리보기에 그대로 들어옵니다. - 숨긴 페이지를 HTML 페이지의 배너 · 방명록 자리용으로 쓰고 있으면, 그 HTML 페이지가 대신 보이고 위에 「이름」 안 자리라고 적혀요.
- BGM 플레이어는 PC 미리보기에 보이고(소리는 나지 않아요), MOBILE 미리보기에선 09 BGM 「미리보기에서 끌어 놓기」를 켠 동안만 보여요.
- MOBILE 미리보기 아래에 사파리 주소창 · 홈 바 자리가 띠로 보여요 — 실제 폰에서 보이는 화면은 띠 위까지예요.
- 미리보기를 눌러도 HTML의 처음 애니메이션이 다시 재생되지 않아요. 내용을 바꿨을 때만 다시 그립니다.
사진 자리img/li-page-preview.png관리
- 페이지 관리 — 편집 창 왼쪽 PAGES의 ☰ 페이지 관리. 넓은 화면에서는 편집 창 안에 열립니다.
- 전체 페이지(숨김 포함)를 ⠿ 끌기 · ↑↓로 순서 바꾸고, 이름을 누르면 그 페이지 편집으로 갑니다.
- 바꾼 순서는 「저장」을 눌러야 남습니다.
- 숨기기 — 방문자에겐 없는 페이지가 되고 편집 모드에서만 보입니다. 체크를 풀면 그대로 복귀.
- 주소 이름 —
notice처럼 적어두면luvinfo.me/핸들#notice로 그 페이지가 바로 열립니다. 링크 블록의 「+ 내 페이지」로 메뉴처럼 연결. - 페이지 비밀번호 — 그 페이지만 잠깁니다(대문과 별개).
- 저장하면 페이지 내용이 그 비밀번호로 암호화돼서, 비밀번호를 모르면 누구도(서버에서 꺼내 봐도) 내용을 볼 수 없습니다.
- 나는 비밀번호 없이 그대로 편집할 수 있고, 방문자는 한 번 풀면 같은 창에선 다시 묻지 않습니다.
- 짧은 숫자보다 글자를 섞은 긴 비밀번호가 안전합니다. 예전 방식으로 잠근 페이지는 비밀번호를 다시 넣고 저장하면 암호화로 바뀝니다.
- 잠금 화면 디자인 6종 · 안내 문구. 키패드는 숫자 비번일 때만.
- 페이지 폭 — 기본(620px) · 넓게(960px) · 화면 꽉 채움.
- 「화면 꽉 채움 + 위아래 여백 없이」는 HTML 페이지뿐 아니라 보통(블록) 페이지에도 적용됩니다. 카드 끈 HTML 블록이 양옆 · 위아래 여백 없이 붙습니다.
- 고정 폭 HTML은 「폰에서는 축소해서 전체 보이기」를 켜면 잘리지 않습니다.
- 바깥 바탕색(HTML 페이지) — 꽉 채운 HTML 아래 여백 · 폰에서 끝까지 당겼을 때 보이는 색.
- 자동이면 HTML의
body배경색을 재서 그 페이지에서만 바깥도 같은 색으로 칠합니다(다른 페이지로 가면 원래 홈 색). - 배경이 투명 · 그라데이션뿐이면 못 재니 「직접 고르기」로.
- 스크롤은 그대로라 폰에서 주소창 접기도 됩니다.
- 자동이면 HTML의
- 넘김 버튼 — 점 · 화살표 · 이름 알약 · 숨기기. 버튼 모양(얇은 선·로마 숫자·별·세로 점)과 넘어갈 때 효과는 꾸미기 03 페이지 · 카드에서. ←/→ 키와 스와이프로도 넘어갑니다.
- 제목 꾸미기 — 제목 디자인 5종 + 페이지마다 제목 이미지(위/아래).
- 폰에서도 — 아래 줄이 PC와 같은 「● 저장 · 페이지 삭제」예요(취소 · 확인 버튼 없음). 저장하면 편집 창이 닫히고 홈으로 돌아갑니다. 편집 창 글씨는 폰에서도 작게(입력칸 14px · 코드 12px), 아이폰에서 입력칸을 눌러도 화면이 저절로 확대되지 않아요.
- 삭제 — 저장 줄 오른쪽 「페이지 삭제」. 지운 페이지는 휴지통에 30일 보관(지운 직후 토스트 「되돌리기」). 휴지통 참고.
사진 자리img/li-phone-save.png
사진 자리img/li-pages-list.png
사진 자리img/li-pages-lock.png