바로 앞에서 쿠팡의 제휴프로그램인 쿠팡파트너스와 네이버 블로그에 적용하는 방법을 포스팅했고 이어서 티스토리에 적용하는 방법을 알려드리겠습니다. 티스토리 플러그인으로 데이블, 카카오에드핏, 텐핑, 애드센스등이 있는데 파트너스는 따로 없지요, 그래서 각 게시글마다 HTML수정을 하시거나, 편집을 하면 되는데 이는 대부분의 웹사이트에서 적용되기에 말은 티스토리 이지만 블로그스팟, 워드프레스에서도 같은 방식이 적용됩니다. 물론 그정도 플렛폼을 다루실줄 안다면 이 글은 안봐도 되겠지요
티스토리도 네이버 블로그와 큰 틀에서는 동일합니다. 배너를 달거나 게시글에다가 링크를 거는 방법이지요
배너 또는 검색 위젯 달기
제 블로그에다가 쿠팡 배너와 검색 위젯을 간단하게 다는 방법을 보여드릴 겁니다. 그런데 어디까지나 예시이고, 이 블로그에만 적용되는 방식이기에 똑같은 방법으로 적용한다고 해도 잘 작동한다는 보장은 없습니다. (가끔씩 메일이나 덧글로 본인 블로그좀 봐달라고 오지만 모두 거절하고 있습니다. 이점 양해부탁드립니다.)
제블로그 카테고리를 살펴보시면 블로그 이야기/티스토리 집짓기 제가 블로그를 하면서 코드 수정한 예제를 올려두었는데 힌트가 될겁니다.
첫번째는 검색 위젯입니다.
쿠팡파트너스의 메인페이지에서 검색 위젯을 클릭해봅시다.
그러면 이렇게 검색 위젯 코드가 자동으로 발급이 됩니다. 몇가지 종류가 있으니 마음에 드는 것을 하나 선택하신 후에 어디에 넣을지 봅시다.
저는 메뉴에다가 구글 애드센스를 넣었는데, 가장 위에다가 쿠팡 검색 위젯을 넣어보겠습니다.
구글 크롬 기준 F12를 누르고 마우스를 가져다가 대면 해당하는 위치의 코드가 aside라는 id로 이루어 진것을 볼 수 있습니다.
그러면 대충 코드는 aside 아래에다가 적용하면 되겠구나 나오겠지요
이제는 하도 자주 봐서 설명안해도 되겠지요
티스토리 관리창 - 스킨 편집 - HTML 수정으로 들어가셔서
Ctrl + F를 누르신 다음 아까 봐두었던 aside를 검색하면 위 코드를 찾을 수가 있습니다.
그리고 바로 밑에다가 처음에 발급 받아둔 쿠팡 코드 위젯을 삽입하면
위젯이 정상적으로 나오는 것을 확인 할 수 있습니다.
모바일에서도 잘 작동하니 따로 만질것은 없네요
검색 위젯을 예시로 들었는데, 사실 배너도 똑같은 방법으로 적용하시면 되니 넘어가겠습니다.
아까 코드 발급 받으실때 src="https://coupa.ng/bBytvt" 라고 src 이후에 큰 따움표로 둘러쌓인 주소가 있습니다.
이게 제 아이디 고유주소이고 위 링크로 쿠팡을 접속하셔서 구매를 한다면 저에게 커미션이 간다는 거지요
해당 링크를 가지고 한가지만 더 해 봅시다.
블로그 관리 - 꾸미기 - 메뉴를 들어가신 다음에
해당 링크 주소를 가지고 만들면
대충 이렇게 어거지로 하나 쿠팡 링크가 생겼습니다.
상품 링크 걸기
네이버 블로그에서는 단순 링크 밖에 걸지 못했지만 티스토리는 HTML수정이 가능하기에 보다 다채롭고? 화려한 배너를 넣을 수가 있습니다. 방법은 간단합니다.
앞서 쿠팡파트너스에서 상품을 고르신다음 링크 생성을 눌러줍시다 (앞에서 쓴 네이버 블로그편을 참고해주시면 됩니다)
앞에서 네이버 블로그는 단순 링크만 걸 수 있었지만 티스토리는 HTML이 가능하기에 이미지도 같이 걸 수가 있는데, 일반태그 대신 블로그용 태그를 선택해줍시다.
이유는 코드를 비교해보시면 아시겠지만 alt가 있는데 이게 있어야 SEO(검색최적화)가 잘 이루어 집니다. 무슨 말인지 모르셔도 괜찮습니다. 어쨋든 좋은거니까요
그리고 해당 링크를 가지고 게시글을 작성하시다가
구에디터 HTML
신에디터 HTML
구 에디터의와 신에디터 모두 찾아보시면 상단에 HTML모드가 있습니다. 들어가셔서 원하는 곳에 붙여 넣기하시거나 본인이 HTML을 잘몰라서 뭐가 뭔지 모르고 어지럽다면 첫번째 줄에다가 붙여넣어시고 다시 체크를 해제하면 원상태로 돌아옵니다. 그리고 처음에 생성된 쿠팡링크를 드래그하고 잘라내기 하신다음에 원하는 곳에 붙여넣으셔도 무방합니다.
그러면 이렇게 실제 링크가 만들어 집니다. 여러분이 위 링크를 타고 구매를 하시면 실제로 저에게 적립이 되고요
그 다음에는 보다 길고 다채로운 링크를 살펴봅시다.
이름하여 다이나믹 배너, 정말 다이나믹하네요 ㅋㅋ...
기존의 링크나 배너는 한제품만 표시를 했지만 다이나믹 배너는 여러 제품을 한번에 보여줍니다.
배너 데이터는 쿠팡에서 제공해주는 맞춤형 데이터를 사용 하셔도 되고
아니면 상품 직접 선택을 누르신 다음에
본인이 직접 상품을 선정해서 담으실 수 있습니다.
주의 하실 점은 너비가 640인가 되어 있을 것인데 100%로 맞춰 줍시다.
반응형 웹을 위해서 입니다. 모바일 환경에서는 깨지기 때문에 이렇게 하시는 것을 추천합니다.
마찬가지로 이렇게 코드를 붙여 넣으신 다음에 다시 돌아와보시면 아무것도 없지만 실제로는 적용된 상태이니 걱정하지 않으셔도 됩니다.
위에 나오는 쿠팡 배너도 마찬가지로 실제로 작동하는 겁니다. 위 링크로 물건을 구매하시면 마찬가지로 저에게 커미션이 갑니다.
그런데 게시글을 쓸때마다 코드를 가져오고 붙여넣기 번거로우 시다면 서식이 있습니다.
서식은 위 게시글을 참고하시면 됩니다. (최신 에디터 기준이지만 구에디터도 가장 하단에 있습니다)
서식에다가 코드를 미리 붙여넣은 다음에 게시글을 쓰고 마지막에다가 서식을 불러오면 편하겠지요?
이렇게 간단하게 티스토리에서 쿠팡 파트너스를 적용하는 방법을 포스팅해보았습니다.
리뷰 쓰실거면 이런 쿠팡 링크 하나 붙여놓고 조회수도 얻고 수익도 얻으면 말그대로 1석2조이지요
다들 좋은 결과 있기를 바랍니다.
쿠팡 파트너스 주소와 추천인 ID는 다음과 같습니다.
추천인ID: AF1779492
추천인 ID를 입력하시면 추천을 하는 사람과 받는 사람에게 30일간 1%추가 적립이 있다고 합니다.
혹시 제 글을 보시고 쿠팡 파트너스 가입을 하신다면 부탁드립니다.