[YC5] 상품 설명에 동영상 연결하기 > 기술자료

• 목록

영카트 쇼핑몰 상품설명에 동영상을 자동 노출하기 위해 만들었습니다.


1. 영카트5 / adm / shop_admin / itemform.php

페이지 상단 적당한 위치에 아래 코드를 추가합니다.
동영상 주소가 저장될 필드를 자동 생성하는 코드 입니다.

<?php
// 동영상 필드 추가
if(!sql_query(" select it_youtube from {$g5['g5_shop_item_table']} limit 1 ", false)) {
    sql_query(" ALTER TABLE `{$g5['g5_shop_item_table']}`
                    ADD `it_youtube` varchar(255) NOT NULL  ", true);
}
?>


페이지 중간 적당한 위치에 동영상 링크가 저장될 입력창을 추가합니다.

        <tr>
            <th scope="row">동영상</th>
            <td colspan="2">
                <input type="text" name="it_youtube" value="<?php echo $it['it_youtube']; ?>" class="frm_input" style="width:100%;"><br>
                ex) https://youtu.be/yH2kyWlWOP4
            </td>
        </tr>


2. 영카트5 / adm / shop_admin / itemformupdate.php

                it_10               = '$it_10'
                ";

를 아래와 같이 동영상 필드 저장 퀴리를 추가합니다.

                it_10               = '$it_10',
                it_youtube          = '{$it_youtube}'
                ";


3. 영카트5 / lib / movie.lib.php  생성합니다.
본 강좌에는 유튜브에 대한 것을 정리하였습니다.

<?php
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
// 그외 다양한 동영상 매체 ( 카카오TV, tvpot, 네이버TV, vimeo, liveleak 등 )의 소스는 유료판매합니다.
// 구매가 필요한 분은 mail@happyjung.com 으로 문의주세요
            //$movie_url = $view["wr_link1"];  // 동영상 링크
            
            //$movie_url = "http://youtu.be/yH2kyWlWOP4";
            if (!preg_match('/youtu.be/', $movie_url) == true) {
            } else {
                $movie_url0 = explode('/',$movie_url);
                $movie_url3 = $movie_url0[3];
                if ($movie_url3) { ?><div style="position:relative;height:0;padding-bottom:56.25%"><iframe src="https://www.youtube.com/embed/<?php echo $movie_url3; ?>?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen style="position:absolute;width:100%;height:100%;left:0"></iframe></div><?php }
                $movie_true="yes";
            }
            
            //$movie_url = "https://www.youtube.com/watch?v=yH2kyWlWOP4";
            if (!preg_match('/youtube.com/', $movie_url) == true) {
            } else {
                $movie_url0 = explode('?v=',$movie_url);

            $movie_url3 = $movie_url0[1];
                if ($movie_url3) { ?><div style="position:relative;height:0;padding-bottom:56.25%"><iframe src="https://www.youtube.com/embed/<?php echo $movie_url3; ?>?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen style="position:absolute;width:100%;height:100%;left:0"></iframe></div><?php }
                $movie_true="yes";
            }
?>


4. PC 상품설명
영카트5 / skin / shop / basic / item.info.skin.php  ... 테마 미사용시
영카트5 / theme / basic / skin / shop / basic / item.info.skin.php  ... 테마사용시

    <?php if ($it['it_basic']) { // 상품 기본설명 ?>
    <h3>상품 기본설명</h3>
    <div id="sit_inf_basic">
         <?php echo $it['it_basic']; ?>
    </div>
    <?php } ?>

밑에 아래 내용을 추가합니다.
다른 위치에 노출을 원한다면 그곳에 아래 코드를 추가합니다.

    <?php if ($it['it_youtube']) { // 동영상 보기 ?>
    <h3>동영상 보기</h3>
    <div>
    <script type="text/javascript">
      $(window).resize(function(){resizeYoutube();});
      $(function(){resizeYoutube();});
      function resizeYoutube(){ $("iframe").each(function(){ if( /^https?:\/\/www.youtube.com\/embed\//g.test($(this).attr("src")) ){ $(this).css("width","100%"); $(this).css("height",Math.ceil( parseInt($(this).css("width")) * 480 / 854 ) + "px");} }); }
    </script>
         <?php
            $movie_url = $it['it_youtube'];  // 동영상 링크
            include G5_LIB_PATH."/movie.lib.php";
        ?>
    </div>
    <?php } ?>


5. Mobile 상세설명
영카트5 / mobile / skin / shop / basic / item.form.skin.php  ... 테마 미사용시
영카트5 / theme / basic / mobile / skin / shop / basic / item.form.skin.php  ... 테마사용시

        <!-- 상품 정보 시작 { -->
        <li id="sit_inf">
            <h2 class="contents_tit"><span>상품 정보</span></h2>

밑에 아래 내용을 추가합니다.
다른 위치에 노출을 원한다면 그곳에 아래 코드를 추가합니다.

            <?php if ($it['it_youtube']) { // 동영상 보기 ?>
            <h3>동영상 보기</h3>
            <div>
            <script type="text/javascript">
              $(window).resize(function(){resizeYoutube();});
              $(function(){resizeYoutube();});
              function resizeYoutube(){ $("iframe").each(function(){ if( /^https?:\/\/www.youtube.com\/embed\//g.test($(this).attr("src")) ){ $(this).css("width","100%"); $(this).css("height",Math.ceil( parseInt($(this).css("width")) * 480 / 854 ) + "px");} }); }
            </script>
                 <?php
                    $movie_url = $it['it_youtube'];  // 동영상 링크
                    include G5_LIB_PATH."/movie.lib.php";
                ?>
            </div>
            <?php } ?>