Loading the content...

이윰빌더 테마구조

  • Home
  • 가이드
  • 이윰빌더 가이드
  • 이윰빌더 테마구조

이윰빌더 EB Basic 테마 (반응형테마) 구조

이윰빌더 설치 후 기본적으로 제공되는 EB Basic 테마(반응형테마)의 디렉토리 구조는 다음과 같습니다.

  • eyoom / theme / basic2
    • css 1
      • common.css
      • custom.css
      • style.css
    • emoticon 2
      • onion
      • rabbit
    • image 3
    • js 4
      • app.js
      • back-to-top.js
      • datepicker.js
      • html5shiv.js
      • jquery-migrate-1.2.1.min.js
      • jquery.bootstrap-hover-dropdown.min.js
      • respond.js
    • layout 5
      • head_bs.html
      • side_bs.html
      • tail_bs.html
      • tail_sub.html
    • main 6
      • index_bs.html
    • page 7
    • plugins 8
      • backstrech
      • bootstrap
      • counter
      • font-awesome
      • infinite-scroll
      • masonry
      • scrollbar
      • sky-forms
      • syntaxhighlighter
      • venobox
    • skin_bs 9
      • board
      • connect
      • emoticon
      • faq
      • hotpost
      • latest
      • member
      • nameview
      • new
      • newpost
      • newwin
      • outlogin
      • paging
      • poll
      • popular
      • qa
      • ranking
      • respond
      • search
      • signature
      • visit

디렉토리 구조

BASIC 테마 디렉토리 구조

BASIC 테마폴더 내 총 9개의 폴더가 구성되어 있으며 각각의 폴더 내 포함된 파일들의 역활에 대해 알아봅니다.

1 css

테마의 전체적인 레이아웃 및 기초가 되는 스타일 설정 파일들로 구성되어 있습니다.

  • common.css: 공통적으로 사용되는 디테일한 css 설정을 모아둔 파일
    사용법은 이윰빌더의 CSS 활용 메뉴얼을 참조 해주세요.
  • custom.css: css폴더 내 우선순위가 제일 높은 파일입니다. 테마에 이미 적용되어 있는 스타일을 변경하고자 할때 다른 css파일의 클래스를 넣어 재설정 해 주면 적용됩니다.(또는 본인만의 스타일설정을 이 파일에서 만들면 관리가 편합니다.)
  • style.css: 전체 레이아웃과 관련된 스타일 설정.
    • plugins - 폴더 내 포함되어 있는 각각의 플러그인 스타일을 따로 설정
    • basic_bs - 전체 레이아웃과 관련된 스타일 설정
    • color - 테마에 적용되어 있는 특정 클래스의 색상을 설정
2 emoticon

글쓰기 / 댓글쓰기 시 나오는 이모티콘 이미지

3 image

테마에 사용되는 이미지파일을 업로드

4 js

테마에 사용되는 기본적인 js 파일

5 layout

테마의 전체적인 레이아웃을 구성하는 html 파일

  • head_bs.html: 상단 로고영역 및 메뉴바 영역
  • side_bs.html: 사이드의 아웃로그인 / 최신글 / 배너등의 영역
  • tail_bs.html: 하단 로고 / 정보표시 / 카피라이터등의 영역
6 main

테마의 메인을 구성하는 html 파일

  • index_bs.html: 메인 최신글 영역
7 page

개별 일반페이지를 추가하여 작업하실 수 있습니다.

  • page 폴더 내 aboutus.html 파일을 생성하였다면 아래와 같이 페이지를 불러옵니다.
  • ex) http://사이트주소/page/?pid=aboutus
8 plugins

테마에 사용된 플러그인의 모음

9 skin_bs

게시판, 최신글, 아웃로그인 등 테마의 모든 개별 스킨들을 모아둔 폴더입니다.

이윰빌더 EB Pc Basic 테마 (비반응형테마) 구조

이윰빌더 설치 후 기본적으로 제공되는 EB Pc Basic 테마(비반응형테마)의 디렉토리 구조는 다음과 같습니다.

  • eyoom / theme / pc_basic
    • css(_mo) 1
      • custom.css
      • style.css
    • emoticon 2
      • onion
      • rabbit
    • image 3
    • js 4
      • app.js
      • back-to-top.js
      • bootstrap.min.js
      • datepicker.js
      • html5shiv.js
      • jquery-migrate-1.2.1.min.js
      • jquery.bootstrap-hover-dropdown.min.js
      • jquery.sticky.min.js
      • respond.js
    • js_mo 4
      • app_mo.js
      • newwin_mo.js
      • snap.min.js
    • layout 5
      • head_mo.html
      • head_pc.html
      • misc_mo.html
      • side_mo.html
      • side_pc.html
      • tail_mo.html
      • tail_pc.html
      • tail_sub.html
    • main 6
      • index_mo.html
      • index_pc.html
    • page 7
    • plugins 8
      • backstrech
      • bootstrap
      • counter
      • font-awesome
      • infinite-scroll
      • masonry
      • owl.carousel
      • scrollbar
      • sky-forms
      • syntaxhighlighter
      • venobox
    • skin_pc(mo) 9
      • board
      • connect
      • emoticon
      • faq
      • hotpost
      • latest
      • member
      • nameview
      • new
      • newpost
      • newwin
      • outlogin
      • paging
      • poll
      • popular
      • qa
      • ranking
      • respond
      • search
      • signature
      • visit

디렉토리 구조

PC BASIC 테마 디렉토리 구조

PC BASIC 테마폴더 내 총 12개의 폴더가 구성되어 있으며 각각의 폴더 내 포함된 파일들의 역활에 대해 알아봅니다.

1 css(css_mo)

테마의 전체적인 레이아웃 및 기초가 되는 스타일 설정 파일들로 구성되어 있습니다.

  • custom.css: css폴더 내 우선순위가 제일 높은 파일입니다. 테마에 이미 적용되어 있는 스타일을 변경하고자 할때 다른 css파일의 클래스를 넣어 재설정 해 주면 적용됩니다.(또는 본인만의 스타일설정을 이 파일에서 만들면 관리가 편합니다.)
  • style.css: 전체 레이아웃과 관련된 스타일 설정.
2 emoticon

글쓰기 / 댓글쓰기 시 나오는 이모티콘 이미지

3 image

테마에 사용되는 이미지파일을 업로드

4 js(js_mo)

테마에 사용되는 기본적인 js 파일

5 layout

테마의 전체적인 레이아웃을 구성하는 html 파일

  • head_pc(mo).html: 상단 로고영역 및 메뉴바 영역
  • side_pc(mo).html: 사이드의 아웃로그인 / 최신글 / 배너등의 영역
  • tail_pc(mo).html: 하단 로고 / 정보표시 / 카피라이터등의 영역
6 main

테마의 메인을 구성하는 html 파일

  • index_pc(mo).html: 메인 최신글 영역
7 page

개별 일반페이지를 추가하여 작업하실 수 있습니다.

  • page 폴더 내 aboutus.html 파일을 생성하였다면 아래와 같이 페이지를 불러옵니다.
  • ex) http://사이트주소/page/?pid=aboutus
8 plugins

테마에 사용된 플러그인의 모음

9 skin_pc(mo)

게시판, 최신글, 아웃로그인 등 테마의 모든 개별 스킨들을 모아둔 폴더입니다.