커뮤니티 게시글

팁·노하우

[ 머블로 시작하기 ㉕ ] 매뉴얼 — 사용설명서를 책 한 권으로 엮어 홈페이지에 올리기

우아한삽질 2026-11-05 11:18 조회 4 수정됨

안녕하세요, 여러분! 우아한삽질입니다!

지난 글에서는 AI 설정으로 블록 에디터의 HTML 칸을 AI에게 맡겨 봤는데요.
오늘은 플러그인 목록에 조용히 들어 있던 매뉴얼입니다.

가구를 사 간 손님이 “오일은 언제 발라요?”, “물 자국은 어떻게 지워요?”를 물어 올 때마다 같은 답을 다시 적고 계시다면, 그 답을 책 한 권으로 엮어 홈페이지에 올려 둘 차례입니다.
오늘은 플러그인 켜기 → 책 만들기 → 페이지 쓰고 목차 엮기 → 메뉴에 걸기 → 홈에 목차 블록 놓기까지 한 번에 갑니다.
지난 글을 아직 안 보셨다면 아래 글부터 확인해 주세요!

[ 머블로 시작하기 ㉔ ] AI 설정 — API 키 하나로 블록 에디터에서 HTML을 AI에게 맡기기 →

그럼 바로 시작해 보겠습니다!

1. 매뉴얼은 책 한 권 — 책·페이지·목차가 어떻게 이어지는지

매뉴얼 한눈에 보기

매뉴얼 플러그인에서 다루는 건 두 가지뿐입니다. 책과 페이지. 책은 ‘원목 가구 관리 설명서’ 같은 한 권이고, 페이지는 그 안에 들어가는 ‘자리 잡기’, ‘오일 바르기’ 같은 한 꼭지입니다. 페이지는 상위·하위로 겹칠 수 있어서, ‘평소 손질’ 아래에 ‘먼지 닦기’와 ‘오일 바르기’를 넣는 식으로 장과 절을 만듭니다.

손님 화면에서는 책 한 권이 한 화면에 펼쳐집니다. 왼쪽에 목차, 오른쪽에 본문이 순서대로 이어지고, 읽는 위치를 따라 목차 표시가 움직입니다. 게시판처럼 글을 하나씩 열었다 닫았다 하지 않아도 되고, 페이지마다 주소가 따로 있어서 “오일 바르는 법은 여기요” 하고 그 자리로 바로 보내 드릴 수도 있습니다.
글을 올리는 곳이 이미 여럿이라 헷갈리실 텐데, 기준은 도식 가운데 줄입니다. 날짜순으로 쌓이는 소식은 게시판, 짧은 질문과 답은 FAQ, 꾸며서 보여 주는 한 장은 블록 페이지, 그리고 순서대로 읽어야 하는 여러 장은 매뉴얼입니다. 한결 공방은 가구 손질법을 책으로 엮어 보겠습니다.

2. 매뉴얼 플러그인 켜기 — 먼저 들어와 있는 책 두 권 정리하기

매뉴얼 플러그인 켜기

‘사이트 설정’ → ‘확장 기능’의 플러그인 목록에서 ① ‘매뉴얼’을 체크하고 ② ‘저장’을 누릅니다. 설치 화면은 따로 없습니다. 저장하고 나면 사이드바 플러그인 묶음 맨 아래에 ‘매뉴얼 관리’가 생깁니다.

매뉴얼 관리 첫 화면

처음 열었는데 책이 벌써 두 권 있습니다. Mublo 게시판 매뉴얼(12페이지)과 Mublo Shop 매뉴얼(30페이지)인데요, 머블로가 운영자 보라고 넣어 둔 책입니다. ① ‘번들 매뉴얼 추가’를 눌러 보면 이 두 권에는 ‘추가됨’이 붙어 있고, 스킨을 직접 만드는 분을 위한 ‘스킨 제작 가이드’를 한 권 더 가져올 수 있게 되어 있습니다.

문제는 이 책들이 손님 화면에도 그대로 걸린다는 점입니다. 가구 공방 홈페이지에 게시판 운영법이 보일 이유는 없겠죠?! ② ‘프론트 노출’ 스위치를 꺼서 ‘숨김’으로 바꿔 주세요. 누르는 즉시 반영됩니다. 숨긴 책은 손님 쪽 목록에서 빠지고, 주소를 직접 쳐도 “요청하신 매뉴얼을 찾을 수 없습니다.”가 나옵니다. 지우는 게 아니라서 내용은 그대로 남고 관리자에서는 계속 고칠 수 있습니다.
이제 우리 책을 만들 차례입니다. ③ ‘매뉴얼 추가’를 누릅니다.

3. 책 만들기 — 제목과 주소, 설명 한 줄

책 만들기

책 한 권에 적을 것은 다섯 가지입니다. ① 제목은 ‘원목 가구 관리 설명서’. ② 슬러그는 이 책의 주소입니다. wood-care라고 적으면 책 주소가 /manual/wood-care가 됩니다. 영문 소문자·숫자·하이픈만 쓸 수 있고, 비워 두거나 한글을 적으면 ac0b3b68 같은 뜻 없는 글자로 만들어지니 직접 적어 주시는 편이 좋습니다. 이 주소가 나중에 손님에게 보내는 링크가 되니까요.

③ 설명은 손님 화면의 책 카드와 책 머리에 그대로 나오는 한두 줄입니다. ④ 정렬 순서는 책이 여러 권일 때의 순서인데, 번들 책들이 10과 20이라 저희는 1을 넣어 맨 위로 올렸습니다. 상태는 ‘활성’ 그대로 둡니다. ⑤ ‘저장’을 누르면 목록으로 돌아갑니다.

책이 생긴 목록

목록 맨 위에 새 책이 생겼고 페이지는 아직 0입니다. 표지만 있는 책이죠. ① ‘페이지’ 버튼이 이 책의 목차로 들어가는 문이고, ② 연필과 휴지통은 책 정보 수정과 삭제입니다. 책을 지우면 안에 든 페이지도 모두 함께 지워지니 휴지통은 조심해 주세요.
‘페이지’를 눌러 들어갑니다.

4. 페이지 쓰고 목차 엮기 — 상위·하위, 끌어서 순서 바꾸기

페이지 쓰기

빈 목차 화면에서 오른쪽 위 ‘페이지 추가’를 누르면 페이지 등록 화면입니다. ① 제목은 목차에 나올 이름, ② 슬러그는 이 페이지의 주소(first-day)입니다. 책과 마찬가지로 비우면 뜻 없는 글자로 만들어지고, 한 책 안에서 같은 슬러그를 또 쓰면 뒤에 -2가 붙습니다. ③ 상위 페이지는 지금은 ‘최상위’ 그대로, ④ 정렬 순서와 상태도 그대로 둡니다.

⑤ 본문은 게시판 글쓰기와 같은 편집기라 굵게, 목록, 링크, 이미지, 표를 그대로 쓸 수 있습니다. 첫 페이지 ‘처음 받으셨을 때’에는 가구가 도착한 날 살펴볼 곳을 두 문단으로 적었습니다. 한 페이지는 화면을 한두 번 내릴 만큼만 쓰고, 길어지면 하위 페이지로 쪼개는 편이 읽기 좋습니다. ⑥ ‘저장’.

첫 페이지가 생긴 목차

목차 트리에 첫 줄이 생겼습니다. 같은 깊이의 페이지를 더 만들 때는 ① ‘페이지 추가’, 이 페이지 아래에 들어갈 페이지를 만들 때는 줄 오른쪽의 ② ‘+’를 누릅니다. 그 옆 연필은 수정, 휴지통은 삭제인데 하위 페이지가 있으면 같이 지워집니다.

하위 페이지 쓰기

‘+’로 들어오면 상위 페이지에 ‘처음 받으셨을 때’가 미리 골라져 있습니다. 제목 ‘자리 잡기’, 슬러그 placement, 본문을 적고 저장하면 방금 그 줄 아래에 한 칸 들여쓴 줄로 들어갑니다. 같은 방법으로 ‘평소 손질’(먼지 닦기·오일 바르기), ‘문제가 생겼을 때’(물 자국·작은 흠집·공방에 맡기기)까지 열 장을 채웠습니다.

끌어서 목차 정리

쓰다 보면 순서가 틀어집니다. 저희는 ‘문제가 생겼을 때’를 먼저 만드는 바람에 ‘평소 손질’이 그 뒤에 가 있었고, ‘공방에 맡기기’는 하위가 아니라 맨 바깥에 만들어 버렸습니다. 고치는 방법은 끌기입니다. 줄 왼쪽의 점 여섯 개짜리 손잡이를 잡고 ① ‘평소 손질’을 위로 끌어 올리고, ② ‘공방에 맡기기’를 ‘작은 흠집’ 아래로 끌어 넣었습니다. 하위 페이지는 상위를 끌면 같이 따라옵니다.

여기서 두 가지를 꼭 기억해 주세요. 첫째, 끌어 놓기만 해서는 저장되지 않습니다. 순서를 바꾸는 순간 오른쪽 위에 나타나는 ③ ‘순서 저장’을 눌러야 “목차 순서가 저장되었습니다”가 뜹니다. 둘째, 끄는 동안에는 줄마다 하위 자리가 열려서, 놓는 위치가 조금만 어긋나도 엉뚱한 줄의 하위로 들어갑니다. 저희도 ‘평소 손질’이 ‘첫 일주일’ 밑으로 들어가 버렸습니다. 놓은 뒤 들여쓰기를 확인하고, 꼬였으면 저장하지 말고 새로고침하면 원래대로 돌아옵니다.
④ ‘계절별 관리’에는 ‘미사용’이 붙어 있습니다. 아직 쓰는 중이라 페이지 수정에서 상태를 꺼 둔 것인데, 이렇게 하면 손님 화면의 목차와 본문에서 빠집니다. 다 쓰면 켜면 됩니다.

5. 메뉴에 걸기 — 이 메뉴만 전체 폭으로, 그리고 손님 화면

메뉴 수정 창

책이 다 됐으니 손님이 들어올 문을 달아야겠죠. ‘사이트 설정’ → ‘메뉴 관리’를 열면 메뉴 아이템 목록에 ‘매뉴얼’(주소 /manual)이 이미 있습니다. 플러그인을 켤 때 자동으로 만들어진 것입니다. 이 줄의 수정 버튼을 눌러 ① 메뉴명을 ‘가구 관리법’으로 바꿨습니다.

② 화면 레이아웃이 오늘의 숨은 주인공입니다. 한결 공방은 ⑫편에서 사이트 전체에 오른쪽 사이드바를 켜 두었는데, 매뉴얼은 왼쪽에 목차가 서야 해서 사이드바까지 있으면 본문이 가운데 끼어 좁아집니다. 여기서 ‘전체 (사이드바 없음)’을 고르면 이 메뉴의 화면만 전체 폭이 됩니다. 저희 화면(창 폭 1,100px)에서 본문 칸이 402px에서 734px로 넓어졌고, /manual 아래의 책과 페이지 주소에도 똑같이 적용됩니다. ③ ‘저장’.
그다음은 ④편에서 하던 그대로입니다. ‘메인 메뉴’ 탭에서 ‘가구 관리법’을 오른쪽 트리에 추가하고 저장하면 상단 메뉴에 올라갑니다.

손님 화면 매뉴얼 목록

손님 화면입니다. 상단 메뉴 ① ‘가구 관리법’을 누르면 매뉴얼 목록이 열리고, 노출 중인 책이 카드로 나옵니다. 번들 두 권을 숨겼기 때문에 ② ‘원목 가구 관리 설명서’ 한 권만 보이고, 3단계에서 적은 설명이 카드에 들어가 있습니다. 위쪽의 ‘매뉴얼’ 머리글과 안내 한 줄은 스킨에 들어 있는 문구라 관리자 화면에 바꾸는 칸은 없습니다. 카드를 누릅니다.

손님 화면 책 열람

책이 열렸습니다. 위에는 책 제목과 설명, 그 아래 왼쪽이 ① 목차, 오른쪽이 ② 본문입니다. 목차는 관리자에서 엮은 순서 그대로이고 하위 페이지는 한 칸 들여쓰여 있습니다. 본문은 페이지 열 장이 한 화면에 이어져 있어서 죽 내려 읽으면 되고, 목차에서 제목을 누르면 그 자리로 미끄러지듯 내려갑니다. ‘미사용’으로 둔 ‘계절별 관리’는 어디에도 없습니다.
화면 폭이 좁아지면(992px 미만) 목차가 본문 위로 올라가니 휴대폰에서도 그대로 읽힙니다.

페이지 주소로 바로 가기

페이지마다 주소가 있다고 했죠?! 주소창에 /manual/wood-care/oiling을 넣으면 책이 열리면서 곧바로 ② ‘오일 바르기’ 자리까지 내려가고, ① 목차에도 그 줄이 표시됩니다. 주소 끝이 4단계에서 적은 슬러그입니다. 손님이 Q&A나 전화로 물어 오면 이 주소 한 줄만 보내 드리면 됩니다. 슬러그를 뜻이 통하는 영어로 적어 두자고 한 이유가 여기에 있습니다.

6. 홈에 목차 블록 놓기 — 매뉴얼 블록 네 가지

매뉴얼 블록 고르기

메뉴까지 달았지만 홈 화면에서도 보이면 더 좋겠죠. 매뉴얼 플러그인을 켜면 블록 에디터의 “무엇을 보여줄까요?” 창 플러그인 묶음에 매뉴얼 목록·매뉴얼 목차·매뉴얼 페이지·최근 수정 매뉴얼 네 가지가 생깁니다. 책 카드를 늘어놓는 것, 책 한 권의 목차, 페이지 한 장(전체 본문·요약·링크 카드 중 선택), 최근에 고친 페이지 모음입니다.
‘블록 관리’ → ‘블록 에디터’에서 메인화면 맨 아래에 행을 하나 추가하고, 칸을 눌러 ‘고르기’에서 ‘매뉴얼 목차’를 골랐습니다.

매뉴얼 목차 블록 설정

고른 다음 순서는 ⑩편의 배너와 같습니다. 패널의 ‘적용’을 먼저 누르고, ‘내용 고르기 (전체 설정 화면)’을 누르면 이 창이 열립니다. ① 표시 깊이는 목차를 몇 단계까지 보여 줄지인데, 0이면 전부이고 저희는 홈이 길어지지 않게 1(큰 제목만)을 넣었습니다. 그 아래 ‘책 설명 표시’와 ‘전체 매뉴얼 링크 표시’는 켜 둡니다.
② 왼쪽 ‘사용 가능한 매뉴얼’에서 책을 오른쪽으로 옮깁니다. 목차 블록은 한 권만 고를 수 있고, 2단계에서 숨긴 책은 여기에 나오지 않습니다. ③ 창의 ‘적용’을 누른 뒤 화면 맨 아래 ‘저장’까지 눌러야 끝납니다.

홈의 매뉴얼 목차 블록

홈 맨 아래에 책 제목과 설명, 큰 제목 세 줄이 놓였습니다. 줄을 누르면 5단계에서 본 것처럼 그 페이지 자리로 바로 들어가고, 오른쪽 위 화살표는 책 전체로 갑니다. 관리자에서 페이지 제목을 고치거나 순서를 바꾸면 이 칸도 따라 바뀌니 블록은 다시 손댈 필요가 없습니다.

운영 메모 두 줄입니다. 첫째, 책을 잠깐 내려야 할 때는 지우지 말고 2단계의 ‘프론트 노출’ 스위치를 끄세요. 목록과 주소에서 바로 빠지고 내용은 그대로 남습니다. 둘째, 번들로 들어 있는 게시판·쇼핑몰 매뉴얼은 운영하다 막힐 때 펴 보는 참고서입니다. 숨겨 둔 책은 관리자로 로그인해 있어도 손님 화면 주소로는 열리지 않으니, 읽을 때만 잠깐 노출을 켰다가 다시 끄시면 됩니다.

오늘 준비한 매뉴얼 — 사용설명서를 책 한 권으로 엮어 홈페이지에 올리기는 여기까지입니다!

매뉴얼 플러그인 켜기 → 번들 책 숨기기 → 책 만들기 → 페이지 쓰고 끌어서 목차 엮기(순서 저장) → 메뉴에 걸며 전체 폭으로 → 홈에 목차 블록, 이 순서만 기억하시면 됩니다.

감사합니다!

글쓰기

댓글 0

등록된 댓글이 없습니다.