워드프레스 - 모바일 기기에서 다른 html 페이지로 Redirection시키는 방법

  • 네이버 블로그 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 트위터 공유하기
  • 카카오스토리 공유하기

개요

최근 몇 년 동안 모바일의 중요성에 커짐에 따라 PC/모바일 기기에 관계 없이 사이트를 표시하는 반응형 웹사이트가 점점 많아 지고 있습니다.

기존 비반응형 웹을 모바일에 대응하는 방법은 여러 가지가 있습니다.

  1. css를 통해 반응형 사이트로 만들기
  2. 플러그인을 사용하여 모바일 웹 구현

플러그인에도 크게 두 가지 유형이 있는데,

  • 비반응형 웹사이트를 모바일 버전으로 변환해주는 것(예: WPtouch Mobile Plugin)과
  • 모바일 스위치라고 하여 PC용 테마와 모바일용 테마를 달리 지정하는 플러그인이 있습니다(예: Any Mobile Theme Switcher).

WPtouch Mobile Plugin의 경우 플러그인을 설치하고 플러그인을 설정하면 기존 웹사이트를 모바일에서는 WPtouch Mobile Plugin을 통해 변환한 모바일 버전을 보여주는 방식이고, Any Mobile Theme Switcher는 PC용 테마와 모바일용 테마를 달리 지정하여 PC에서와 모바일 기기에서 각각 다른 테마를 보여줍니다.

기존 WP 웹사이트를 다른 반응형 테마의 모바일 버전을 사용하여 문제 없이 보여준다면 Any Mobile Theme Switcher도 훌륭한 선택일 수 있을 것입니다. 테스트해 본 결과 복잡한 사이트의 경우 WPtouch Mobile Plugin으로는 만족할 만한 결과를 얻지 못했고, 모바일 스위처를 사용하여 어느 정도 괜찮은 결과를 얻을 수 있었습니다. 이 경우 모바일용 테마를 PC용 테마에 따라 어느 정도 변경을 해야 합니다.

Mobile-Detect 사용하기

또 다른 선택으로 모바일 기기에서는 사용자가 지정한 페이지로 Redirection하는 경우도 생각해볼 수 있습니다(가령, PC에서는 기존 웹사이트가 그대로 표시되고 모바일 기기에서는 사용자가 지정한 특정 html 페이지로 연결됨). 이를 위한 방법 중 하나는 Mobile-Detect를 테마 폴더에 포함시키고 header.php 파일에 다음 코드를 추가하는 것입니다.

if( is_front_page() ){

include_once('mobile-detect/Mobile_Detect.php'); //Mobile Detect.php 경로
$detect = new Mobile_Detect();

if ( $detect->isMobile() || $detect->isTablet() ) {
$redirect_url = 'http://모바일_버전_페이지_주소';
header('Location: ' . $redirect_url ); // Redirect the user
}
}

테스트해 본 결과 이 방법으로 쉽게 모바일용 Html로 전환이 가능했습니다.

추가: Mobile Detect 파일 다운로드는 다음 그림을 참조하시기 바랍니다.
Mobile Detect Download

기존 비반응형 웹사이트를 모바일 기기에 맞추어 변경한다는 것은 쉬운 일이 아닙니다. 전문가의 경우 CSS를 통해 반응형 웹사이트로 수정할 수 있지만, 비전문가의 경우 쉽지 않은 작업입니다(이 작업에 대한 자세한 정보는 Lynda.com의 강좌가 많은 도움이 될 것입니다: http://www.lynda.com/WordPress-tutorials/WordPress-Building-Responsive-Themes/104261-2.html).

RedirectPlus 플러그인 사용하기

추가: 위의 내용에 따라 파일을 다운로드하여 설정하는 작업이 쉽지 않을 수 있습니다. 이 경우에 사용할 수 있는 플러그인으로 RedirectPlus라는 플러그인을 발견했습니다.

RedirectPlus - WordPress Mobile Redirect Plugin

RedirectPlus는 모바일 장치를 감지하여 모바일 사이트로 리디렉션하는 워드프레스용 플러그인입니다. 체크박스 옵션을 통해 태블릿 기기일 경우 모바일 사이트로 리디트할 것인지를 선택할 수 있습니다. 또한, 아이폰, 안드로이드, Windows 폰에 대해 다르게 설정할 수 있는 옵션도 제공된다고 하네요. 이 플러그인은 또한 전체 버전 웹사이트를 볼 수 있도록 하는 기능도 제공합니다.

주요 특징:

모든 모바일/태블릿 장치를 모바일에 최적화된 URL로 리디렉션

  • 전체 사이트 또는 특정 페이지 리디렉션
  • 태블릿에 대한 리디렉션 활성화 선택 가능
  • 아이패드 및 기타 태블릿에 대하여 다른 URL 옵션
  • 아이폰, 안드로이드, 윈도 폰 등에 대하여 다른 URL 온션
  • 모바일 최적화 URL에서 다시 메인 웹사이트로 리디렉션시키는 옵션 제공

이외에도 Country and Mobile Redirect for WordPress - Professional Edition과 같은 플러그인도 있네요. 이 플러그인은 SEO 표준 301, 302 리디렉트를 사용하는 워드프레스용 URL 리디렉션 플러그인입니다. 이 플러그인을 사용하여 원하는 페이지를 404 페이지로 사용이 가능합니다. 국가, 도시, 홈 페이지를 기준으로 리디렉션, 모바일 사이트로 디디렉션, Analytics(분석), WMLP 호환, 워드프레스 멀티사이트 호환, 번역 가능 등 다양한 기능을 제공합니다.



댓글 남기기