반응형 테마- 메인배너관리에서 pc와 모바일 다르게 적용
본문
반응형 테마를 사용중입니다.
반응형 테마- 메인배너관리에서 pc와 모바일 다르게 적용할려고 하는데요
위에 메뉴얼을 보면 메인배너관리에서 pc와 모바일 각각 다르게 메인배너를 적용할수 도 있을것 같은데요,.
============== 영카트 배너관리 메뉴얼 내용 일부 ==================
배너를 표시할 접속기기를 구분합니다.
PC와 모바일에서 모두 사용할 수 있도록 설정하거나 PC 또는 모바일 전용으로 사용하게 할 수 있습니다.
PC로 설정된 배너는 모바일에서 보여지지 않고 PC에서만 표시됩니다.
모바일로 설정된 배너는 PC에서 보여지지 않고 모바일에서만 표시됩니다.
PC와 모바일로 설정된 배너는 PC와 모바일 모두 표시됩니다.
================================
메인에서 이미지 3개를 슬라이드 시킨다고 하면
메인배너 A,B,C 3개를 각각 추가해서 접속기기를 pc만을 선택하고
또 추가로 D,E,F 3개를 각각 추가해서 접속기기를 모바일만을 표시하게 선택해주면
PC에서는 PC만 선택한 메인배너를 모바일에서는 모바일만을 선택한 메인배너가 보여질거라 생각해서
해보니까.. 반응형이여서 그런지 모바일 버전만이 PC에도 적용이 되어 보이네요. PC버전 메인배너는 적용이 안되는것 같습니다.
영카트 고수님들 각각 따로 적용할 방법이 있으면 알려주시면 감사하겠습니다.
그럼 수고하세요.
답변 2
반응형으로 만들어진 테마들의 경우 반응형 처리를 위해서
"테마 > mobile > shop > index.php"
이렇게 페이지 작업을 하는 경우가 있습니다.
이렇게 되면 관리자 페이지에서 페이지를 추가하거나 게시판 설정을 할 때
mobile 쪽만 적용이 되는 것을 확인할 수 있습니다.
한 가지 버전만 신경쓰고 관리해주면 되는 장점도 있는 반면 위 처럼 PC와 Mobile을 분리해야 하는 경우 난감한 상황이 될 수 있습니다. 메인배너 같은 경우 lib/shop.lib/php 파일에 display_banner 함수를 사용하고 보통 아래와 같이 사용합니다.
display_banner("메인", "mainbanner10.skin.php")
함수에 가보시면 bn_device 라는 컬럼에 "pc"나 "mobile"을 넣어서 구분해 주는데 mobile을 기준으로 제작된 반응형 페이지에서는 이 컬럼 구분을 활용하기 힘들었던 경험이 있습니다. 그래서 display_banner의 첫번째 요소인 "메인"에서 힌트를 얻어서 이렇게 추가를 해주는 방법을 사용해 보시면 어떨까 싶습니다. position을 "메인_PC", "메인_Mobile" 과 같이 추가해서 등록하고 불러오게 하는 겁니다. 아래는 배너관리에 나오는 위치를 추가하는 방법입니다.
이 글을 참고하셔서 위치에 항목 추가하시고 display_banner의 쿼리문 중 device 관련된 부분은 제거하고 사용하시면 될 것 같네요....^^
답변해주셔서 감사합니다. 저같은 초보자를 위해 팁자료실에 예제를 들어서 해주시면 더욱 감사하겠습니다.
lib/shop.lib/php 파일에
// 배너출력 함수 바로 위에 디바이스 체크 함수를 추가해줍니다.
function MobileCheck() {
global $HTTP_USER_AGENT;
$MobileArray = array("iphone","lgtelecom","skt","mobile","samsung","nokia","blackberry","android","android","sony","phone");
$checkCount = 0;
for($i=0; $i<sizeof($MobileArray); $i++){
if(preg_match("/$MobileArray[$i]/", strtolower($HTTP_USER_AGENT))){ $checkCount++; break; }
}
return ($checkCount >= 1) ? "Mobile" : "Computer";
}
그리고 배너출력 함수를 이렇게 수정해주시면 됩니다.
function display_banner($position, $skin='')
{
global $g5;
if (!$position) $position = '왼쪽';
if (!$skin) $skin = 'boxbanner.skin.php';
$skin_path = G5_SHOP_SKIN_PATH.'/'.$skin;
if(G5_IS_MOBILE)
$skin_path = G5_MSHOP_SKIN_PATH.'/'.$skin;
if(file_exists($skin_path)) {
// 접속기기
if(MobileCheck() == "Computer")
$sql_device = " and ( bn_device = 'both' or bn_device = 'pc' ) ";
if(MobileCheck() == "Mobile")
$sql_device = " and ( bn_device = 'both' or bn_device = 'mobile' ) ";
// 배너 출력
$sql = " select * from {$g5['g5_shop_banner_table']} where '".G5_TIME_YMDHIS."' between bn_begin_time and bn_end_time $sql_device and bn_position = '$position' order by bn_order, bn_id desc ";
$result = sql_query($sql);
include $skin_path;
} else {
echo '<p>'.str_replace(G5_PATH.'/', '', $skin_path).'파일이 존재하지 않습니다.</p>';
}
}
이렇게 하시면 영카트 관리자 페이지 배너관리에서 PC,모바일 구분으로 배너 삽입 가능합니다.
반응형테마여도 상관없습니다.
