RedPlus 개인 블로그

시삽: 레드플러스 님 
게시판 이동:
 제목 : 3. 페이지(Pages) 추가하기
글번호: 252
작성자: Administrator ( 레드플러스 / redplus@live.com )
작성일: 2011/05/31 오후 6:38:24 (2011/05/31 오후 6:38:24 수정)
조회수: 4094

 

소개

안녕하세요…

이번 시간은 Orchard CMS 솔루션을 사용하여 하나의 페이지(HTML 페이지, ASP 페이지, PHP 페이지와 같은 개념)를 만드는 개념에 대해서 설명을 드리고자 합니다. 다만, 여기서 말하는 페이지가 단순히 물리적인 하나의 파일을 나타내진 않고, 논리적인 하나의 페이지를 말합니다.

Orchard에서는 모든 페이지가 데이터베이스에 저장된 콘텐츠로 이루어집니다. 또한 하나의 페이지는 그 페이지를 표현하는 URL(라우트 경로)을 함께 가지고 있습니다.

Orchard가 ASP.NET MVC 3 기술을 사용하다보니 자연스레 각각의 페이지를 구성하는게 파일 단위가 아닌 메서드 단위, 즉, 하나의 URL이 하나의 메서드를 호출하는 식으로 URL과 그 URL을 처리하는 메서드(액션메서드)로 이루어져 이기에 물리적인 파일이 아닌 논리적인 메서드가 하나의 페이지를 표현합니다.

말이 어려울 수도 있는데요… 아래와 같이 기존 페이지의 개념과 ASP.NET MVC 기술을 사용한 Orchard의 페이지를 표현하는 방법이 조금 다를 뿐입니다.

자, 위에 내용은 그냥 잊고, 아래 절차에 따라서 따라하기를 진행하면 위 개념을 몰라도, ASP.NET을 몰라도, ASP.NET MVC를 몰라도 HTML 코드만 알면 웹 사이트를 만들 수 있으니, 무작정 따라하기를 해보도록 하겠습니다…

 

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

1. WebMatrix 또는 Visual Studio 2010(Visual Web Developer 2010 Express)을 사용하여 로컬에 다운로드 받은 Orchard CMS 소스를 열고, 웹 브라우저로 실행시킵니다. 실행시킨 후 추가적인 페이지를 만들기위해서 [Sign In] 링크버튼을 클릭합니다.

image

 

2. Orchard CMS 처음 설치시 요청받은 최고관리자(Super User) 권한으로 로그인하면, 관리자 모드인 [대시보드]에 접근할 수 있습니다. 1번과 2번과 같은 절차는 앞으로 진행되는 모든 강좌에서 동일하게 진행해야하는 순서임을 기억하시기 바랍니다…

image

 

3. 최고 관리자 권한으로 로그인을 한 후 사이트 하단의 [Dashboard] 링크를 클릭하여 [대시보드]로 이동합니다.

image

 

4. 아래 그림은 Orchard CMS 솔루션의 관리자 모드로 불리우는 [대시보드]의 외양입니다. 어찌보면, 다른 CMS와 비교해보면 아직은 많이 부족한(?) 느낌의 단순한 형태의 모양이지만, 앞으로 계속해서 발전해 나갈것은 틀림이 없어 보입니다… 3회까지 강좌를 봐왔는데 믿어야겠죠??? Orchard Core 개발자들 화이팅입니다…

image

 

5. 자, 그러면 하나의 페이지를 만들어보도록 하겠습니다. [대시보드]의 좌측 메뉴를 보시면, 아래 그림과 같이 [Page]라는 메뉴가 보입니다. 이는 Orchard에 하나의 페이지(Page)를 만드는 역할을 하게 됩니다. 페이지 메뉴를 클릭하게되면, 오른쪽 영역에 [Title], [Permalink], [Body] 등의 항목에 내용을 입력할 수 있습니다. 각 항목에 대한 간단 설명은 아래에 제시합니다.

image

 

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

  • Title : 페이지 제목
  • Permalink : 페이지를 표시하는 고유 URL(기본적으로 페이지 제목을 바탕으로 자동으로 생성됨)
  • Set as home page : 체크시 현재 페이지가 메인페이지(홈페이지)로 표시됨
  • Body : rich-text 에디터에 의해서 페이지에 표시될 컨텐트를 입력
  • Tags : 컨텐트에 대한 분류를 위한 태그 입력
  • Show on main menu : 메인 메뉴에 현재 페이지를 표시할건지 여부
  • Owner : 현재 페이지의 주인(기본값 : 최고관리자)
  • 기타 저장 버튼들 : 임시 저장, 바로 출판, 특정일에 출판 등의 메뉴를 제공

 

6. 페이지 생성시 제목 입력시 자동으로 Permalink가 입력이 됩니다. 만약, 자동으로 입력되는 URL이 아닌 특정 URL로 표시되게 진행하고 싶다면, Permalink의 내용을 변경하면 됩니다.

image

 

7. 페이지 생성시 Body 영역은 Rich-Text 에디터에 원하는 내용을 입력할 수 있습니다. 위지윅 에디터 형태로, 웹을 사용해보신 분들이라면 손쉽게 사용할 수 있는 구조를 가집니다. 조금 아쉬운 것은 요즘 국내 사이트에서 제공하는 화려한 에디터와 비교했을 때 기능이 조금 아쉽다라는 것입니다… 그래도 쓸만 합니다. 또한, 블로그에서의 태그 기능과 동일한 기능을 페이지에서도 사용할 수 있습니다. 제가 아래에 작성한 About Us라는 페이지를 메인 메뉸에 About Us라는 이름으로 표시하고자한다면, 아래 그림처럼, [Show on main menu] 체크박스를 클릭하면 됩니다.

image

 

8. 마지막으로 페이지 컨텐트에 대한 출판(웹에 표시)하는 기능을 제공하는 3개의 버튼을 제공합니다. [Save] 버튼은 현재 페이지에 대한 모든 내용을 데이터베이스에는 저장하지만 웹에는 표시하지 않고, [Publish Now] 버튼은 DB에 저장 후 바로 웹에 표시하는 기능입니다. 마지막으로 [Publish Later] 버튼은 특정일시 이후로 현재 페이지를 표현하고자할 때 사용하는 기능입니다.

image

 

9. 앞서 그림에서 [Publish Now] 버튼을 클릭하면 해당 페이지는 데이터베이스에 저장과 동시에 실제 웹 페이지에 표시가 됩니다. [대시보드]에서 사용자 모드라 불리우는 메인 웹 사이트로 이동하려면, 아래 그림의 Your Site 제목 링크를 클릭합니다.

image

 

10. 페이지 생성 후 메인 페이지로 이동하면, 기본 메뉴인 Home 메뉴와 더불어 우리가 이번에 새롭게 생성한 [About Us]라는 메뉴가 생성되고 그안에 우리가 입력한 콘텐트가 웹에 표시가 정상적으로 되는지를 확인할 수 있습니다. 만약, 페이지 생성 후 원하는 페이지를 수정하고자한다면, 해당 페이지의 오른쪽 상단의 [Edit] 버튼을 클릭하거나, [대시보드]로 접속 후 페이지의 [수정] 버튼을 눌러서 진행할 수 있습니다.

image

 

11. 이러한 방법을 사용하여 Orchard에서 보여질 수많은 페이지들을 [Page] 메뉴를 사용하여 생성/수정 또는 삭제 등의 일련의 작업들을 수행할 수 있습니다.

image

 

마무리

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

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

 

끝.

 

관련글

 
이전 글   다음 글 삭제 수정 답변 글쓰기 리스트


관련 아티클 리스트
  제       목 파일 작성자 작성일 조회
이전글 4. 블로그 모듈 추가 및 아티클 작성하기 - Administrator 2011-05-31 3949
현재글 3. 페이지(Pages) 추가하기 - Administrator 2011-05-31 4094
다음글 2. Orchard CMS 설치 - Administrator 2011-05-31 4051
관련 페이지 리스트
numtitlenamedateview
388 C 언어에서 값 전달과 참조 전달(Call By Value and Call By Re... Administrator 2023-03-09 3560
387 병합 알고리즘 순서도 2022-10-22 5091
386 C 언어 강의: scanf를 엔터키를 기준으로 여러 행으로 값을 입력 받기 Administrator 2022-01-09 4404
385 C 언어: scanf 사용해서 표준 입력인 콘솔로부터 나이를 정수로 입력 받아 출력 Administrator 2022-01-07 3214
384 Java 코드 샘플 - Function 인터페이스로 람다 식 만들기 Administrator 2022-01-04 3110
383 C# 코드 샘플 - 널 조건부 연산자 사용하기 Administrator 2022-01-02 3151
382 C# 코드 샘플 - 널 병합 연산자와 default 키워드 Administrator 2022-01-02 3062
381 C# 코드 샘플 - 널 병합 연산자로 문자열 변수의 NULL 값 확인하기 Administrator 2022-01-02 2974
380 C# 강의 - 14세 미만 체크 메서드 구현 Administrator 2022-01-01 3029
379 C 언어 천 단위 콤마 찍기 thousands_separator.c Administrator 2021-12-30 4159
378 for 문 순서도 - for 문(for loop) 순서도(flowchart) Administrator 2021-12-28 6870
377 C 언어 코드 샘플 - 전처리기 - 조건부 컴파일 Administrator 2021-12-27 3052
376 C 언어 코드 샘플 - 전처리기 - 매크로 함수 Administrator 2021-12-27 3020
375 http-server 설치하기 - 로컬 루프백 주소로 웹페이지 실행 2021-12-27 3023
374 C 언어 코드 샘플 - N명의 학생의 점수를 입력받아 1차원 배열에 저장 후 총점 구... Administrator 2021-12-27 3079
373 Java 코드 샘플 - 두 수의 합을 구하는 함수 Administrator 2021-12-26 2954
372 C 언어 코드 샘플 - 두 수의 합을 구하는 함수 Administrator 2021-12-26 2995
371 C# 교과서 강좌 - LINQ - Select 확장 메서드에 익명 형식 사용하기 Administrator 2021-12-26 3114
370 C# 교과서 강의 - LINQ - Select 확장 메서드를 사용하여 새로운 형태로 ... Administrator 2021-12-26 3029
369 C 언어 코드 샘플 - static-shared - 정적(공유) 변수 사용하기 Administrator 2021-12-26 3047
 
 
 
손님 사용자 Anonymous (손님)
로그인 Home