gil/fod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

스트리밍 프리미엄 수정 완료

Browse Source
This commit is contained in:
hyeonggil
2024-09-20 19:25:24 +09:00
parent d2c073879b
commit b9632f225d
9 changed files with 173 additions and 176 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/images/kia/contents/streamingPremium.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 176 KiB

After

Width:  |  Height:  |  Size: 455 KiB

BIN
assets/images/kia/pdp/streaming_premium/img_spec.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 40 KiB

BIN
assets/images/kia/pdp/streaming_premium/img_spec_m.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 67 KiB

After

Width:  |  Height:  |  Size: 68 KiB

5
info/product-usage-guide-streamingPremium.html
View File

@@ -247,8 +247,9 @@
<div>
<h3 class="titleCase02" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">스트리밍 프리미엄</h3>
<p class="txtCase01" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
사양 구매 후 차량 내 메인 메뉴에서 ‘시네마 및 엔터테인먼트’ 기능을 이용할 수 있으며, ‘미디어’ 기능에서 뮤직 스트리밍 앱의 고음질 음원을 이용 할 수 있습니다. 또한, LG webOS를 활용한 다양한 OTT 및 앱 이용이 가능합니다.
<span style="color: #676767; display: block; padding-top: 15px">※ 기아 커넥트 서비스가 유지 상태여야 이용할 수 있습니다.</span>
사양 구매 후 차량 내 메인 메뉴에서 ‘시네마 및 엔터테인먼트’ 기능을 이용할 수 있으며,
‘미디어’ 기능에서 스트리밍 프리미엄의 고음질 음원을 이용 할 수 있습니다. 또한, LG webOS를 활용한 다양한 OTT 및 앱 이용이 가능합니다.
<span style="color: #676767; display: block; padding-top: 15px">※ Kia Connect 서비스가 유지 상태여야 이용할 수 있습니다.</span>
</p>
</div>
</section>

327
info/product-usage-guide-streamingPremium.php
View File

@@ -42,178 +42,175 @@
</div>
<div class="contentWarp">
<div class="contentsTypeNew caseUsageDetail">
<section class="caseInfoWrap">
<h2 class="titleCase01">스트리밍 프리미엄</h2>
<img src="/kr/assets/images/kia/contents/streamingPremium.jpg" alt="스트리밍 프리미엄" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div>
<h3 class="titleCase02" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
스트리밍 프리미엄
</h3>
<p class="txtCase01" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
사양 구매 후 차량 내  메인 메뉴에서 ‘시네마 및 엔터테인먼트’ 기능을
이용할 수 있으며, ‘미디어’ 기능에서 뮤직 스트리밍 앱의 고음질 음원을 이용 할 수 있습니다. 또한, LG webOS를 활용한 다양한 OTT 및 앱 이용이
가능합니다.
<span style="color: #676767; display: block; padding-top: 15px;">※ 기아 커넥트 서비스가 유지 상태여야 이용할 수 있습니다.</span>
</p>
</div>
</section>
<div class="contentsTypeNew caseUsageDetail">
<section class="caseInfoWrap">
<h2 class="titleCase01">스트리밍 프리미엄</h2>
<img src="../assets/images/kia/contents/streamingPremium.jpg" alt="스트리밍 프리미엄" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800" />
<div>
<h3 class="titleCase02" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">스트리밍 프리미엄</h3>
<p class="txtCase01" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
사양 구매 후 차량 내 메인 메뉴에서 ‘시네마 및 엔터테인먼트’ 기능을 이용할 수 있으며,
‘미디어’ 기능에서 스트리밍 프리미엄의 고음질 음원을 이용 할 수 있습니다. 또한, LG webOS를 활용한 다양한 OTT 및 앱 이용이 가능합니다.
<span style="color: #676767; display: block; padding-top: 15px">※ Kia Connect 서비스가 유지 상태여야 이용할 수 있습니다.</span>
</p>
</div>
</section>
<section class="caseFunction">
<h2 class="titleCase01" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">컨텐츠 이용 방법</h2>
<section class="caseFunction">
<h2 class="titleCase01" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">컨텐츠 이용 방법</h2>
<div class="functionTab" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<ul>
<li class="active"><button><b>엔터테인먼트</b></button></li>
<li><button><b>고음질 스트리밍/시네마</b></button></li>
</ul>
</div>
<div class="functionTab" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<ul>
<li class="active">
<button><b>엔터테인먼트</b></button>
</li>
<li>
<button><b>고음질 스트리밍/시네마</b></button>
</li>
</ul>
</div>
<script>
$(document).ready(function() {
const btn = $(".selectInner_new2").find(".btn-select");
const list = $(".selectInner_new2").find(".list-member");
$(document).on("click",".selectInner_new2 .btn-select",function(){
$(this).toggleClass("on");
});
$(document).on("click",".selectInner_new2 .list-member li button",function(event){
if (event.target.nodeName === "BUTTON") {
btn.html(event.target.innerText);
btn.removeClass('on');
var tabIndex = $(this).parent().index() +1;
$('.caseFunction>section:nth-of-type('+tabIndex+')').show().siblings('section').hide();
}
});
});
</script>
<script>
$(document).ready(function () {
const btn = $(".selectInner_new2").find(".btn-select");
const list = $(".selectInner_new2").find(".list-member");
$(document).on("click", ".selectInner_new2 .btn-select", function () {
$(this).toggleClass("on");
});
$(document).on("click", ".selectInner_new2 .list-member li button", function (event) {
if (event.target.nodeName === "BUTTON") {
btn.html(event.target.innerText);
btn.removeClass("on");
var tabIndex = $(this).parent().index() + 1;
$(".caseFunction>section:nth-of-type(" + tabIndex + ")")
.show()
.siblings("section")
.hide();
}
});
});
</script>
<div class="selectInner_new2">
<div class="cont-select">
<button class="btn-select">엔터테인먼트</button>
<ul class="list-member">
<li><button>엔터테인먼트</button></li>
<li><button>고음질 스트리밍/시네마</button></li>
</ul>
</div>
</div>
<section class="functionDetail active">
<section class="storeGuideItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<header class="case">
<h4 class="titleCase03">컨텐츠 앱 설정 방법</h4>
<strong>3 STEP</strong>
</header>
<div class="swiper swiper1">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide">
<img class="noBorder" src="/kr/assets/images/kia/contents/sprem01_1.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임">
<b>STEP 01</b>
<p class="caseBlack txtCase01">
사양 구매 후, 엔터테인먼트 카드에 진입합니다.<br>
홈 화면 > 메뉴 > 엔터테인먼트<br>
(별도의 설치과정이 필요하지 않습니다)
</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="/kr/assets/images/kia/contents/sprem01_2.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임">
<b>STEP 02</b>
<p class="caseBlack txtCase01">
좌우로 스크롤링하여 컨텐츠를 탐색/선택합니다.
</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="/kr/assets/images/kia/contents/sprem01_3.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임">
<b>STEP 03</b>
<p class="caseBlack txtCase01">
새로운 앱을 추가로 다운받을 때에는 Apps를 클릭합니다.<br>
앱을 선택하여 다운로드 받습니다.<br>
엔터테인먼트 > Apps > 앱 선택
</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space"></div>
</div>
<div class="swiper-button-next btnNextSlide1"></div>
<div class="swiper-button-prev btnPrevSlide1"></div>
</section>
<section class="storeGuideItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<header class="case">
<h4 class="titleCase03">컨텐츠 이용 방법</h4>
<strong>3 STEP</strong>
</header>
<div class="swiper swiper1">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide">
<img class="noBorder" src="/kr/assets/images/kia/contents/sprem01_2.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임">
<b>STEP 01</b>
<p class="caseBlack txtCase01">
좌우로 스크롤링하여 컨텐츠를 탐색/선택합니다.
</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="/kr/assets/images/kia/contents/sprem02_2.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임">
<b>STEP 02</b>
<p class="caseBlack txtCase01">
(선택사항) 컨텐츠 사에 따라 별도 유료 계정이 필요할 수 있습니다. <br>
이 경우에는 화면에서 로그인을 실행 해주세요
</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="/kr/assets/images/kia/contents/sprem02_3.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임">
<b>STEP 03</b>
<p class="caseBlack txtCase01">
선택한 컨텐츠를 이용합니다.
</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space"></div>
</div>
<div class="swiper-button-next btnNextSlide1"></div>
<div class="swiper-button-prev btnPrevSlide1"></div>
</section>
</section>
<section class="functionDetail">
<section class="storeGuideItem">
<header class="case" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<h4 class="titleCase03">컨텐츠 이용 방법</h4>
<!-- <strong>2 STEP</strong> -->
</header>
<div class="swiper swiper2">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img src="/kr/assets/images/kia/contents/sprem01_1.jpg" alt="스마트 회생 시스템 기능 설정을 위해 인포테인먼트 시스템 홈 화면의 EV 항목을 선택">
<b>STEP 01</b>
<p class="caseBlack txtCase01">
기존 스트리밍 플러스 이용 방안과 동일합니다.<br><br>
<a href="https://connectstore.kia.com/kr/info/product-usage-guide-streaming" style="color:#000;text-decoration: underline;">https://connectstore.kia.com/kr/info/product-usage-guide-streaming</a>
</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"></div>
</div>
<div class="swiper-button-next btnNextSlide4"></div>
<div class="swiper-button-prev btnPrevSlide4"></div>
</section>
</section>
</section>
<div class="contentsBtnWarp">
<div class="oneButton">
<a href="../info/product-usage-guide"><p>목록</p></a>
</div>
<div class="selectInner_new2">
<div class="cont-select">
<button class="btn-select">엔터테인먼트</button>
<ul class="list-member">
<li><button>엔터테인먼트</button></li>
<li><button>고음질 스트리밍/시네마</button></li>
</ul>
</div>
</div>
</div>
<section class="functionDetail active">
<section class="storeGuideItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<header class="case">
<h4 class="titleCase03">컨텐츠 앱 설정 방법</h4>
<strong>3 STEP</strong>
</header>
<div class="swiper swiper1">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/sprem01_1.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임" />
<b>STEP 01</b>
<p class="caseBlack txtCase01">
사양 구매 후, 엔터테인먼트 카드에 진입합니다.<br />
홈 화면 > 메뉴 > 엔터테인먼트<br />
(별도의 설치과정이 필요하지 않습니다)
</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/sprem01_2.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임" />
<b>STEP 02</b>
<p class="caseBlack txtCase01">좌우로 스크롤링하여 컨텐츠를 탐색/선택합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/sprem01_3.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임" />
<b>STEP 03</b>
<p class="caseBlack txtCase01">
<!-- 새로운 앱을 추가로 다운받을 때에는 Apps를 클릭합니다.<br />
앱을 선택하여 다운로드 받습니다. -->
새로운 앱을 추가로 다운받을 때에는 Apps를 클릭합니다.<br />
앱을 선택하여 다운로드 받습니다.<br />
엔터테인먼트 > Apps > 앱 선택
</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space"></div>
</div>
<div class="swiper-button-next btnNextSlide1"></div>
<div class="swiper-button-prev btnPrevSlide1"></div>
</section>
<section class="storeGuideItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<header class="case">
<h4 class="titleCase03">컨텐츠 이용 방법</h4>
<strong>3 STEP</strong>
</header>
<div class="swiper swiper2">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/sprem01_2.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임" />
<b>STEP 01</b>
<p class="caseBlack txtCase01">좌우로 스크롤링하여 컨텐츠를 탐색/선택합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/sprem02_2.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임" />
<b>STEP 02</b>
<p class="caseBlack txtCase01">
(선택사항) 컨텐츠 사에 따라 별도 유료 계정이 필요할 수 있습니다. <br />
이 경우에는 화면에서 로그인을 실행 해주세요
</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/sprem02_3.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임" />
<b>STEP 03</b>
<p class="caseBlack txtCase01">선택한 컨텐츠를 이용합니다.</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space"></div>
</div>
<div class="swiper-button-next btnNextSlide2"></div>
<div class="swiper-button-prev btnPrevSlide2"></div>
</section>
</section>
<section class="functionDetail">
<section class="storeGuideItem">
<header class="case" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<h4 class="titleCase03">컨텐츠 이용 방법</h4>
<!-- <strong>2 STEP</strong> -->
</header>
<div class="swiper swiper3">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img src="../assets/images/kia/contents/sprem02_1.jpg" alt="스마트 회생 시스템 기능 설정을 위해 인포테인먼트 시스템 홈 화면의 EV 항목을 선택" />
<b>STEP 01</b>
<p class="caseBlack txtCase01">
기존 스트리밍 플러스 이용 방안과 동일합니다.<br /><br />
<a href="https://connectstore.kia.com/kr/info/product-usage-guide-streaming" style="color: #000; text-decoration: underline">https://connectstore.kia.com/kr/info/product-usage-guide-streaming</a>
</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"></div>
</div>
<div class="swiper-button-next btnNextSlide3"></div>
<div class="swiper-button-prev btnPrevSlide3"></div>
</section>
</section>
</section>
<div class="contentsBtnWarp">
<div class="oneButton">
<a href="../info/product-usage-guide"><p>목록</p></a>
</div>
</div>
</div>
</div>
<!--//footer-->
<?php

5
info/product-usage-guide.html
View File

@@ -251,9 +251,8 @@
<a href="../info/product-usage-guide-nba.html" style="background-image: url('../assets/images/kia/contents/imgUsageList05.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>NBA 디스플레이 테마</b></a>
<a href="../info/product-usage-guide-incargame.html" style="background-image: url('../assets/images/kia/contents/imgUsageList06.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>아케이드 게임</b></a>
<a href="../info/product-usage-guide-srs.html" style="background-image: url('../assets/images/kia/contents/imgUsageList07.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스마트 회생 시스템 플러스</b></a>
<a href="#" style="background-image: url('../assets/images/kia/contents/imgUsageList08_comingsoon.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스트리밍 프리미엄 (Coming Soon)</b></a>
<!-- [D] 스트리밍 프리미엄 오픈시 버전 -->
<!-- <a href="../info/product-usage-guide-streamingPremium.html" style="background-image: url('../assets/images/kia/contents/imgUsageList08.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스트리밍 프리미엄</b></a> -->
<!-- <a href="#" style="background-image: url('../assets/images/kia/contents/imgUsageList08_comingsoon.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스트리밍 프리미엄 (Coming Soon)</b></a> -->
<a href="../info/product-usage-guide-streamingPremium.html" style="background-image: url('../assets/images/kia/contents/streamingPremium.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스트리밍 프리미엄</b></a>
<!-- 2024-08-06 추가 -->
<a href="../info/product-usage-guide-boost.html" style="background-image: url('../assets/images/kia/contents/imgUsageList09.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>부스트</b></a>
<!--// 2024-08-06 추가 -->

2
mypage/my-product-view.html
View File

@@ -33,7 +33,7 @@
<script type="text/javascript" charset="UTF-8" src="../assets/js/library/aos.js?v1"></script>
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v1"></script>
<!--상품상세 페이지 css 분리-->
<link rel="stylesheet" charset="UTF-8" href="/kr/assets/css/mypage.css?v1" type="text/css" />
<link rel="stylesheet" charset="UTF-8" href="../assets/css/mypage.css?v1" type="text/css" />
<link rel="shortcut icon" href="../assets/images/kia/home_icon.png" />
<link rel="apple-touch-icon-precomposed" href="../assets/images/kia/home_icon.png" />
<link rel="shortcut icon" href="../assets/images/kia/favicon-16x16.png">

2
mypage/payment-history-list.html
View File

@@ -33,7 +33,7 @@
<script type="text/javascript" charset="UTF-8" src="../assets/js/library/aos.js?v1"></script>
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v1"></script>
<!--사양상세 페이지 css 분리-->
<link rel="stylesheet" charset="UTF-8" href="/kr/assets/css/mypage.css?v1" type="text/css" />
<link rel="stylesheet" charset="UTF-8" href="../assets/css/mypage.css?v1" type="text/css" />
<link rel="shortcut icon" href="../assets/images/kia/home_icon.png" />
<link rel="apple-touch-icon-precomposed" href="../assets/images/kia/home_icon.png" />
<link rel="shortcut icon" href="../assets/images/kia/favicon-16x16.png">

8
product/pdp_streaming_premium.html
View File

@@ -465,7 +465,7 @@
<div class="swiper-pagination"></div>
</div>
<div class="text_area">
<h5>노래방 / 키즈/ 게임</h5>
<h5>노래방 / 키즈 / 게임</h5>
<p>온가족 또는 친구와 함께 즐길 수 있는 컨텐츠가 준비되어 있습니다</p>
</div>
</div>
@@ -514,7 +514,7 @@
<div class="comp_1x_b_n_n_e1 displayTheme">
<div class="comp_body">
<h5>사양 이용 영상</h5>
<div class="youtubeArea youtubeArea_pdp" value="AJWgnJIOyRU"></div>
<div class="youtubeArea youtubeArea_pdp" value="UN0eY5nzo9Q"></div>
</div>
</div>
@@ -767,7 +767,7 @@
</div>
<div class="popInner payInfo" style="display: none">
<dㅇㅇㅇㅇiv class="popContents">
<div class="popContents">
<h1>결제 방법 안내</h1>
<div class="payInfoCon">
<p>
@@ -779,7 +779,7 @@
<a href=""><p>닫기</p></a>
</div>
</div>
</dㅇㅇㅇㅇiv>
</div>
</div>
</div>
<!--//footer-->