소개

이번 강좌에서는 Umbraco CMS에서 제공하는 유용한 기능 중 하나인 캔버스(Canvas) 편집 기능에 대해서 설명 드리고자 합니다. 캔버스 편집 기능은 특정 아티클을 에디터 기반에서 편집을 하는 방식이 아닌 해당 콘텐트가 표시되는 영역에서 직접 내용을 보면서 편집하는 기능을 나타냅니다.

 

따라하기

1. Umbraco CMS 솔루션의 [백오피스]로 접근합니다. 특정 콘텐트에 대한 편집 기능은 기본적으로 해당 콘텐트의 메인 영역의 에디터를 사용하여 편집하면 됩니다. 만약, 실제로 출력되는 곳에서 전체 레이아웃을 보면서 편집하고자 한다면, 아래 그림처럼 해당 콘텐트에 마우스 오른쪽 버튼을 클릭하여 나타나는 메뉴 중 [캔버스 내용 편집] 항목을 클릭하면 됩니다.

062111_2048_81.png

 

2. [캔버스 내용 편집]을 선택한 후 메인 페이지로 이동하면 아래 그림처럼, 특정 콘텐트에 마우스를 올려보면 [Click to edit the pageName field of 'XXX'] 식으로 편집할 수 있는 메뉴가 선택됩니다.

062111_2048_82.png

 

3. 아래 그림은 [캔버스 내용 편집] 상태에서 제목과 내용을 변경하는 모습을 보여줍니다. 내용 편집 후 다른 영역을 마우스로 선택하면 자동으로 편집된 내용이 저장됩니다.

062111_2048_83.png

 

4. 최종 완성된 상태입니다. 메뉴의 텍스트와 내용이 변경되어 적용되었음을 알 수 있습니다.

062111_2048_84.png

 

 

마무리

이번 시간에 알아본 [캔버스 내용 편집] 기능은 개발자가 구현하기에는 힘이 들어도 일반 사용자가 페이지 내용 편집 시에는 상당히 편리한 기능일 듯 합니다.

여기까지 해서 일반적인 페이지를 생성하고 편집 및 삭제하는 기능에 대한 소개를 마치고 계속해서 Umbraco CMS의 여러 가지 주요한 기능들을 계속해서 살펴보도록 하죠. 간단하고 어렵지 않은 내용이기에 단숨에 다음 번 강좌까지 이동해 보겠습니다.

 

 

끝.





관련글



관련 동영상 참고 자료

  1. Umbraco 개발 환경 구축
  2. Umbraco 설치
  3. 사용자 모드와 관리자 모드(백오피스)
  4. 새로운 페이지(Page) 만들기
  5. 한글 언어팩(Languages) 적용하기
  6. 콘텐트 페이지 편집, 삭제, 메뉴 정렬 등 소개
  7. 미디어 파일 관리
  8. 사용자(User) 관리
  9. 스타일 추가 및 변경
  10. 템플릿(Templates)과 마스터페이지(MasterPages)
  11. Umbraco 페이지 필드(태그(Tags))
  12. 문서 타입(Document Types)
  13. 문서 타입(Document Types)에 속성 추가
  14. 부모 문서 타입(Document Types) 사용하기
  15. 문서 타입(Document Types) 내보내기 및 가져오기
  16. 문서 타입(Document Types) 자식 노드 허용
  17. 기본 매크로(Macros) 사용하기
  18. 새로운 매크로(Macro) 만들기
  19. 매크로(Macro)에 파라미터 전달
  20. 사진 갤러리(Gallery) 만들기 1
  21. 사진 갤러리(Gallery) 만들기 2 : XSLT 사용하기
  22. 사진 갤러리(Gallery) 만들기 3 : jQuery 슬라이드 쇼 플러그인 적용
  23. 회원(Members) 관리
  24. 사전(Dictionaries)
  25. 패키지(Packages)
  26. HTML 레벨의 스킨 파일 적용 1
  27. HTML 레벨의 스킨 파일 적용 2 : 상단 메뉴
  28. HTML 레벨의 스킨 파일 적용 3 : 서브 메뉴와 사이트 맵
  29. HTML 레벨의 스킨 파일 적용 4 : 서브 타이틀
  30. 배포 : Umbraco CMS를 원격 서버에서 실행




profile

박용준(redplus at redplus.net)
.NET 개발/강의 프리랜서, MVP, MCT
데브렉(http://www.devlec.com) 전임 강사
닷넷코리아(http://www.dotnetkorea.com) 사이트 운영