모든 블록을 사용한 샘플 글
chance2026-05-29
10종 block(notice/highlight/quote/button/youtube/gallery/imageGrid/slide/file/map)을 한 글에 모두 사용한 데모입니다.
모든 블록을 사용한 샘플 글
이 글은 CMS에 등록된 10종 block을 모두 한 번에 보여주기 위한 샘플입니다. 위에서부터 순서대로 각 블록의 실제 렌더링을 확인할 수 있습니다.
1. Notice — 공지 박스
2. Highlight — 강조
핵심 메시지를 강조할 때 사용하는 amber 톤 박스입니다.
3. Quote — 인용
말씀이 곧 능력입니다. 우리 안에 거하시는 말씀이 우리를 새롭게 합니다.
— 김 목사
4. Button — 액션 버튼
아래는 3가지 스타일의 버튼입니다.
5. YouTube — 영상 임베드
6. Gallery — 클릭 가능한 썸네일 그리드
7. Image Grid — 캡션 포함 그리드
8. Slide — 좌우 네비게이션 캐러셀
1번 슬라이드
9. File — 파일 다운로드
10. Map — 지도 임베드
서울 시청
마무리
여기까지가 현재 CMS에 등록된 모든 block 유형의 렌더링 결과입니다. 새 block은 shared/blocks/registry.js에 schema 추가 + 서버 renderer + Vue component 한 쌍씩만 늘리면 됩니다.