그누보드 막 입문한 초보 반응형 문의입니다.
본문
현제 반응형을 위해 미디어쿼리로 코딩을 하고있습니다.
화면창을 줄이면서 반응하는 것도 확인 했는데
실제로 모바일로 보면 그냥 pc보전 그대로만 보입니다.
모바일로 반응형을 볼려면 따로 세팅같은것을 해야하는건가요??
세팅 방법도 함께 할려주시다면 정말 감사할것같습니다.
답변 3
테마를 사용중이시라 가정하고 답변 드립니다 ~
/theme/basic/theme.config.php 파일의 7라인 부분을 아래와같이 pc로 변경해주세요.
pc 로 설정하여 PC버전만 사용하게 됩니다.
define('G5_THEME_DEVICE', 'pc');
/theme/basic/head.sub.php 파일의 아래부분을 변경해주세요.
// 변경전
if (G5_IS_MOBILE) {
echo '<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=0,maximum-scale=10,user-scalable=yes">'.PHP_EOL;
echo '<meta name="HandheldFriendly" content="true">'.PHP_EOL;
echo '<meta name="format-detection" content="telephone=no">'.PHP_EOL;
} else {
echo '<meta http-equiv="imagetoolbar" content="no">'.PHP_EOL;
echo '<meta http-equiv="X-UA-Compatible" content="IE=edge">'.PHP_EOL;
}
// 변경후
// 모바일용 뷰포트 스케일을 전체적용
echo '<meta http-equiv="x-ua-compatible" content="IE=edge,chrome=1">'.PHP_EOL;
echo '<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1, maximum-scale=1">'.PHP_EOL;
간혹 특정 문제로 모바일용 뷰포트가 적용이 안되는 경우가 있기때문에
사전에 모바일 화면을 고려하여 뷰포트를 적용 합니다.
위 코드는 사용자가 임의로 화면을 확대 할 수 없습니다.
user-scalable 을 yes 로 하고 maximum-scale 을 10정도로 하면
사용자가 임의로 화면을 확대할 수 있습니다.
예) user-scalable=yes, maximum-scale=10
위 두가지만 미리 하시고 코딩하시면 될것 같습니다.
답변 감사합니다. 말씀해주신 방법으로 수정해 보겠습니다.
config.php에서 define('G5_USE_MOBILE', true); 를 false로 바꾸셨나요?
답변 감사합니다. 확인 했을때 define('G5_USE_MOBILE', true);로 되어있었습니다.
테스트하실때
URL 끝에
&device=pc
&device=mobile
각각 붙이셔서 테스트 해보세요.
답변 감사합니다. 말씀해주신 방법으로 테스트 해보겠습니다.