본문 바로가기

Programming/etc

facebook : page tab (welcome tab) 개발시에 유용한 무료툴

미흡한 영어실력으로 며칠동안 구글링을 하면서 알게된 자료를 공유할까 합니다^^;
뭐 미리 여러번 국내에 소개되었다면 뒷북이네요 ㅎㅎ

우선 welcome tab이라 하는 것은 페이스북 페이지에 접근하였을때 가장 우선적으로 보여줄 메뉴(?)를 말합니다.
아래 그림에 나열되어있는 메뉴들을 보시면 이해가 쉬울 것 같네요.


Welcome 메뉴들은 저의 test 페이지에 설치되어있는 app들입니다.
이러한 앱들을 사용하면 무척 편리하게 페이스북 페이지들을 꾸밀 수가 있습니다.
페이스북 페이지 이용에 있어 핵심적 이유 몇가지중 하나는 아무래도 라이크를 통한 노출증대가 있지 않을까 싶은데요,
사용자들의 해당 페이지 라이크버튼의 클릭 유무에 따라서 사용자에게 다른 페이지를 보여준다는 것은
무척 의미있는 action 이라고 생각합니다.
때문인지 여러 앱들 모두 핵심기능은 바로 라이크와 언라이크에 따른 다른 뷰를 보여준다는 것입니다.
 

그럼 대표적인 app 2개를 소개해드리겠습니다.
(제가 여러가지를 설치해보고 실험해보았으나 단순하면서도 매우 강력한 app은 2개로 추려지더군요.)
우선 외부 자원이 전혀 필요하지 않으며, 또한 사용할 필요가 없는 wildfire 의 iFrame
그리고 외부 자원에 접근하는데에 있어서 전혀 제한이 없는 static HTML의 iFrame tabs 입니다.

두 app 모두 접근은 무척 쉽습니다. 요구조건은 어떤 page를 위한 app이라면 마찬가지이겠는데요,
반드시 페이스북에 가입이 되어있고 page를 1개 이상 개설을 해놔야합니다^^;
링크 모두 클릭하면 인스톨 버튼이 눈에 우선 띄게 되실 것입니다.
그럼 인스톨 버튼을 클릭하셔서 해당 페이지에 대한 접근을 수락하시면 본인의 페이지로 가게 됩니다.
여기까지 이미지 연상을 하시면서 이해하셨으리라 보구요;;;

해당 페이지의 설치된 tab을 클릭하시면 (위의 그림처럼 Welcome 이라는 메뉴가 생겼을 것입니다.)
wildfire 에서는 setting할 수 있는 버튼이 메인의 상단부분에, static HTML 은 바로 수정페이지가 보이게 됩니다.
wildfire의 setting 할 수 있는 버튼은 너무나 쉽게 눈에 띄므로 패스하고 바로 설정화면을 보겠습니다.

바로 위의 화면이 wildfire 의 iFrame을 설치하고 탭을 클릭한 후에, setting 버튼을 클릭하였을 때 보게되는 화면입니다.
Fan Gate는 like 버튼을 클릭한 사용자와 아닌 사용자에 대한 구분을 하겠냐는 의미이며 On 을 선택할 경우
보시는 화면 그대로 보이게 됩니다.
영어문구 그대로 이해하시면 됩니다.
Fans view는 like를 클릭한 사람에게 보여질 화면을 말하는 것이며
Non-Fans view는 like를 클릭하지 않은 사람에게 보여질 화면을 말하는 것입니다.
어떤 view이든 같은 선택사항이 제공됩니다. Custom Image, Custom Html 이 그것입니다.
그냥 툭 얘기하자면... wildfire 에서는 HTML 에 대한 제한사항이 너무나도 많습니다.
각 HTML tag의 거의 모든 attribute가 막혀있습니다. (즉 외부자원에 접근하기가 불가능하다고 보면 되겠습니다.)
물론, javascript도 막혀있습니다 .. ^^;
하지만 무척 편리한 것은 Custom Image 에서 파일선택 을 통한 이미지를 선택할 경우
Wildfire 측에서 웹서버를 제공하는 것인지 무료로 해당 이미지사용이 가능합니다.
제가 찾아보았던 거의 모든 app들은 이미지를 업로드 하기 위해서는 외부자원에 업로드한 후,
해당 이미지의 url 경로를 입력해주어야 했거든요.
만약 웰컴탭을 이미지만으로 사용자들에게 접근하려한다면 Wildfire 는 무척 편리하겠습니다.

그럼 두번째의 Static HTML 의 iFrame에 대해서 볼까요?
static HTML 을 접근하기 이전엔 FanBuilder 라는 app을 먼저 보았었습니다. 이 app 역시도 편리하고 좋았지만
like 를 통한 fan 수가 25,000명이 달하게 될 경우 유료사용을 해야하는 라이센스(?)가 있더군요.
그래서 대안으로 검색해서 찾아낸 것이 Static HTML 입니다.

static HTML 의 특징은 만약 페이지 관리자가 로그인을 하여 페이지의 탭을 보게된다면
위의 화면을 보게 됩니다. 즉, 관리자가 아닌 사용자가 어떤 화면을 보게 될지는 못보게 되는 것이죠.
물론 큰 제한사항이 아닌것이... 우리 모두는 2개이상씩 email을 가지고 있지 않나요? ㅎㅎ;;
새로 가입하여 확인해보면 된다는 뜻입니다. ^^;
위 화면에서 보시면 바로 알 수 있듯이 위의 textarea는 like버튼을 클릭하지 않은 유저를 위한,
아래는 like 버튼을 클릭한 유저들을 위한 textarea입니다.(옵션)
위의 그림에서 보면 HTML, CSS, JavaScript 를 적용할 수 있는 것을 알 수 있습니다.
그리고 아래의 옵션 textarea에는 제가 버튼태그를 삽입하고 onClick 메소드호출을 하기도 하였으며
또한 iframe 태그를 통해 외부 자원을 담기까지 하였습니다.
마지막엔 javascript를 명시하여 작성하고는 alert 을 통한 간단한 안내 알림창까지도 띄어보았습니다.
모두 적용이 가능하며 save changes를 클릭하면 적용이 됩니다.

이상 facebook pages의 웰컴탭 지원 app 2가지를 살펴보았습니다.
다른 좋은 기능의 app들도 많지만 제가 생각하였을 때 목적에 가장 충실한 페이지를 만드는데 도와주는 것은
위의 app 2가지라는 판단이 서네요~

아무쪼록 페이스북 페이지를 만드는 데에 있어서 도움이 되었으면 좋겠습니다!!!