고정 헤더 영역
상세 컨텐츠
본문
레이아웃 xe/layouts/new/layout.html 내부의 기본 구조는 아래와 같음.(아래서 *별표는 이문서 전용 설명으로 실제코드에는 포함되지 않음)
*XE템플릿 코드시작(간단히 정리 한 구조 임.)
<load target="default.layout.css" />
<load target="default.layout.ie78.css" targetie="lt IE 9" />
<load target="default.layout.ie7.css" targetie="IE 7" />
<load target="default.layout.webfont.css" cond="$layout_info->WEB_FONT == 'YES'" />
*위 XE코드인 cond사용으로 조건이 참일때만 외부css파일 로딩
<load target="../../common/js/respond.min.js" targetie="lt IE 9" />
*위 XE토드인 load사용으로 XE템플릿 엔진을 거치면서 <head>...</head> 태그 사이에 자동 삽입됩니다.
<load target="default.layout.js" type="body" />
*위 XE코드인 load사용으로 XE템플릿 엔진을 거치면서 <body>...</body> 태그 사이(하단)에 자동 삽입됩니다.
*컨테이너 시작
<div class="container">
*헤더 시작
<div class="header">
<h1>Site Logo</h1>
<nav class="gnb">*gnb(Global Navigation Bar)메뉴출력용 XE코드</nav>
</div>
<div class="visual main"|cond="$layout_info->LAYOUT_TYPE=='MAIN_PAGE'" class="visual sub"|cond="$layout_info->LAYOUT_TYPE=='SUB_PAGE'" cond="!$layout_info->VISUAL_IMAGE_1 && !$layout_info->VISUAL_IMAGE_2 && !$layout_info->VISUAL_IMAGE_3 && $layout_info->VISUAL_USE=='YES'">*레이아웃타입이 MAIN_PAGE / SUB_PAGE 조건에 따라서 visual main / visual sub CSS적용
</div>
*헤더 끝
*본문 시작
<div class="body main"|cond="$layout_info->LAYOUT_TYPE=='MAIN_PAGE'" class="body sub"|cond="$layout_info->LAYOUT_TYPE=='SUB_PAGE'">">*레이아웃타입이 MAIN_PAGE / SUB_PAGE 조건에 따라서 body main / body sub CSS적용
<nav class="lnb" cond="$layout_info->LAYOUT_TYPE == 'SUB_PAGE'">
"*레이아웃타입이 SUB_PAGE 인 조건일때만 lnb(Local Navigation Bar) 메뉴출력용 XE코드
</nav>
<div class="content" id="content">
{$content} *XE템플릿 문법으로 {$변수명} 형식으로 내용 출력.
여기서 내용은4가지 임.(문서페이지=에디터사용, 위젯페이지=메인페이지-최근게시물, 외부페이지=<body>~</body>, 게시판)
</div>
</div>
*본문 끝
</div>
*컨테이너 끝
*푸터 시작
<footer>
푸터 내용
</footer>
*푸터 끝
===================================================================================================
위 기본 구조를 바탕으로 메인/서브 페이지를 퍼블리싱 하면 된다.
아래 코드중에 [메인/서브 공통부분]을 제외한(이부분은 위 코드에서 load 부분으로 자동 삽입된다)
<!-- 바디 시작 --> ... <!-- 바디 끝 --> 부분을 퍼블리싱 해서 위 구조에 맞게 변경하면 된다.
===================================================================================================
<!-- ================== 메인/서브 공통부분 시작 ==================== -->
<!DOCTYPE html>
<html lang="ko">
<head>
<!-- META -->
<meta charset="utf-8">
<meta name="Generator" content="XpressEngine">
<!-- TITLE -->
<title>Welcome Page</title>
<!-- CSS -->
<link rel="stylesheet" href="/xe/common/css/xe.min.css?20170520175852" />
<link rel="stylesheet" href="/xe/common/js/plugins/ui/jquery-ui.css?20170520175852" />
<link rel="stylesheet" href="/xe/layouts/new/default.layout.css?20170520175852" />
<!--[if lt IE 9]><link rel="stylesheet" href="/xe/layouts/new/default.layout.ie78.css?20170520175852" />
<![endif]--><!--[if IE 7]><link rel="stylesheet" href="/xe/layouts/new/default.layout.ie7.css?20170520175852" />
<![endif]--><link rel="stylesheet" href="/xe/modules/editor/styles/default/style.css?20170520175853" />
<link rel="stylesheet" href="/xe/widgets/login_info/skins/default/default.login.css?20170520175852" />
<!-- JS -->
<script src="/xe/common/js/jquery.min.js?20170520175852"></script>
<script src="/xe/common/js/x.min.js?20170520175852"></script>
<script src="/xe/common/js/xe.min.js?20170520175852"></script>
<!--[if lt IE 9]><script src="/xe/common/js/respond.min.js?20170520175852"></script>
<![endif]--><script src="/xe/widgets/login_info/skins/default/default.login.js?20170520175852"></script>
<!--[if lt IE 9]><script src="/xe/common/js/html5.js"></script><![endif]-->
<!-- RSS -->
<link rel="alternate" type="application/rss+xml" title="Site RSS" href="http://timespace12.dothome.co.kr/xe/rss" /><link rel="alternate" type="application/atom+xml" title="Site Atom" href="http://timespace12.dothome.co.kr/xe/atom" /><!-- ICON -->
<link rel="shortcut icon" href="./modules/admin/tpl/img/faviconSample.png" /><link rel="apple-touch-icon" href="./modules/admin/tpl/img/mobiconSample.png" />
<link rel="stylesheet" href="./modules/install/script/welcome_content/welcome.css" /><script>
//<![CDATA[
var current_url = "http://timespace12.dothome.co.kr/xe/?";
var request_uri = "http://timespace12.dothome.co.kr/xe/";
var current_mid = "page_VoJT40";
var waiting_message = "서버에 요청 중입니다. 잠시만 기다려주세요.";
var ssl_actions = new Array();
var default_url = "http://timespace12.dothome.co.kr/xe/";
xe.current_lang = "ko";
xe.cmd_find = "찾기";
xe.cmd_cancel = "취소";
xe.cmd_confirm = "확인";
xe.msg_no_root = "루트는 선택 할 수 없습니다.";
xe.msg_no_shortcut = "바로가기는 선택 할 수 없습니다.";
xe.msg_select_menu = "대상 메뉴 선택";
//]]>
</script>
</head>
<body>
<!-- ================== 메인/서브 공통부분 끝 ==================== -->
<!-- 바디 시작 -->
<!-- 컨테이너 시작 -->
<div class="container">
<!-- 헤더 시작 -->
<div class="header">
<h1>Site Logo</h1>
<nav class="gnb">
메뉴출력용 XE코드
</nav>
</div>
<div class="visual main">
메인/서브 퍼블리싱에 따라서 css클래스명 변경 visual main / visual sub
</div>
<!-- 헤더 끝 -->
<!-- 본문 시작 -->
<div class="body main">
메인/서브 퍼블리싱에 따라서 css클래스명 변경 body main / body sub
<nav class="lnb">
서브페이지 때만 lnb(Local Navigation Bar) 메뉴출력
</nav>
<div class="content" id="content">
본문 내용
</div>
</div>
<!-- 본문 끝 -->
</div>
<!-- 컨테이너 끝 -->
<!-- 푸터 시작 -->
<footer>
푸터 내용
</footer>
<!-- 푸터 끝 -->
<!-- 바디 끝 -->
<!-- ================== 메인/서브 공통부분 시작 ==================== -->
<script src="/xe/addons/autolink/autolink.js?20170521184820"></script><script src="/xe/common/js/plugins/ui/jquery-ui.min.js?20170520175852"></script><script src="/xe/common/js/plugins/ui/jquery.ui.datepicker-ko.js?20170520175852"></script><script src="/xe/addons/resize_image/js/resize_image.min.js?20170521184820"></script><script src="/xe/layouts/new/default.layout.js?20170520175852"></script><script src="/xe/files/cache/js_filter_compiled/30bafb68498c64b466579e488f27113e.ko.compiled.js?20170521191555"></script><script src="/xe/files/cache/ruleset/ede42a495c65a9393860a66b824264ca.ko.js?20170521191555"></script>
<!-- ================== 메인/서브 공통부분 끝 ==================== -->
</body>
'PHP(Class)' 카테고리의 다른 글
| 네이버XE HTML기본 구조 및 부트스트랩3.x 기본지식 (0) | 2017.05.28 |
|---|---|
| 네이버XE(제로보드xe) XE템플릿 코드로 게시판 수정 (0) | 2017.05.23 |
| 네이버XE로 홈페이지 리뉴얼 실무 (0) | 2017.05.21 |
| 네이버XE(제로보드XE)를 시작 합니다. (0) | 2017.05.20 |
| 제로보드 XE 다국어에서 언어별 스타일 주기 (0) | 2017.04.18 |
댓글 영역