Partager via

[Umbraco 강좌] 5. 새로운 페이지(Page) 만들기

  • Article

이 내용은 ASP.NET MVP로 활동하고 계신 박용준님이 작성하신, 오픈소스 기반 웹사이트 제작 엔진인 Umbraco로 처음 웹사이트를 구축 및 개발하기 위한 시리즈 강좌입니다. 많은 도움 되시길 바랍니다.
==================================================================================================

소개

안녕하세요…

이번 시간은 Umbraco CMS 솔루션을 사용하여 하나의 페이지(HTML 페이지, ASP 페이지, PHP 페이지와 같은 개념)를 만드는 개념에 대해서 설명을 드리고자 합니다.

다만, 여기서 말하는 페이지가 단순히 물리적인 하나의 파일을 나타내진 않고, 논리적인 하나의 페이지를 말합니다.

Umbraco에서는 모든 페이지가 데이터베이스에 저장된 콘텐트로 이루어집니다.

또한 하나의 페이지를 표현하는데 2가지 방법을 사용합니다.

따라하기 : 페이지 추가하기

1. WebMatrix 또는 Visual Studio 2010(Visual Web Developer 2010 Express)을 사용하여 로컬에 다운로드 받은 Umbraco CMS 소스를 열고, 웹 브라우저로 실행시킵니다. 실행시킨 후 추가적인 페이지를 만들기 위해서 백오피스로 접속합니다.

062011_1656_5Page1.png

2. [백오피스]의 좌측 메뉴를 보시면, 아래 그림과 같이 [Content]라는 항목 밑에 현재 작업 중인 사이트명이 나타납니다. 사이트명을 마우스 오른쪽 버튼을 클릭하면 나타나는 컨텍스트 메뉴에서 [Create] 메뉴 항목을 클릭합니다.

062011_1656_5Page2.png

3. [Create] 화면이 나타나면 이곳에 페이지의 이름과 페이지에서 사용될 문서 타입(Document Type)을 선택 한 후 [Create] 버튼을 눌러 하나의 컨텐트를 즉, 페이지(Page)를 생성합니다.

062011_1656_5Page3.png

페이지 생성시 포함되는 내용들

  • Name : 페이지 제목.
  • Document Type : 페이지에 보여질 레이아웃의 기본 구조를 가지고 있는 테마(스킨)와 같은 역할.

4. 아래 그림과 같이 콘텐트(페이지) 입력 화면에서 에디터에 간단히 텍스트를 입력 후 [Save] 버튼을 클릭합니다. 저장 버튼을 클릭하면 데이터베이스에는 저장이 되지만, 실제 웹 페이지에는 적용이 되지 않습니다. 웹 페이지 작성 후 수정 및 삭제는 언제든지 백오피스로 돌아와서 작성을 진행할 수 있습니다.

062011_1656_5Page4.png

5. 아래 그림은 아직까지 메인 페이지에 적용되지 않은 상태를 보여줍니다.

062011_1656_5Page5.png

6. 아래 그림과 같이 [Save and publish] 버튼을 클릭하면 바로, 웹 페이지에 표시됩니다.

062011_1656_5Page6.png

7. 최종적으로 웹 페이지로 출판된 [About Us] 메뉴를 보여줍니다.

062011_1656_5Page7.png

8. 웹 페이지 출력 시 ~/about-us.aspx 또는 ~/about-us 식으로 파일 단위와 폴더 단위로 페이지를 표시할 수 있습니다.

062011_1656_5Page8.png

마무리

Umbraco 웹에서 제일 중요한 작업이 무엇인지 아세요? 바로, 이번 시간에 다뤄본 페이지 생성(수정/삭제)입니다. 이는 효과적으로 웹을 통해서 무엇인가를 전달할 수 있고 콘텐트를 손쉽게 웹에서 생성, 수정, 삭제 등을 진행할 수 있습니다. 특정 페이지를 수작업으로 HTML 소스를 건드려서 웹에 콘텐트를 출력하는 게 아닌 웹에서 자동화된 편집도구를 사용하여 바로 수정 후 바로 확인의 절차를 거칠 수가 있는 것입니다. 어찌 보면, 10년 전에는 상상하기 힘든 기술로 보여질 수도 있습니다. 예전에는 이런 게 어디 있었나요… 하나의 페이지를 작성하려면, 웹 디자이너 또는 웹 개발자가 하나의 페이지를 만들고 FTP와 같은 전송 프로그램을 사용해서 서버에 HTML 페이지를 올려서 테스트를 하던 방식이 전부였습니다. 물론, 지금도 이 방법이 제일 많이 사용되지요… 이러한 방식에서 더욱 발달해서 현재의 CMS 솔루션들은 모두다 하나의 페이지/콘텐트를 표현할 때 웹에서 바로 입력 후 출력하는 시스템을 제공합니다.

자~ 그럼, 가장 중요한 페이지를 살펴보았으니, 더 많은 기능들을 학습해 보기 위해서 전진해 보도록 하겠습니다.

끝.

관련글