2015. 7. 18. 09:01ㆍ블로그/블로그 디자인
내 블로그에 작성한 글을 방문자가 페이스북, 트위터, 구글+ 등 SNS 서비스로 공유할 수 있는 서비스를 보통 소셜공유위젯이라고 부른다. 티스토리 블로거들은 AddThis를 많이 사용하며 나도 AddThis의 What's Next 기능을 사용하고 있다. What's Next는 본문을 읽다가 아래로 내려오면 블로그 내의 다른 글을 추천해주는 기능이다.
기능의 다양성면에서 보면 AddThis가 우세하지만 Flare를 추천하는 이유는 카운터 기능 때문이다. 내 블로그 글이 페이스북, 트위터에서 몇회나 공유됐는지 보여준다. AddThis는 카운터가 포함된 위젯을 사용하려면 비용을 지불해야 한다. 네모난 모양 말고 동그란 모양의 소셜 위젯을 설치할 수 있는 점도 Flare만의 강점이다.
Flare http://filament.io/flare
우측의 메뉴(Menu) 버튼을 눌러 나타난 SIGN UP 글자를 클릭하자.
FLARE의 LAUNCH 버튼을 클릭한다.
빈칸에 블로그 주소(URL)를 입력하고 NEXT 버튼을 클릭한다.
간단한 이용 설명문구가 나온다. 무시하고 Okay, let's go! 버튼을 누른다.
HTML 코드가 생성됐다. 1번의 코드를 복사(컨트롤 키+C 키)한다. 이 화면은 닫지 말고 그대로 두자.
티스토리 관라지 화면 - HTML/CSS - skin.html 편집창에서 /head를 검색하고 그 바로 앞에 전 단계에서 복사한 코드를 붙여넣는다.(1) 컨트롤 키 + V 키를 누르면 쉽다. 저장(2) 버튼을 클릭하자.
2번째 전단계 화면으로 돌아가 2번 항목의 Test your connection을 누르면 웹사이트에 코드가 제대로 삽입됐는지 확인해준다. 아래 화면을 보면 녹색 동그라미 옆에 Connected 라고 나왔는데 이렇게 나오면 정상적으로 확인됐다는 걸 의미한다. Done 버튼을 클릭한다.
화면 왼쪽으로 노란색 상자가 하나 보인다. 마우스를 올리면 Edit 버튼이 표시되는데 이 부분을 클릭하자.
어떤 버튼을 넣고 위치는 어떻게 할 지 여기서 변경할 수 있다. 나는 페이스북, 트위터, 구글 플러스, 이메일을 골랐다. 보라색 필라멘트는 FLARE 제작사의 이름인데 유료 결제를 하지 않는 한 이 버튼은 삭제할 수 없다. OMG!
좀 더 밑으로 내려오면 아이콘 크기, 버튼의 원형도(동그랗게 할 것인지 네모나게 할 것인지) 등의 세부옵션을 설정할 수 있다. 설정을 마치면 우측의 SAVE SETTING 버튼을 눌러 설정을 저장한다.
왼쪽의 노란 버튼을 마우스를 드래그한 다음 오른쪽 블로그 미리화면에 올려놓자.
FLARE 위젯의 3가지 노출옵션이 나타난다. 특정 페이지에서는 안 보이게 하려면 두번째 ONLY SOME PAGES를 클릭하자.
필터를 추가하는 화면이 나온다. URL - does not contain - OOO 순으로 입력하면 된다. 나는 공지 화면, 전체글보기 화면, 방명록 화면에 FLARE 위젯이 보이지 않도록 설정했다. 설정을 마치면 DONE 버튼을 누르고 보라색 PUBLISH 버튼을 클릭한다.
2분 정도 지나 블로그에 가보면 FLARE 반영된 모습을 확인할 수 있다. 아이콘 위에 마우스를 올리면 특정 SNS에서 몇회 공유됐는지도 확인할 수 있다.
