소개

이번 강좌는 지난 번 강좌에 이어지는 내용입니다.

사용자가 새롭게 매크로를 만들어서 Umbraco CMS에 등록 후 사용하는 방법에 대해서 설명을 하였습니다 이에 덧붙여 Umbraco에서 매크로에 추가적인 매개변수(파라미터)를 전달하는 방법에 대한 내용을 이번 시간에 다루고자 합니다.

 

따라하기

Step 1: 매크로 적용하기

1. [MacroTest] 템플릿의 하단에 [MyMacro] 매크로를 등록하였습니다. 이 때 주의할 점 중의 하나는 웹 폼 기반으로 만들어진 ASCX파일은 반드시 ASP.NET form 태그로 묶어져 있어야 합니다. 따라서 아래 그림의 상단과 하단에 form 태그로 묶어 준 점을 추가로 확인하기바랍니다.

062411_1552_21Macro1.png

 

2. [매크로 삽입] 페이지를 웹 브라우저로 출력했을 때의 모습입니다. 하단의 매크로가 정의된 영역이 보이고, 텍스트박스에 값을 입력한 후 버튼을 클릭하면 정상적으로 기능을 수행함을 알 수 있습니다.

062411_1552_21Macro2.png

 

Step 2: 매크로에 속성 추가하기

1. 매크로에서 사용할 파라미터를 전달하기 위해서는 매크로 소스로 이동해서 추가적인 속성(Property)을 추가해야 합니다. 아래 그림은 Visual Studio 2010에서 [MyMaro.ascx] 파일을 열고 [DefaultText] 속성을 추가한 후 페이지 처음 로드 시 레이블에 이 속성의 값이 출력되도록 한 것입니다.

062411_1552_21Macro3.png

 

2. [MyMacro] 웹 프로젝트를 다시 빌드한 후 [MyMacro.ascx] 파일과 DLL/PDB 파일을 모두 앞선 강좌에서 한 것처럼, 다시 Umbraco CMS쪽으로 덮어쓰기 해서 새 속성이 추가된 상태를 유지합니다.

 

Step 3: 매크로에 파라미터 전달

1. [MyMacro] 관리 페이지로 이동한 후 아래 그림의 [Browse properties] 버튼을 클릭합니다.

062411_1552_21Macro4.png

 

2. [MyMacro]에 등록된 속성(Property)가 노출됩니다. [DefaultText]란 이름으로 하나만 추가했기에 아래 그림과 같이 하나의 목록만 나타난 후 이를 체크한 후 [Save Properties] 버튼을 클릭합니다.

062411_1552_21Macro5.png

 

3. [Default Text] 속성이 추가됨을 확인 후 창을 닫습니다.

062411_1552_21Macro6.png

 

4. [MyMacro] 관리 페이지의 [Parameters] 탭을 클릭하면 아래와 같이 DefaultText 속성이 추가됨을 확인할 수 있습니다.

062411_1552_21Macro7.png

 

Step 4: 템플릿에 파라미터가 추가된 매크로 적용하기

1. [MacroTest] 템플릿 편집 페이지로 이동합니다. 메인 에디터에서 매크로가 등록될 지점에 마우스 캐럿을 올려두고, 매크로 삽입 아이콘을 클릭하여 [MyMacro] 매크로를 선택한 후 [OK] 버튼을 클릭합니다.

062411_1552_21Macro8.png

 

2. 아래 그림은 앞서 등록한 Default Text 속성이 매크로에서 추가로 값을 입력 받는 텍스트박스로 표현되는 모습입니다. 간단히 값을 입력한 후 [완료] 버튼을 클릭합니다. (만약, [완료] 버튼을 클릭하였는데 반응이 없으면 수작업으로 3번 순서를 진행하면 됩니다.);

062411_1552_21Macro9.png

 

3. 아래 그림은 DefaultText 속성이 추가된 매크로가 삽입된 모습입니다.

062411_1552_21Macro10.png

 

Step 5: 웹 브라우저에서 테스트

1. [매크로삽입] 페이지를 웹 브라우저로 실행합니다. 아래 그림과 같이 레이블 영역에 기본으로 제공한 텍스트 값이 출력됨을 알 수 있습니다.

062411_1552_21Macro11.png

 

2. 텍스트박스에 값을 입력 후 테스트해보면 이 역시 정상적으로 테스트가 됩니다.

062411_1552_21Macro12.png

 

 

마무리

만약, 한 개 이상의 파라미터를 웹 사용자 정의 컨트롤에 등록한 후에 사용해도 동일한 결과를 나타냅니다. 이처럼, Umbraco는 단순히 특정 읽기전용 매크로가 아닌 매개변수의 값을 전달해서 동적으로 그에 해당하는 결과값을 출력하도록 설정하는 유용한 기능을 제공합니다.

이 글을 읽는 독자가 개발자라면 이러한 매크로를 활용하여 기존 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) 사이트 운영