▶ 팝업이란?
앱 실행시 새로운 이미지 창을 띄어서 앱 공지나 이벤트 등을 보여줄 수 있는 기능입니다.
스윙에서 팝업 서비스를 제공하고 있으며, 다양한 스타일 중에서 원하는 스타일을 선택해서 팝업을 앱에 적용할 수 있습니다.
*팝업은 푸시, 웹뷰 프로토타입에서는 이용할 수 없습니다.
슬라이드,탑,푸터,드롭메뉴에서만 사용할 수 있는 기능입니다.
매뉴얼을 통해서 팝업을 적용하는 방법을 확인해주세요.
ㅜ
▶팝업관리 페이지 이동
앱운영 페이지 → 서비스관리 → 팝업관리 메뉴 이동
스윙에서 제공하는 팝업 스타일은 총 4가지 입니다.
사용자가 원하는 팝업을 선택해서 제작해주세요.
아래에서 각 스타일별로 팝업을 적용해볼게요.
1.첫 번째 팝업 스타일
팝업 첫번째 스타일은 이미지 한 장을 넣어서 팝업을 만들 수 있어요.
이미지에 링크 등을 연동하여 해당 페이지로 이동할 수 있습니다.
1)’팝업켜기’에 체크
2) 첫번째 팝업스타일 체크
3)핸드폰이미지를 선택해서 팝업 이미지를 등록해주세요.
*권장 해상도를 꼭 지켜주세요. (1024*1920 px)
이미지가 등록되면 [링크 이미지 설정] 창이 뜹니다.
링크 이미지 설정은 팝업창 이미지를 선택시, 연동된 페이지로 이동하게 하는 기능이에요.
웹사이트, 앱 내의 페이지, 게시판, 게시물, 파일 첨부 등 어디로 연동을 할지 선택을 해주시면 됩니다.
4)‘링크마법사’ 버튼 선택
5)연동할 페이지 선택 후 반영
6)‘링크적용’ 버튼 선택
7)‘변경사항저장’ 버튼을 누르면 완료됩니다.
*연결할 링크가 없으면 ‘링크없음’에 체크합니다
*이미지 변경, 이미지 삭제: 해당 팝업 이미지를 다른 이미지를 변경할 수 있고, 이미지를 삭제할 수도 있습니다.
[앱 실행화면 – 팝업 실행]
[움짤 이미지 확인하기]
앱을 실행하면 팝업 화면을 확인할 수 있어요.
팝업에 적용시킨 이미지가 큰 이미지로 보여집니다.
2. 두 번째 팝업 스타일
두 번째 팝업은 이미지가 총 3장이 등록됩니다. 슬라이드하여 해당 이미지를 확인할 수 있구요.
적용방법은 첫번째 방법과 동일합니다.
두 번째 스타일은 이미지를 3장을 등록해야 하니, 미리 팝업에 적용할 이미지를 준비해주세요.
*각 이미지마다 링크마법사를 실행하여 연동할 페이지를 적용할 수 있습니다.
[앱 실행화면 – 팝업 실행]
[움짤 이미지 확인하기]
팝업이 적용된 앱 실행화면입니다.
팝업 이미지는 슬라이드하여 팝업 다른 이미지도 확인할 수 있어요.
3. 세 번째 팝업 스타일
세번째 스타일은 위, 아래에 이미지가 등록되는 스타일입니다.
‘+’ 아이콘을 눌러서 이미지를 등록합니다.
이미지는 위, 아래 총 2장을 등록해야 합니다. 권장 해상도를 잘 지켜주세요.
[앱 실행화면 – 팝업 실행]
[움짤 이미지 확인하기]
팝업이 적용된 앱 실행화면입니다.
앱 실행화면처럼 위 아래에 이미지가 등록된 모습을 확인할 수 있습니다.
4. 네 번째 팝업 스타일
네번째 팝업 스타일은 이미지가 총 9장이 들어가는 스타일로 하단 이미지를 선택하면해당 이미지가 크게 보이는 스타일입니다.
다량의 이미지를 많이 추가해야 할 때 활용할 수 있는 팝업 스타일입니다.
‘+’ 아이콘을 눌러서 이미지를 등록합니다.
이미지는 9장 모두 등록해주셔야 합니다. 권장 해상도를 지켜주세요.
[앱 실행화면 – 팝업 실행]
[움짤 이미지 확인하기]
팝업이 적용된 앱 실행화면입니다.
9장의 이미지가 보이구요.
하나의 이미지를 선택하면 상단 – 메인헤더 부분에 해당 이미지로 보여지구요.
해당 이미지 선택시 연동해놓은 페이지로 이동합니다.
– 팝업을 중단하고 싶을 때는 팝업 관리 페이지 상단의 ‘팝업켜기’에 체크를 풀고 하단의 [변경사항 저장] 버튼을 선택해주시면 됩니다.
-팝업 이미지 수정 및 링크 수정도 가능합니다.