출처 : http://blog.naver.com/luvandfaith/220071766390
라인(Line)으로 모바일 페이지와 워드프레스 글 보내기 버튼(공유버튼) 붙이기
우리나라에서의 점유율은 '카카오톡(Kakao Talk)' 보다 낮지만,
일본을 중심으로 동남아, 중국등에서는 높은 점유율의 모바일 메신저
기존의 '페이스북(facebook, http://www.facebook.com)', '트위터(twitter,http://www.twitter.com)', '핀터레스트(Pinterest,http://www.pinterest.com)'와 같은 SNS(소셜네트워크서비스)에서 제공하고 있는 '공유 버튼(ShareButton)'을 라인에서도 제공하고 있는데 관련 설정 방법을 알아보겠습니다.
높은 점유율을 보이는 일본을 타겟으로 한 '일본어 버젼의 가이드 페이지(http://media.line.me/howto/ja/)'와 글로벌을 타겟으로 한 '영어 버젼의 가이드 페이지 http://media.line.me/howto/en/)'를 제공하고 있습니다.
일본어를 모르기 때문에 영어 버젼을 기준으로 이야기 해보겠습니다.
- Installation On Smartphone Websites
스마트폰에서 보이는 페이지 즉, 모바일 페이지에 공유버튼을 붙이고자 할 때 설정하는 부분입니다.
1. Select Button Type
공유 버튼의 타입(디자인)을 선택하는 부분입니다. 마음에 드는 것을 선택하세요.
2. Slelct text to be shared
공유 버튼을 클릭 혹은 터치했을 때 어떤 내용을 보여줄 것인가를 설정하는 부분입니다.
: Use the page title and URL
페이지 마다 설정하는 타이틀과 페이지 주소(URL)을 공유한다는 설정입니다.
여기서 타이틀은 <title>~</title> 부분에 입력한 내용을 말합니다.
: Custom
페이지의 설정과 상관 없이 고정 텍스트를 설정할 수 있습니다.
3. Check preview and copy code
설정된 내용을 바탕으로 스크립트가 생성되며, 생성된 스크립트를 공유버튼을 붙이고 싶은 페이지 위치에 붙여넣기 하면 됩니다.
- Technical Specifications
웹사이트, 워드프레스로 만들어진 사이트에 라인 공유 버튼을 공유하고자 할 때 설정하는 부분입니다.
Format 1과 Format 2는 특별히 설명이 필요하지 않으며, 참고만 하면 되는 항목이기 때문에 넘어 가겠습니다.
우리가 설정할 부분은 3. Example과 4. Design 입니다.
3. Example
For Website
: 쇼핑몰, 홈페이지와 같이 일반적인 사이트에서 라인 공유 버튼을 붙이고자 할 때 붙여넣기 할 HTML 코드입니다.
For WordPress templates
: 워드프레스로 만들어진 사이트에서 라인 공유 버튼을 붙이고 할 때 붙여넣기 할 HTML 코드입니다.
[URL of Button image]는 라인 공유 버튼 아이콘의 위치를 넣으면 됩니다.
[width of Button], [height of Button] 라인 공유 버튼 아이콘의 가로와 세로의 크기를 지정해 주면 됩니다.
한가지 팁을 alt="LINE it!" 부분을 수정할 수 있는데, "LINE it!" 대신에 "http://www.youonbiz.com LINE it!"을 넣거나
혹은 마케팅 차원에서 키워드를 넣는 방법도 좋습니다. 예를 들어, "SEO전문가 김대중의 글을 LINE it!" 처럼 활용하는 것도 좋은 방법으로 생각됩니다.
4. Design
라인 공유 버튼 아이콘 디자인을 다운로드 해서 쓸 수 있습니다.
참고할 점은 파일을 '다른 이름으로 저장하기'이 아니라 "Download Button Images"를 클릭해서 압축 파일을 다운로드 받은 후에 압축을 풀어서 사용해야 합니다.
'워드프레스(wordpress)'에 적용해 보면,
먼저, '미디어 추가'에서 라인공유버튼 아이콘을 업로드 한 후에,
'외모 > 편집기'에서 페이지, 글을 보여주는 파일을 선택한 후에 원하는 위치에 HTML 코드를 붙여넣기 하면 됩니다.
이미지에서 1번은 '라인 버튼' HTML코드를 붙여넣은 부분이고, 2번은 페이지 내용을 보여주는 파일을 선택한 것입니다.
