스윙투앱 매뉴얼

HTML에디터 페이지 제작방법

HTML 에디터페이지란?

스윙 앱운영페이지의 사용자페이지에서 제공하는 기능 중 하나로 사용자가 직접 웹페이지를 제작할 수 있는 메뉴에요.

블로그나 카페에 포스팅을 입력하듯이 글과 이미지를 자유롭게 배치하여 제작할 수 있구요.

웹링크, 동영상, 텍스트 효과 등을 다양하게 적용할 수 있어요.

사용자가 원하는 스타일대로 자유롭게 만들 수 있는 점이 가장 큰 특징입니다.

 

▶ HTML 에디터페이지 제작방법은 영상으로도 배울 수 있어요!


 

STEP.1 HTML 에디터 페이지 제작 방법

1. HTML에디터 페이지 추가/관리 선택

앱제작 페이지에서 – 페이지 메뉴 단계로 이동해주세요.

1)홈화면 선택

2)[사용자페이지] 선택

3)[불러오기] 버튼 선택 4) HTML에디터 페이지 추가/ 관리 를 선택해주세요.

.
2. 에디터 페이지 제작화면

HTML 에디터페이지 추가/관리를 선택하면 위의 이미지처럼 제작도구 사이트가 열립니다.

HTML 에디터페이지는 스윙에서 제공하는 게시물 작성- 에디터 글쓰기와 스타일이 동일합니다.

게시물 작성방법과 동일하니 어렵지 않게 사용하실 수 있습니다!

에디터페이지 제작도구 사이트에서 사용자가 원하는 스타일로 작업이 가능합니다.

이미지를 첨부 및 동영상, 움짤 이미지 등의 첨부가 모두 가능합니다.

그리고 텍스트 꾸미기가 가능하기 때문에 글씨폰트, 색상 등의 옵션을 지정할 수 있구요. 

상단에 제작도구 옵션bar 메뉴를 통해서 다양한 스타일을 적용할 수 있습니다.

 

에디터페이지 제작이 완료되면 저장 버튼을 누르고 나옵니다. 

*페이지 이름이 앱 실행화면에서 화면 제목으로 표시됩니다.


.
.

STEP.2 에디터 페이지 앱에 적용하기

에디터페이지 제작이 완료되면 다시 앱제작 페이지- 페이지메뉴 단계로 와주시구요.

*’홈화면’에 에디터페이지를 넣으신다면, 메인메뉴에 ‘홈화면’을 선택하구요.

메뉴에 페이지를 넣으신다면, [추가] 버튼을 눌러서 메뉴를 새로 추가한 뒤 선택해주시면 됩니다.

여기서는 홈화면에 에디터 페이지를 넣어 볼게요!!

1)홈화면 선택

2)[사용자페이지] 선택 한 뒤 3)[불러오기] 버튼 선택하시면

4) 사용페이지 창에서 새로 추가된 에디터 페이지를 선택한 뒤 ‘적용’ 버튼을 선택해주세요.

(추가된 에디터페이지가 보이지 않으면 새로고침 한 번 해주세요!)

5) 하단 [적용]버튼 선택 후,  상단 [저장]버튼을 누르면 완료됩니다.

 

앱 가상머신을 통해서 반영된 에디터페이지를 확인할 수 있어요.

동영상은 재생이 잘 되는지 확인하고, 웹링크 항목은 링크를 선택하면 연동된 웹페이지로 이동하는지 확인해주세요.

밑에서 에디터페이지를 적용한 활용예시를 소개해드릴테니 확인해주세요 ^^


 

STEP.3 에디터 페이지 앱적용 화면

1. 웹페이지 스타일

한 장의 큰 이미지를 넣어서 웹페이지 스타일로도 제작할 수 있어요.

홍보용 이미지를 제작하여 이미지를 등록하여, 웹링크(사이트 URL)을 적용해서 이미지 선택시 연동해놓은 사이트로 이동하게끔 설정할 수 있어요.

 

2. 블로그 스타일 

블로그 스타일처럼 글과 이미지를 자유롭게 배치하여 작업할 수 있어요.

텍스트를 입력하고 이미지를 등록하여서 제작이 가능합니다.

 

동영상 등록도 가능합니다.

 

▶ 움짤로 에디터페이지 적용화면 확인하기

 


[에디터 페이지 제작 특이사항]

에디터페이지는 사용자가 원하는 스타일대로 만들 수 있어요.

1)이미지를 넣어서 이미지페이지처럼 제작할 수도 있구요.

2)블로그 포스팅을 작성하는 것처럼 글과 이미지를 자유롭게 배치하고, 동영상이나 웹링크 이동을 적용할 수 있습니다. 

따라서 미리 어떻게 제작을 해야 하겠다 구상을 한 뒤 해당 메뉴를 이용해주시기 바랍니다.