사용자 도구

사이트 도구


dokuwiki:mobile_template

Dokuwiki에서 일반 웹 브라우저와 모바일웹 동시지원

최신 버전의 Dokuwiki는 기본 템플릿이 PC/모바일에 동시 대응하고 있다.

현재 이 위키는 Mobile과 일반 웹 브라우저 모두에서 잘 렌더링 되도록 지원하려고 하고 있다.

기본적인 방법은 default 템플릿의 main.php를 수정하여 모바일일 경우 viewport 정보를 넣고, 컨텐츠 렌더링시에 목차 부분을 빼는 간단한 수준으로 처리하고 있다. CSS에 대한 세세한 튜닝 등은 차차 해나갈 예정이다.

main.php 시작부분에서 모바일 여부를 User-Agent로 판단한다. 그렇게 $mobile 변수가 true/false 값으로 생기게 된다.

function agent($browser) {
  return strstr(@$_SERVER['HTTP_USER_AGENT'], $browser);
}
 
function check_mobile() {
  $mobile_agents = array("Android","iPhone","iPod","Opera Mini","Opera Mobi");
  foreach($mobile_agents as $i => $value) {
    if (agent($value)) {
      return true;
    }   
  }
  return false;
}
 
 
$mobile = check_mobile();

이제 $mobile 값으로 viewport 정보를 <head> 영역에 넣는다.

  <?php
    if ($mobile) {
      echo "<meta name = \"viewport\" content = \"user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width\" />";
    }
  ?>

그리고 나서, 마지막 tpl_content() 호출부분을 찾아서 아래와 같이 바꾼다.

<?php
  $need_toc = !($mobile);
  tpl_content($need_toc);
?>
dokuwiki/mobile_template.txt · 마지막으로 수정됨: 2013/06/02 14:33 저자 kwon37xi