본 강좌는 아래 경로에서 연재되고 있는 강좌입니다.
오픈소스 웹어플리케이션 사용자 Tip과 강좌 – OSSFair(http://www.sqler.com/OSS)
소개
요즘의 웹은 크게 3가지 리소스로 표현이 되는 듯 합니다. 첫 번째 HTML, 두 번째 CSS, 세 번째 미디어(Media) 파일들… 그리고 미디어 파일들에는 이미지, 플래시 미디어 등을 표시합니다.
이 때 미디어 파일을 Orchard CMS에 미리 올려두고, 필요한 페이지에서 손쉽게 가져다 쓸 수 있도록 하는 방법을 소개해 드리고자 합니다.
절차
1. [대시보드]-[미디어] 메뉴를 클릭합니다. 메인 영역에 [미디어] 설정 화면이 나타납니다. [폴더추가]와 같은 버튼을 클릭하여, 미디어 파일을 종류 또는 업무별로 구분해서 저장해 놓을 수 있습니다. 특정 폴더를 생성한 후 해당 폴더 링크를 클릭하면 폴더에 대한 관리 화면으로 이동할 수 있습니다.
2. [미디어]의 [폴더 관리] 화면은 아래와 같습니다. 이곳에는 추가적인 폴더를 생성하거나 이미지와 같은 미디어 파일을 업로드하기 위한 [미디어 추가] 버튼을 클릭할 수 있습니다. 업로드된 미디어 파일에 대해서는 필요없다면 [삭제] 기능을 적용하여 삭제할 수 있습니다.
3. 동일한 방법으로 “Pictures”란 이름으로 미디어를 관리하는 폴더를 하나 더 생성하였습니다.
4. “Pictures” 폴더로 이동해서 [미디어 추가] 버튼을 클릭하여, Orchard에서 사용할 이미지를 업로드합니다.
5. [미디어 추가] 메뉴에서는 하나의 이미지를 업로드하는 기존 방식에 추가적으로, 압축파일(Zip파일)에 여러 개의 이미지를 한꺼번에 저장해 놓은 후 압축된 파일을 업로드할 때 [Zip 압축 풀기] 체크박스를 체크한 후 업로드를 하게 되면 지정된 폴더로 이미지 파일이 압축이 해제되어 업로드가 진행됩니다.
6. 단순히 하나의 이미지 파일을 업로드한다면, 아래 그림처럼, 원하는 이미지 경로를 [찾아보기] 버튼을 클릭하여 선택한 후 [업로드] 버튼을 클릭하면 됩니다.
7. 업로드되는 미디어 파일들의 기본 저장 위치는 아래 그림과 같이 Orchard-Media-Default-Pictures 폴더에 저장됩니다.
8. 메인 페이지에서 미리 업로드한 미디어 파일을 사용하고자한다면, 페이지 편집 메뉴를 클릭하여 편집 화면으로 이동합니다.
9. Orchard에서 기본으로 제공하는 위지윅 에디터는 아래 그림의 아이콘을 클릭하여 이미지 파일을 에디터에 삽입할 수 있습니다.
10. 이미지 선택 메뉴에서 특정 폴더를 생성하고 이미지를 업로드할 수도 있고, 이미 업로드된 이미지에 대한 삽입을 진행할 수도 있습니다.
11. 아래 그림은 [이미지 선택] 메뉴를 거친 후 메인 페이지에 적용했던 제 사진(?) 이미지를 제거한 후 제과점에서 제가 직접 찍어온 케익 사진을 올려본 모습니다.
결론
자~ 이렇게해서 Orchard에 사진과 같은 이미지 파일을 손쉽게 올리고 등록하는 방법에 대해서 설명을 드렸습니다. 여기까지만 진행해도 웬만한 디자인적인 페이지를 만드는데는 어려움이 없을 줄 압니다.
끝.
관련글