휴대폰 도메인인 .mobi 주소를 관리하는 .dotMobi 사에서 개발이 시작된 플러그인으로 무료로 사용 가능합니다.
– 접속환경(Mobile, Desctop등)에 따라 자동으로 환경에 맞는 웹페이지를 보여줌
– 화면 사이즈에 맞게 이미지 리사이징
– Mobile Device에서 미디어 제거
– Mobile version의 WordPress admin panel 제공
워드프레스 모바일 플러그인에는 mobile press(활성 사용자수: 4,000+) , wp mobile detector, wp mobile pack 등이 있으며 이들 플러그인들은 웹사이트를 접속하는 디바이스를 자동으로 판단해서 모바일 페이지로 연결시키는 플러그인입니다.
기본으로 mobile press는 2개, wp mobile detector는 7개, wp mobile pack은 4개의 테마를 포함하고 있고, 포함된 테마가 아니더라도 PC용 테마를 자동으로 모바일 사이즈에 맞게 줄여서 보여 줍니다. 다만, 첨부된 이미지의 리사이징이 완벽하지 못함이 아쉽습니다.(출처 : 워드프레스 모바일 페이지 추천 플러그인 )
유료 테마 구입 문제 : 무료 버전이 잘 운영되길래 유료 테마(Phantom, $49)를 구입하였었는데, 유료 테마를 설치한 후 작동이 되지 않았습니다. 기술 문의를 받기 위해 <contact@appticles.com>,
<[email protected]> 으로 메일을 보냈는데, 응답이 없습니다. 결제대행사가 PayPal 이어서 다시 PayPal 을 통해 기술 지원을 요청했는데, PayPal 의 요청에도 응답이 없어 PayPal(고객센터 : 02-3483-1131)을 통해 결제 금액을 취소하고 카드 환급받기를 대기중입니다. ( 페이팔 유명한데, 콜센터 전화하기는 까다로운 절차가 있습니다. 취소하기에 어려움을 겪으시면 PAYPAL 페이팔 고객센터 전화하기 콜센터 전화번호 알려주세요 을 참조하세요 )
Agent 들이 이용하는 WordPress Mobile Pack Pro 는 구입 및 설치해 보지 않아 평가를 유보합니다.
기타 플러그인들과 동일한 방법으로 설치합니다. 관리자페이지에서 [플러그인] > [플러그인 추가] 하시어 설치하세요. 부족하신 부분은 아래의 동영상을 참조하세요.
기본적으로 아래의 6개 파트로 구성되어 있습니다.
맨위에 테마는 무료이고 아래의 테마들은 유료로 가격은 $39 ~ $49 사이입니다.($19 정도 하는 테마들은 아직 출시되지 않은 것을 선주문하는 것으로 주문시점에서는 사용할 수 없습니다. )
https://wpmobilepack.com/progressive-web-app-themes.html 에서 기능을 상세히 살펴보시고 중간부분에 [Live Preview]로 실제로 구동해보고 구입하세요. 카테고리 위주의 메뉴 설정으로 일반 설정에는 페이지 위주의 사이트에 안 맞는 테마들도 있습니다. 페이지 위주의 사이트에 맞는 테마로는 PHANTOM 이 있고 가격은 $49 입니다.
내용은
“
WordPress Mobile Pack PRO를 구입해 주셔서 감사합니다.
잠시 후 WP Mobile Pack PRO 다운로드 링크 및 라이센스 키가 포함 된 확인 이메일이 발송됩니다.
방금 사용하신 이메일 주소와 라이센스 키는 향후 프리미엄 지원 및 업데이트를 받아야하므로 이러한 세부 정보를 기록해 두십시오.
플러그인에 문제가있는 경우 지원 영역을 방문 하거나 [email protected]으로 문의하십시오 .
” 입니다.
Appticles.com<[email protected]> 로부터 메일이 왔습니다.
Warning! You have activated both WP Mobile Pack PRO and free. Please deactivate the free plugin.
PRO(유료)는 1 도메인 라이센스 ( 1 Domain License ), 무제한 웹 푸시 알림( Unlimited Web Push Notifications ), 수익 창출 옵션( Monetization Options ), 지속적인 기능 및 보안 업데이트( Ongoing Features & Security Updates), 정규 지원 1 년( 1 Year of Regular Support ), 전체 소스 코드 및 문서( Full Source Code & Documentation) 을 지원합니다.
워드프레스 테마들중에는 첫화면을 [정적인 페이지]로 지정할 수 있는 기능이 있는 테마들이 있습니다.
WordPress Mobile Pack plugin 은 카테고리와 페이지를 기준으로 블로그나 페이지를 보여주는데, 메인페이지를 특정 [정적인 페이지]로 이동하게 끔 설정하시면 이 정적인 페이지만 보이고 다른 페이지로 이동이 안됩니다.
관리자 페이지에서 [외모] -> [사용자정의] 로 이동하시어 [정적인 페이지]를 [최근 글]로 변경하셔야 스마트폰에서 PWA 가 제대로 표시됩니다.
색 구성표는 모바일 웹 응용 프로그램의 다음 섹션에 영향을 미칩니다.
1. 사이드 메뉴 범주, 범주 레이블 텍스트
2. 표지 텍스트
3. 투명 오버레이 (표지, 사이드 메뉴 이미지)
4. 단추 아이콘
5. 단추 배경
6. 범주 레이블 배경 (게시물 세부 정보)
7. 사이드 메뉴 배경
8. 사이드 메뉴 텍스트 및 아이콘
9. 테두리
10. 포스트 및 페이지 배경
11. 코멘트 목록 헤더
12. 본문
13. 링크
폰트는 마음에 드시는 것으로 선택해주세요.
나만의 로고와 아이콘 을 추가 하여 앱을 맞춤 설정할 수도 있습니다 . 로고(App logo)는 모바일 웹 앱의 홈 페이지에 표시되며, 아이콘(App icon)은 독자가 자신의 앱을 (스마트폰) 홈 화면에 추가 할 때 사용됩니다.
투명 배경을 가진 .png 형식으로 로고를 추가하십시오. 이 정보는 앱 표지에 표시됩니다.
아이콘 크기는 정사각형이어야하며 권장 크기는 512×512 픽셀입니다. 앱이 (스마트폰) 홈 화면에 추가될때 표시됩니다.
업로드 된 이미지의 파일 크기는 1MB를 초과하지 않아야합니다.
사용자가 홈 화면에 앱을 추가하라는 메시지를 표시하려면 도메인의 루트에 서비스 작업자( Service Worker )를 추가해야합니다.
FTP를 사용하여 ‘wordpress-mobile-pack’플러그인 디렉토리에있는 ‘sw.js’파일을 도메인 ‘/’의 루트로 이동하십시오.(www를 사용하시는 경우, www가 메인 루트입니다.)
파일을 루트로 옮긴 다음 상자를 체크하고 ‘저장’을 클릭하십시오. 자세한 내용은 지원 페이지를 방문 하십시오.
각 테마에는 앱을 잡지 풍미에 제공하기 위해로드 중 화면에 무작위로 표시되는 6 개의 추상 표지가 있습니다. 자신의 표지를 업로드하여 모바일 웹 응용 프로그램을 더욱 개인화 할 수 있습니다.
컨텐츠는 카테고리와 페이지를 기준으로 보여지며 활성화/비활성화를 선택하여 보여줄지 말지를 결정하게 됩니다.
모바일 웹 애플리케이션에 표시 할 카테고리를 선택하십시오. 카테고리를 표시 / 숨기고 원하는 위치의 해당 행을 드래그하여 순서를 정렬하려면 아래 행을 클릭하십시오.
저처럼 카테고리가 많은 경우(400개 이상) inactive하는 것보다 보여주고 싶은 카테고리를 상단으로 드래그하여 끌오올려서 배치하는 것이 수월합니다.
모바일 웹 응용 프로그램에 표시 할 페이지를 선택하십시오. 다른 페이지를 편집, 표시 또는 숨길 수 있습니다. 페이지 순서는 워드프레스 관리자페이지의 ‘페이지’관리 패널 에서 설정할 수 있습니다 .
상위 페이지를 비활성화하면 모바일 버전의 하위 페이지도 숨겨집니다.
참고 : 위에 카테고리에서는 드래그하여 순서 변경이 가능하나 ‘페이지’관리 패널 ‘에서 페이지 순서를 변경할 수 있다고 하나 드래그하여 순서를 정렬할 수 없습니다. 다른 플러그인을 설치하여 페이지의 순서를 변경해야 할 것 같습니다. WordPress Mobile pack 으로는 active/inactive만 변경할 수 있습니다.
Display 모두는 Normal (all mobile visitors), Preview (logged in administrators), Disabled (hidden for all) 가 있습니다.
이용하시는 테마가 반응형 테마이시라면 완성되지 않은 플러그인을 활성화하시면 모바일에서 제대로 보여지지 않아 모바일로 접속하시는 분들이 불편을 겪을 수 있습니다. 이때 필요한 것이 Display Mode 기능입니다.
개발 및 설정하는 동안에는 진척상황을 확인하실때는 켜놓고 비활성화해 놓으시는 것나 Preview (logged in administrators), Disabled (hidden for all) 을 선택하시면 모바일 이용자에게 불편을 주지 않으면서 개발할 수 있습니다.
나만의 Google 웹 로그 분석 ID 를 추가하여 모바일 방문자가 애플리케이션과 상호 작용하는 방식에 대한 더 많은 정보를 얻을 수도 있습니다 .
웹 로그 분석 ID(Google Analytics Id) 는 구글 애널리틱스에서 로그인하시어 관리자 페이지로 이동하시어 속성설정을 click하시면 보실 수 있습니다.
PRO버전에 대해 더 알아보고자 하시는 분은 아래의 동영상을 참조하세요.
appticles.com이 pwacommerce.com 의 모회사 같습니다. appticles.com 은 WordPress Mobile Pack PRO 을 코드캐니언의 envatomarket 에서 $70 에 판매합니다.
2 Comments
[…] 워드프레스 프로그레시브 웹 앱 플퍼그인 Progressive Web App plugin : WordPress Mobil… […]
[…] WordPress Mobile Pack plugin : 워드프레스 프로그레시브 웹 앱 플러그인 Progressive W… […]