# STOVE GNB 연동 옵션
STOVE GNB 옵션을 설정 정보를 제공하고, 옵션 스키마를 제공합니다.
아래 가이드는 GNB ver. 6.0.48 을 기준으로 작성되었습니다
# GNB 옵션 설정
GNB 내 노출할 메뉴 및 로고, GNB 내 유저 메뉴 속 노출 메뉴, 글로벌 설정(GDS API 사용여부, 언어 설정 등), 가입/로그인 시 팝업 여부 등의 옵션을 설정 할 수 있습니다.
# 옵션 설명
| 이름 (Lv. 1) | 이름 (Lv. 2) | 이름 (Lv. 3) | 필수 여부 | 기본값 | 지원 옵션 | 설명 |
| wrapper | O | ".wrapper" | id 혹은 class로 지정 가능 | GNB가 삽입될 컨테이너 DOM요소 지정 | ||
| isResponsive | X | false | true, false | 반응형 GNB 사용여부(6.x.x 버전이상부터 사용가능) | ||
| skin | X | "gnb-default" | "gnb-default" // 기본 버전 "gnb-default-fixed" // 상단고정 "gnb-dark-theme" //다크 버전 "gnb-dark-mix" //다크 + 팝업 흰색 버전 "gnb- dark-mini" // 다크 + 미니 버전 "gnb-dark-mix-mini" // 다크 + 팝업 흰색 + 미니 버전 "gnb-default-mini" // 미니버전 "{String}" // 커스텀 클래스 | GNB에 삽입될 스킨 추가적으로 커스텀 클래스를 이용해 CSS 적용가능 | ||
| isMiniSizeStoveLogo | X | false | true, false | 반응형 GNB mobile부분 로고 미니사이즈 사용 (6.x.x 버전이상부터 사용가능) | ||
| logArea | O | "stove" | "stove", "cp" | 로그 수집을 위한 로그 영역을 지정합니다 | ||
| stoveLogo | use | X | true | true, false | 스토브 로고 노출 여부 | |
| url | X | "" | 자유로운 URL 지정가능 | 스토브 로그 클릭이 이동될 URL 지정 | ||
| serviceLogo | X | "" | HTML형태의 string | 스토브 로그 우측에 서비스로고 추가 | ||
| widget | toonspoon | X | true | true, false | 툰스푼 노출 여부 | |
| languageSelect | X | true | true, false | 언어 선택 여부 | ||
| notification | X | true | true, false | 알림 노출 여부 | ||
| gameListAndService | X | true | true, false | 게임 및 서비스 노출여부 | ||
| clientDownload | X | true | true, false | 전체메뉴 내에 클라이언트 다운로드 노출 여부 | ||
| totalMenu | X | true | true, false | 전체메뉴 노출 여부 | ||
| customArea | template | X | "" | HTML형태의 string | 커스텀 서비스 영역에 대체로 들어갈 템플릿 | |
| eventHandler | X | "" | 함수(콜백함수로 실행됨) | 커스텀 영역에 템플릿에 적용될 함수 | ||
| userMenu | myProfile | X | true | true, false | 유저메뉴 내에 프로필영역 노출여부 | |
| myCash | X | true | true, false | 유저메뉴 내에 캐시영역 노출여부 | ||
| cartInfo | X | true | true, false | 유저메뉴 내에 캐시영역 노출여부 | ||
| myInfo | X | true | true, false | 유저메뉴 내에 내정보 노출여부 | ||
| security | X | true | true, false | 유저메뉴 내에 보안설정 노출여부 | ||
| customerCenter | X | true | true, false | 유저메뉴 내에 고객센터 노출여부 | ||
| reportCenter | X | true | true, false | 유저메뉴 내에 신고센터 노출여부 | ||
| logout | X | true | true, false | 유저메뉴 내에 로그아웃 노출여부 | ||
| customArea | template | X | "" | HTML형태의 string | 유저 커스텀 영역에 들어갈 템플릿 | |
| eventHandler | X | "" | 함수(콜백함수로 실행됨) | 유저 커스텀 영역에 템플릿에 적용될 함수 | ||
| global | userGds | X | true | vtrue, false | GDS (글로벌) API 사용 여부 | |
| languageCoverages | X | ['de', 'en', 'es', 'fr', 'pt', 'zh-tw', 'ja', 'ko', 'th'] | ['de', 'en', 'es', 'fr', 'pt', 'zh-tw', 'ja', 'ko', 'vi, 'th', 'id', 'it'] | 글로벌 언어 사용 여부 (GDS API 사용)
de: 독일어 en: 영어 es: 스페인어 fr: 프랑스어 pt: 포르투갈 zh-tw: 중국(대만) ja: 일본 ko: 대한민국 vi: 베트남 th: 태국 id: 인도네시아 it: 이탈리아 GDS의 미설정된 locale값이 들어올시 디폴트언어(영어)로 표기 | ||
| defaultSelectedLanguage | X | 'en' | GDS 정책에 따름 | languageCoverages에 지정되지 않은 locale의 경우 표기될 언어 지정 | ||
| onChangeLanguage | X | 'en' | 함수(콜백함수로 실행됨) | 언어선택 이후 내부동작 이외에 별도의 기능을 실행을 원할경우 함수(선택된 언어는 인자로 받음) | ||
| defaultLocale | nation | X | 한국기준 | GDS 정책에 따름 | "ISO 3166-1"에 따른 국가코드 | |
| lang | X | 한국기준 | GDS 정책에 따름 | 사용자에게 보여줄 번역 언어 | ||
| timezone | X | 한국기준 | GDS 정책에 따름 | timezone 정보 | ||
| utc_offset | X | 한국기준 | GDS 정책에 따름 | timezone utc offset 정보 | ||
| locale | X | 한국기준 | GDS 정책에 따름 | 선택된 언어 | ||
| loginMethod | redirectCurrentPage | O | fasle | true, false | 로그인 및 로그아웃시 이전페이지로 리다이렉트 true 설정시 현재 페이지로 이동 | |
| target | X | "" | "new" | "new"로 지정시 로그인 화면 새탭 열림 | ||
| params | redirect_url | X | - | 자유롭게 지정 가능 | 로그인 및 로그아웃시 지정된 URL로 리다이렉트 | |
| inflow_path | 서비스별 상이 | - | 자유롭게 지정 가능 | 로그인 채널 또는 서비스(로그인페이지 유입경로) | ||
| game_no | 서비스별 상이 | - | 자유롭게 지정 가능 | 게임 식별자 | ||
| login_url | 서비스별 상이 | - | 자유롭게 지정 가능 | 로그인 클릭시 이동되는 도메인 설정 미 지정시 한국 멤버쉽 도메인 적용 | ||
| show_play_button | 서비스별 상이 | Y | "Y", "N" | 게임 시작 동선 여부(회원 가입 시 클라이언트 실행 버튼 노출 여부) |
# 옵션 스키마
<html>
<head>
<script charset="utf-8" src="https://static-new.onstove.com/sh-5.2.26/cp-header.js"></script>
</head>
<body>
<div> 본문 입력.</div>
<script>
var options = {
wrapper: '.wrapper', /* : id 혹은 class로 지정 가능 */
isResponsive: false, /* true, false : 반응형 GNB 사용여부(6.x.x 버전이상부터 사용가능) */
skin: 'gnb-default', /* : GNB에 삽입될 스킨 기존 제공하던 디폴트, 다크, 미니, 다크 + 미니 *추가적으로 커스텀 클래스를 이용해 CSS 적용가능 */
// "gnb-default", // 기본 버전
// "gnb-default-fixed" // 상단고정
// "gnb-dark-theme", // 다크 버전
// "gnb-dark-mix" // 다크 + 팝업 흰색 버전
// "gnb- dark-mini // 다크 + 미니 버전
// "gnb-dark-mix-mini" // 다크 + 팝업 흰색 + 미니 버전
// "gnb-default-mini" // 미니버전
// "{String}" // 커스텀 클래스
isMiniSizeStoveLogo: false, /* true, false : 반응형 GNB mobile부분 로고 미니사이즈 사용 (6.x.x 버전이상부터 사용가능) */
logArea: 'stove', /* "stove", "cp" : 로그 수집을 위한 로그 영역을 지정합니다 */
stoveLogo: {
use: true, /* true, false : 스토브 로고 노출 여부 */
url: '', /* 자유로운 URL 지정가능 : 스토브 로그 클릭이 이동될 URL 지정 */
},
serviceLogo: '', /* HTML형태의 string : 스토브 로그 우측에 서비스로고 추가 예시 - <h2><a href="..."><img src="..."></a></h2> */
widget: {
/* gameList: true, */
toonspoon: true, /* true, false : 툰스푼 노출 여부 */
languageSelect: false, /* true, false : 언어 선택 여부 */
notification: true, /* true, false : 알림 노출 여부 */
gameListAndService: true, /* true, false : 게임 및 서비스 노출여부 */
totalMenu: ture, /* true, false : 전체메뉴 노출 여부 */
clientDownload: true,
customArea: {
template: "", /* HTML형태의 string : 커스텀 서비스 영역에 대체로 들어갈 템플릿 */
eventHandler: "", /* 함수(콜백함수로 실행됨) : 커스텀 영역에 템플릿에 적용될 함수 */
},
},
userMenu: {
myProfile: true, /* true, false : 유저메뉴 내에 프로필영역 노출여부 */
myCash: true, /* true, false : 유저메뉴 내에 캐시영역 노출여부 */
cartInfo: true, /* true, false : 유저메뉴 내에 장바구니 노출여부 */
myInfo: true, /* true, false : 유저메뉴 내에 내정보 노출여부 */
security: true, /* true, false : 유저메뉴 내에 보안설정 노출여부 */
customerCenter: true, /* true, false : 유저메뉴 내에 고객센터 노출여부 */
reportCenter: true, /* true, false : 유저메뉴 내에 신고센트 노출여부 */
logout: true, /* true, false : 유저메뉴 내에 로그아웃 노출여부 */
customArea: {
template: '', /* HTML형태의 string : 유저 커스텀 영역에 들어갈 템플릿 */
eventHandler: '', /* 함수(콜백함수로 실행됨) : 유저 커스텀 영역에 템플릿에 적용될 함수 */
},
},
global: {
useGds: true, /* true, false : GDS (글로벌) API 사용 여부 */
languageCoverages: ['de', 'en', 'es', 'fr', 'pt', 'zh-tw', 'ja', 'ko', 'th'], /* ['de', 'en', 'es', 'fr', 'pt', 'zh-tw', 'ja', 'ko', 'th'] : GDS의 미설정된 locale값이 들어올시 디폴트언어(영어)로 표기 */
// 글로벌 언어 사용 여부 (GDS API 사용)
// de: 독일어
// en: 영어
// es: 스페인어
// fr: 프랑스어
// pt: 포르투갈
// zh-tw: 중국(대만)
// ja: 일본
// ko: 대한민국
// vi: 베트남
// th: 태국
// id: 인도네시아
// it: 이탈리아
defaultSelectedLanguage: 'en', /* GDS 정책에 따름 : languageCoverages에 지정되지 않은 locale의 경우 표기될 언어 지정 */
onChangeLanguage: null, /* 함수(콜백함수로 실행됨) : 언어선택 이후 내부동작 이외에 별도의 기능을 실행을 원할경우 함수(선택된 언어는 인자로 받음) */
},
defaultLocale: {
nation: undefined, /* GDS 정책에 따름 : "ISO 3166-1"에 따른 국가코드 */
lang: undefined, /* GDS 정책에 따름 : 사용자에게 보여줄 번역 언어 */
timezone: undefined, /* GDS 정책에 따름 : timezone 정보 */
utc_offset: undefined, /* GDS 정책에 따름 : timezone utc offset 정보 */
locale: undefined, /* GDS 정책에 따름 : 선택된 언어 */
},
loginMethod: {
redirectCurrentPage: false, /* true, false : 로그인 및 로그아웃시 이전페이지로 리다이렉트(true 설정시 현재 페이지로 이동) */
target: '', /* 'new' : 'new'로 지정시 로그인 화면 새탭 열림 */
params: {
redirect_url : null, /* 자유롭게 지정 가능 : 로그인 및 로그아웃시 지정된 URL로 리다이렉트 */
inflow_path : null, /* 자유롭게 지정 가능 : 로그인 채널 또는 서비스(로그인페이지 유입경로) */
game_no : null, /* 자유롭게 지정 가능 : 게임 식별자 */
login_url : '', /* 자유롭게 지정 가능 : 로그인 클릭시 이동되는 도메인 설정, 미지정시 한국 멤버쉽 도메인 적용 */
show_play_button : 'Y', /* 자유롭게 지정 가능 : 게임 시작 동선 여부(회원 가입 시 클라이언트 실행 버튼 노출 여부) */
},
windowTitle: undefined,
option: undefined,
}
};
new window.cp.Header(options).render();
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97