랜딩페이지가 무엇인지는 아시는 분들이 이 포스팅을 보러 오셨을 것 같아 따로 설명은 필요없을 듯 한데요. 그래도 살짝 궁금하신 분들은 랜딩페이지의 용도에 대해 언급되어 있는 아래 이전 포스팅을 참고하시기 바랍니다. 랜딩페이지에 대한 좀더 상세하고 구체적인 내용들은 곧 다시 포스팅하도록 하겠습니다.
제휴마케팅에는 어떤 카피라이팅이 먹힐까
인터넷마케팅, 제휴마케팅, 바이럴마케팅의 고급과정으로 넘어가면서 가장 중요하게 부각되는 것이 랜딩페이지라고 할 수 있을텐데요. 랜딩페이지만큼 만들기 어렵고... 중요한게 없다고는 이�
crash55.tistory.com
랜딩페이지를 만드는 방법에는 다양한 방법이 있다고들 이야기합니다.
가장 먼저 알게된 것이 https://www.launchaco.com/ 사이트인데요.
이 사이트의 경우는 앱설치형 머쳔트, 캠페인을 만드는데 적합하더군요.
제가 만들고 싶은 랜딩페이지에는 적합하지 않았습니다.
WordPress, 도메인호스팅, NAS에 웹서비스설치 등을 생각해보았지만, 별도로 비용이 지출되는데다가
이미 티스토리 블로그를 많이 사용한다는 이야기를 들었던 터라... 연구를 하기 시작했습니다.
제일 먼저 검색해서 나온 랜딩페이지용 스킨을 적용해보니까 예쁘긴 했는데요.
게시물 단위에서 랜딩페이지를 표현한다기 보다는, 홈 화면 단위로 적용하는 방식이더군요. 이렇게 되면 랜딩페이지를 하나 만들때마다 거의 블로그를 하나 개설해야하는 수준이네요.
게다가 페이지를 좌우로 넘기는 방식이라 이또한 제가 원하는 방식이 아니었습니다.
제가 추구하는 랜딩페이지의 디자인은 다음과 같았습니다.
1. 한 페이지만 존재하며, 간단한 메인 이미지 한두개와 텍스트로 앱설치를 유도한다.
2. 여러 페이지 넘기는 카드뉴스 방식은 오히려 고객을 이탈하게 한다.
3. 스크롤바가 있을 수는 있지만, 가급적 없는 것이 좋다.
4. 참여형 머쳔트의 입력 양식이 있는 경우 삽입할 수 있어야 한다.
5. 모바일에서도 예쁘게 나오는 반응형 페이지여야 한다.
이러한 관점에서 검색을 시작했고, 방법을 찾았습니다.
프로필 사진을 클릭하고 계정관리 화면으로 이동합니다.
새 블로그 만들기를 클릭합니다.
물론 기존 블로그에서 진행하셔도 문제는 없을테지만, 스킨을 통째로 바꿔야 하는 문제라서 랜딩페이지용 전용 블로그를 개설하는 것이 좋습니다. 아니 당연히 그렇게 해야 합니다.
티스토리, 다음, 카카오의 입장에서 생각할 때, 이 블로그는 랜딩페이지만 가득한... 광고 사이트로 이동하는 링크만 가득한 블로그일 수 밖에 없어서 오래가지 않아 저품질이 될 확률이 높기 때문입니다.
그래서 지난번에 아예 저품질, 다음 통누락이 블로그가 있으면 이전 글들을 삭제하거나 폐쇄하지 마시고 랜딩페이지용 블로그로 이용하시라고 포스팅한 바 있으니까, 관심있으신 분들을 읽어보시기 바랍니다.
티스토리 저품질, 다음 통누락 블로그의 활용법
얼마전에 네이버 블로그와 티스토리 블로그는 몇개까지 운영할 수 있을까 라는 내용의 포스팅을 한 적이 있었는데요. 네이버 티스토리 블로그 몇개까지 운영할 수 있을까? 수익형 블로그를 하��
crash55.tistory.com
그럼 이제 새 블로그를 만드셨으면 설정페이지로 들어가야겠지요?
딱히 상관은 없는 부분이긴 합니다만, 글을 작성할 때 기본값이 비공개로 되어 있으면 피곤한 관계로 공개로 바꿔주고 저장합니다.
이제 스킨을 변경해 줍니다.
스킨은 조금만 내리면 나오는 기본 스킨 중에 #1을 선택해줍니다. 반응형 스킨이죠.
그 다음 과정은 사이드바를 모두 제거해줍니다.
사이드바가 나올 필요가 없을테니까요.
자 이제 가장 중요한 작업인데요. 스킨 편집으로 가서 html편집을 해줍니다.
<head></head> 부분은 그냥 두셔도 되는데요.
<body></body> 부분은 모두 주석처리한다고 생각하시면 될 듯 합니다.
주석처리는 <!-- ~~~~ --> 태그로 처리해주시면 되는데요.
<div class="area_view">
이 부분은 주석처리가 되지 않도록, 적당히 막아주어야 합니다.
이 부분이 바로 본문 내용이 표시되는 부분인데요. 라인이 좀 흐트러졌을 것 같으니.. 찾기로 <div class="area_view">를 찾으시기 바랍니다. 주석처리가 약간 좀 귀찮을 수 있는데 스킨자체에 중간중간 주석처리된 부분들이 있어서 그렇더군요.
<body id="tt-body-page"> 랜딩페이지가 무엇인지는 아시는 분들이 이 포스팅을 보러 오셨을 것 같아 따로 설명은 필요없을 듯 한데요. 그래도 살짝 궁금하신 분들은 랜딩페이지의 용도에 대해 언급되어 있는 아래 이전 포스팅을 참고하시기 바랍니다. 랜딩페이지에 대한 좀더 상세하고 구체적인 내용들은 곧 다시 포스팅하도록 하겠습니다. 제휴마케팅에는 어떤 카피라이팅이 먹힐까 인터넷마케팅, 제휴마케팅, 바이럴마케팅의 고급과정으로 넘어가면서 가장 중요하게 부각되는 것이 랜딩페이지라고 할 수 있을텐데요. 랜딩페이지만큼 만들기 어렵고... 중요한게 없다고는 이� crash55.tistory.com 랜딩페이지를 만드는 방법에는 다양한 방법이 있다고들 이야기합니다. 가장 먼저 알게된 것이 https://www.launchaco.com/ 사이트인데요. 이 사이트의 경우는 앱설치형 머쳔트, 캠페인을 만드는데 적합하더군요. 제가 만들고 싶은 랜딩페이지에는 적합하지 않았습니다. WordPress, 도메인호스팅, NAS에 웹서비스설치 등을 생각해보았지만, 별도로 비용이 지출되는데다가 이미 티스토리 블로그를 많이 사용한다는 이야기를 들었던 터라... 연구를 하기 시작했습니다. 제일 먼저 검색해서 나온 랜딩페이지용 스킨을 적용해보니까 예쁘긴 했는데요. 게시물 단위에서 랜딩페이지를 표현한다기 보다는, 홈 화면 단위로 적용하는 방식이더군요. 이렇게 되면 랜딩페이지를 하나 만들때마다 거의 블로그를 하나 개설해야하는 수준이네요. 게다가 페이지를 좌우로 넘기는 방식이라 이또한 제가 원하는 방식이 아니었습니다. 제가 추구하는 랜딩페이지의 디자인은 다음과 같았습니다. 1. 한 페이지만 존재하며, 간단한 메인 이미지 한두개와 텍스트로 앱설치를 유도한다. 2. 여러 페이지 넘기는 카드뉴스 방식은 오히려 고객을 이탈하게 한다. 3. 스크롤바가 있을 수는 있지만, 가급적 없는 것이 좋다. 4. 참여형 머쳔트의 입력 양식이 있는 경우 삽입할 수 있어야 한다. 5. 모바일에서도 예쁘게 나오는 반응형 페이지여야 한다. 이러한 관점에서 검색을 시작했고, 방법을 찾았습니다. 프로필 사진을 클릭하고 계정관리 화면으로 이동합니다. 새 블로그 만들기를 클릭합니다. 물론 기존 블로그에서 진행하셔도 문제는 없을테지만, 스킨을 통째로 바꿔야 하는 문제라서 랜딩페이지용 전용 블로그를 개설하는 것이 좋습니다. 아니 당연히 그렇게 해야 합니다. 티스토리, 다음, 카카오의 입장에서 생각할 때, 이 블로그는 랜딩페이지만 가득한... 광고 사이트로 이동하는 링크만 가득한 블로그일 수 밖에 없어서 오래가지 않아 저품질이 될 확률이 높기 때문입니다. 그래서 지난번에 아예 저품질, 다음 통누락이 블로그가 있으면 이전 글들을 삭제하거나 폐쇄하지 마시고 랜딩페이지용 블로그로 이용하시라고 포스팅한 바 있으니까, 관심있으신 분들을 읽어보시기 바랍니다. 티스토리 저품질, 다음 통누락 블로그의 활용법 얼마전에 네이버 블로그와 티스토리 블로그는 몇개까지 운영할 수 있을까 라는 내용의 포스팅을 한 적이 있었는데요. 네이버 티스토리 블로그 몇개까지 운영할 수 있을까? 수익형 블로그를 하�� crash55.tistory.com 그럼 이제 새 블로그를 만드셨으면 설정페이지로 들어가야겠지요? 딱히 상관은 없는 부분이긴 합니다만, 글을 작성할 때 기본값이 비공개로 되어 있으면 피곤한 관계로 공개로 바꿔주고 저장합니다. 이제 스킨을 변경해 줍니다. 스킨은 조금만 내리면 나오는 기본 스킨 중에 #1을 선택해줍니다. 반응형 스킨이죠. 그 다음 과정은 사이드바를 모두 제거해줍니다. 사이드바가 나올 필요가 없을테니까요. 자 이제 가장 중요한 작업인데요. 스킨 편집으로 가서 html편집을 해줍니다. <head></head> 부분은 그냥 두셔도 되는데요. <body></body> 부분은 모두 주석처리한다고 생각하시면 될 듯 합니다. 주석처리는 <!-- ~~~~ --> 태그로 처리해주시면 되는데요. <div class="area_view"> 이 부분은 주석처리가 되지 않도록, 적당히 막아주어야 합니다. 이 부분이 바로 본문 내용이 표시되는 부분인데요. 라인이 좀 흐트러졌을 것 같으니.. 찾기로 <div class="area_view">를 찾으시기 바랍니다. 주석처리가 약간 좀 귀찮을 수 있는데 스킨자체에 중간중간 주석처리된 부분들이 있어서 그렇더군요. <body id="tt-body-page"> 사실 body부분은 이렇게만 있어도 되겠습니다. 여기까지 해보고 저장, 적용을 해보시면 어떻게 표시되는지 확인해보시기 바랍니다. 깔끔하게 거의 다 진행이 된 것 같은데, 아랫쪽에 공감, 공유, 통계 등의 버튼이 여전히 남아있네요. 이걸 안나오게 하는 방법은 스킨편집의 CSS 편집에서 하시면 되는데요. CSS의 가장 마지막 부분에 위 코드를 추가하고 적용해주시면 됩니다. 그럼 이제 완성된 페이지를 보시죠. 1 청담동 말자싸롱 beer crash-2.tistory.com 클릭해보시면 깔끔한 한페이지짜리 랜딩페이지가 완성되었습니다. 포토샵이나 미리캔서브 등으로 간편하게 이미지 작업만 하면 될 것 같습니다. 궁금하거나 추가할 사항, 요청하실 내용이 있으시면 댓글로 남겨주세요~ PS. 샘플랜딩페이지가 PC에서는 잘 작동을 하는데.. 모바일에서는 깔끔하지가 않은 것을 확인했습니다. 이 부분에 대한 해결책을 찾았는데요. 블로그의 관리 화면으로 가셔서 꾸미기 - 모바일로 이동합니다. 티스토리 모바일웹 자동 연결을 사용하지 않습니다. 로 설정하시면 됩니다. 어떤 차이가 있느냐면... 스마트폰의 브라우저로 보면 PC화면과 동일한 깔끔한 화면으로 나오는걸 보실 수 있는데요. 티스토리 블로그 앱에서 볼 때만 타이틀이 나오더군요. 모바일앱 자동연결에서 나오는 문제인 것 같아서 이렇게 해결했습니다.
<div class="area_view">
<div class="area_view">
</div>
</body>
</div>
</body>
사실 body부분은 이렇게만 있어도 되겠습니다.
여기까지 해보고 저장, 적용을 해보시면 어떻게 표시되는지 확인해보시기 바랍니다.
깔끔하게 거의 다 진행이 된 것 같은데,
아랫쪽에 공감, 공유, 통계 등의 버튼이 여전히 남아있네요.
이걸 안나오게 하는 방법은
스킨편집의 CSS 편집에서 하시면 되는데요.
CSS의 가장 마지막 부분에
위 코드를 추가하고 적용해주시면 됩니다.
그럼 이제 완성된 페이지를 보시죠.
1
청담동 말자싸롱 beer
crash-2.tistory.com
클릭해보시면 깔끔한 한페이지짜리 랜딩페이지가 완성되었습니다.
포토샵이나 미리캔서브 등으로 간편하게 이미지 작업만 하면 될 것 같습니다.
궁금하거나 추가할 사항, 요청하실 내용이 있으시면 댓글로 남겨주세요~
PS. 샘플랜딩페이지가 PC에서는 잘 작동을 하는데.. 모바일에서는 깔끔하지가 않은 것을 확인했습니다.
이 부분에 대한 해결책을 찾았는데요. 블로그의 관리 화면으로 가셔서 꾸미기 - 모바일로 이동합니다.
티스토리 모바일웹 자동 연결을 사용하지 않습니다. 로 설정하시면 됩니다.
어떤 차이가 있느냐면... 스마트폰의 브라우저로 보면 PC화면과 동일한 깔끔한 화면으로 나오는걸 보실 수 있는데요.
티스토리 블로그 앱에서 볼 때만 타이틀이 나오더군요. 모바일앱 자동연결에서 나오는 문제인 것 같아서 이렇게 해결했습니다.
'Knowhow > Marketing' 카테고리의 다른 글
| 페이스북 광고 마켓팅에 효과적으로 사용되는 포워딩과 랜딩페이지 작성방법 (4) | 2020.08.14 |
|---|---|
| 텐핑,애드픽 URL 주소 부적절 판정으로 페이스북에 광고를 못하면...? (0) | 2020.08.08 |
| 제휴마케팅에는 어떤 카피라이팅이 먹힐까 (0) | 2020.08.03 |
| 바이럴마케팅의 정의와 효과적인 진행방법 (0) | 2020.07.24 |
| 애드픽 노하우 #1 다양한 SNS 채널을 활용하자 (페이스북, 블로그 편) (2) | 2020.07.23 |
