사용자정의 페이지 디자인

접속인증페이지(CWP) 기본 페이지를 편집하거나 새로운 사용자 정의 페이지를 만들 수 있고, 회사의 로고 등을 CWP에 추가 할 수 있습니다. 설정 > 접속인증페이지(CWP) > 디자인 템플릿 에서 설정이 가능합니다.

컴포넌트 설정

사용자등록 버튼, 사용자 인증 버튼 등 다양한 컴포넌트에 대해 설정이 가능합니다.

필요한 구성 요소의 추가 또는 삭제 버튼을 클릭합니다.
웹 콘솔의 오른쪽에 있는 기본 페이지에 페이지 미리보기가 표시 됩니다.
수정 버튼을 클릭합니다.

수정

Javascript를 활용하여 실제 Web 소스 수정이 가능합니다.

CWP 페이지는 html 코드 형태로 표시 됩니다.
페이지를 html 코드 형식으로 제공합니다.
- 코드에 컴포넌트의 기능를 활성화 하거나 비활성화하여 페이지의 옵션을 수정합니다.
- html 코드를 사용하여 수정 할 수 있습니다.
수정 을 클릭합니다.
웹 콘솔의 오른쪽에 있는 기본 페이지에 페이지 미리보기가 표시 됩니다.

레이아웃

Html 코드를 사용하여 페이지 레이아웃을 수정할 수 있습니다.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
   xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
   xmlns:h="http://xmlns.jcp.org/jsf/html"
   xmlns:p="http://primefaces.org/ui"
   xmlns:gncomponent="http://xmlns.jcp.org/jsf/composite/gncomponent">
$HEAD
<body id="body1">
 $PAGEHEADER
 <div id="wrap" class="wrap">
     $CUSTOMPAGEHEADER
     <div id="content" class="content">
         <!-- Don't delete code -->
         $CONTENT
         <!-- Don't delete code -->
     </div>
     $CUSTOMPAGEFOOTER
 </div>
</body>
</html>

CSS 스타일

CSS Style 클래스를 정의하고 수정 탭 또는 레이아웃 탭에서 사용 할 수 있습니다.

"CSS 스타일" 탭에 CSS 스타일 코드를 입력합니다

.test {color:red;}

"수정" 탭에서 정의 된 CSS 스타일을 사용합니다.

<div class="test">
TEST
</div>

수정 버튼을 클릭합니다.
웹 콘솔의 오른쪽에 있는 기본 페이지에 페이지 미리보기가 표시 됩니다.

이미지 업로드

접속 인증 페이지에 사용할 이미지를 직접 업로드할 수 있습니다.

Note

영문 알파벳 문자 파일 이름 "jpg / gif / png" 확장자 파일만 지원합니다.

정의된 CWP 템플릿 적용

상단 항목에 있는 정책 으로 이동합니다.
왼쪽 항목의 노드정책 으로 이동합니다.
적용하려는 노드정책 이름 을 찾아 클릭합니다.
관리정책 > Design Template 옵션을 찾습니다.
CWP에서 사용할 디자인 항목을 선택합니다.
수정 을 클릭하고 화면 우측 상단의 변경정책적용 을 클릭합니다.