3. OctoberCMS , Creating Themes

3. OctoberCMS , Creating Themes

1) 테마 만들기 ( myoctober.app:8000/backend , homestead설정 사용시 )

생성하기

- CMS -> Front-end theme -> 'Create a new blank theme'

속성 설정

- Name : Olympos

- Directory name : olympos

- Description : New starter theme

- Author : Ivan Doric

- Homepage : http://myoctober.app:8000

*테마 생성 위치 : themes/olympos/theme.yaml

활성화 - Activate Theme ( 신규 테마로 변경 )

: CMS->Front-end theme ->'Activate' Olympos

2) Layout 생성하기 : default.htm

메뉴 : CMS -> Layouts -> +Add : default.htm

위치 : themes/olympos/layouts/default.htm

* 기존 demo/layouts/default.htm를 copy하고, header/footer는 일단 삭제

* css : style.css 신규 생성

  <link href="{{ 'assets/css/style.css'|theme }}" rel="stylesheet">

      

* js : app.js는 신규 생성 ( jquery.js는 복사 )

        <script src="{{ [
            'assets/js/jquery.js', 'assets/js/app.js',
            ]|theme }}"></script>

3) Homepage 생성하기 : homepage.htm

메뉴 : CMS -> Layouts -> +Add : homepage.htm ( URL : / )

위치 : themes/olympos/pages/homepage.htm

Markup :

<h1>This is our homepage</h1>

4) 실행 결과

* 브라우저 View Source결과 ( script는 단일 파일로 변경되어, 요청 traffic을 감소 시킴 )

<!-- Scripts -->
<script src="http://myoctober.app:8000/combine/ffc6422ecc7902bad467abb69edcd8cb-1484897286"></script>

동영상 (영문 강좌)

     - watch-learn.com october-cms

          -- http://watch-learn.com/series/making-websites-with-october-cms