안녕하세요.

xe로 사이트 운영중인데요.

 

7인치 타블렛에서 사이트 접속시 pc버전 디자인으로 뜨는데

모바일버전 디자인으로 사용하려면 어떻게 해야 할까요??

 

아시는분 조언 좀 부탁드립니다~

  • Lv6
    css에서 레이아웃을 반응형으로 적용해주면 됩니다.

    @media ( min-width: 768px ) {
    A
    }
    @media ( min-width: 1024px ) {
    B
    }

    이런식으로 A에는 모바일 레이아웃과 관련된 CSS를, B에는 PC 모바일과 관련된 CSS를 적용하시면 됩니다.
  • Lv6

    XE 자체적으로 따로 적용하는게 있을 수도 있습니다.

  • Lv6 ? Lv3
    답변 감사드립니다.
  • Lv6 ? Lv3
    자체적으로 적용하는 기능은 없는 코어와 레이아웃이네요ㅠㅠ
  • Lv37
    XE는 classes/mobile/Mobile.class.php에서 태블릿인지 파악하여(isMobilePadCheckByAgent) 모바일이 아닌 것으로 취급하고 있습니다. 이 체크를 제거하면 태블릿도 모바일로 처리됩니다.

    라이믹스에서는 태블릿을 PC로 취급할지 모바일로 취급할지 관리자가 설정할 수 있습니다.
  • Lv37 ? Lv3
    답변 감사드립니다.
    해당 파일은 확인을 했는데 체크 하는 부분을 주석처리 했는데도 태블릿이 모바일로 처리가 안되는데요.
    해당 파일에서 해당 함수가 몇 번 호출이 되던데요


    Mobile.class.php ====================================

    <?php
    /* Copyright (C) NAVER <http://www.navercorp.com> */

    /**
    * Mobile class
    *
    * @author NAVER ([email protected])
    */
    class Mobile
    {

    /**
    * Whether mobile or not mobile mode
    * @var bool
    */
    var $ismobile = NULL;

    /**
    * Get instance of Mobile class(for singleton)
    *
    * @return Mobile
    */
    function &getInstance()
    {
    static $theInstance;
    if(!isset($theInstance))
    {
    $theInstance = new Mobile();
    }
    return $theInstance;
    }

    /**
    * Get current mobile mode
    *
    * @return bool If mobile mode returns true or false
    */
    function isFromMobilePhone()
    {
    $oMobile = & Mobile::getInstance();
    return $oMobile->_isFromMobilePhone();
    }

    /**
    * Get current mobile mode
    *
    * @return bool
    */
    function _isFromMobilePhone()
    {
    if($this->ismobile !== NULL)
    {
    return $this->ismobile;
    }
    if(Mobile::isMobileEnabled() === false || Context::get('full_browse') || $_COOKIE["FullBrowse"])
    {
    return ($this->ismobile = false);
    }

    $xe_web_path = Context::pathToUrl(_XE_PATH_);

    // default setting. if there is cookie for a device, XE do not have to check if it is mobile or not and it will enhance performace of the server.
    $this->ismobile = FALSE;

    $m = Context::get('m');
    if(strlen($m) == 1)
    {
    if($m == "1")
    {
    $this->ismobile = TRUE;
    }
    elseif($m == "0")
    {
    $this->ismobile = FALSE;
    }
    }
    elseif(isset($_COOKIE['mobile']))
    {
    if($_COOKIE['user-agent'] == md5($_SERVER['HTTP_USER_AGENT']))
    {
    if($_COOKIE['mobile'] == 'true')
    {
    $this->ismobile = TRUE;
    }
    else
    {
    $this->ismobile = FALSE;
    }
    }
    else
    {
    $this->ismobile = FALSE;
    setcookie("mobile", FALSE);
    setcookie("user-agent", FALSE);
    if(!$this->isMobilePadCheckByAgent() && $this->isMobileCheckByAgent())
    {
    $this->ismobile = TRUE;
    }
    }
    }
    else
    {
    if($this->isMobilePadCheckByAgent())
    {
    $this->ismobile = FALSE;
    }
    else
    {
    if($this->isMobileCheckByAgent())
    {
    $this->ismobile = TRUE;
    }
    }
    }

    if($this->ismobile !== NULL)
    {
    if($this->ismobile == TRUE)
    {
    if($_COOKIE['mobile'] != 'true')
    {
    $_COOKIE['mobile'] = 'true';
    setcookie("mobile", 'true');
    }
    }
    elseif($_COOKIE['mobile'] != 'false')
    {
    $_COOKIE['mobile'] = 'false';
    setcookie("mobile", 'false');
    }

    if($_COOKIE['user-agent'] != md5($_SERVER['HTTP_USER_AGENT']))
    {
    setcookie("user-agent", md5($_SERVER['HTTP_USER_AGENT']));
    }
    }

    return $this->ismobile;
    }

    /**
    * Detect mobile device by user agent
    *
    * @return bool Returns true on mobile device or false.
    */
    function isMobileCheckByAgent()
    {
    static $UACheck;
    if(isset($UACheck))
    {
    return $UACheck;
    }

    $oMobile = Mobile::getInstance();
    $mobileAgent = array('iPod', 'iPhone', 'Android', 'BlackBerry', 'SymbianOS', 'Bada', 'Tizen', 'Kindle', 'Wii', 'SCH-', 'SPH-', 'CANU-', 'Windows Phone', 'Windows CE', 'POLARIS', 'Palm', 'Dorothy Browser', 'Mobile', 'Opera Mobi', 'Opera Mini', 'Minimo', 'AvantGo', 'NetFront', 'Nokia', 'LGPlayer', 'SonyEricsson', 'HTC');

    if($oMobile->isMobilePadCheckByAgent())
    {
    $UACheck = TRUE;
    return TRUE;
    }

    foreach($mobileAgent as $agent)
    {
    if(stripos($_SERVER['HTTP_USER_AGENT'], $agent) !== FALSE)
    {
    $UACheck = TRUE;
    return TRUE;
    }
    }
    $UACheck = FALSE;
    return FALSE;
    }

    /**
    * Check if user-agent is a tablet PC as iPad or Andoid tablet.
    *
    * @return bool TRUE for tablet, and FALSE for else.
    */
    function isMobilePadCheckByAgent()
    {
    static $UACheck;
    if(isset($UACheck))
    {
    return $UACheck;
    }
    $padAgent = array('iPad', 'Android', 'webOS', 'hp-tablet', 'PlayBook');

    // Android with 'Mobile' string is not a tablet-like device, and 'Andoroid' without 'Mobile' string is a tablet-like device.
    // $exceptionAgent[0] contains exception agents for all exceptions.
    $exceptionAgent = array(0 => array('Opera Mini', 'Opera Mobi'), 'Android' => 'Mobile');

    foreach($padAgent as $agent)
    {
    if(strpos($_SERVER['HTTP_USER_AGENT'], $agent) !== FALSE)
    {
    if(!isset($exceptionAgent[$agent]))
    {
    $UACheck = TRUE;
    return TRUE;
    }
    elseif(strpos($_SERVER['HTTP_USER_AGENT'], $exceptionAgent[$agent]) === FALSE)
    {
    // If the agent is the Android, that can be either tablet and mobile phone.
    foreach($exceptionAgent[0] as $val)
    {
    if(strpos($_SERVER['HTTP_USER_AGENT'], $val) !== FALSE)
    {
    $UACheck = FALSE;
    return FALSE;
    }
    }
    $UACheck = TRUE;
    return TRUE;
    }
    }
    }

    $UACheck = FALSE;
    return FALSE;
    }

    /**
    * Set mobile mode
    *
    * @param bool $ismobile
    * @return void
    */
    function setMobile($ismobile)
    {
    $oMobile = Mobile::getInstance();
    $oMobile->ismobile = $ismobile;
    }

    function isMobileEnabled()
    {
    $db_info = Context::getDBInfo();
    return ($db_info->use_mobile_view === 'Y');
    }
    }
    ?>

    =====================================================

    어느 부분을 주석 처리 해야 할까요??
  • ? Lv3 Lv37
    파일을 수정하신 후 쿠키를 비우거나 브라우저를 재시작해 보세요. 접속 직후 1회만 체크하기 때문에 중간에 파일을 수정해도 영향을 주지 않습니다.
  • Lv37 ? Lv3
    답변 감사드립니다. 상단 소스가 Mobile.class.php 파일 전체 소스인데요.
    어느 부분을 수정해야 하는지요?
    나름 수정을 해봤는데 타블렛에서 pc버전으로 계속 나오네요ㅠㅠ
  • iPad 인 경우에는 아래에서 Mobile 을 지워줘야 하던데. 한번 그렇게 해보세요.

    $mobileAgent = array('iPod', 'iPhone', 'Android', 'BlackBerry', 'SymbianOS', 'Bada', 'Tizen', 'Kindle', 'Wii', 'SCH-', 'SPH-', 'CANU-', 'Windows Phone', 'Windows CE', 'POLARIS', 'Palm', 'Dorothy Browser', 'Mobile', 'Opera Mobi', 'Opera Mini', 'Minimo', 'AvantGo', 'NetFront', 'Nokia', 'LGPlayer', 'SonyEricsson', 'HTC');
  • ? Lv3
    답변 감사드립니다.