티스토리 공감버튼 이동시키기

요즘 너무 바빠서 블로그에 거의 신경을 못쓰고 있는데, 카톡이었던것 같은데 공감버튼 위치를 수정할 수 없냐고 물어보셔서 급하게 포스팅을 해봅니다. 사실 이러한 기법등은 간단한 스크립트등으로 충분히 할 수 있는 부분이라 어렵지는 않은데요. jQuery라는 스크립트언어와 Css 만 조금만 아시면 간단하게 적용해 보실 수 있습니다. 다만, 티스토리 공감버튼의 경우 인위적인 위치변경은 추천해 드리고 싶지 않은데요.

 

공감이라는 특수한 환경때문에 조작의 부작용이 있어서 권장해드리지는 않습니다. 비슷한 이유로 티스토리측에 문의를 했던것 같은데 오래되어서 가물가물합니다. 구조를 바꾸는것은 안된다 이런 답변이었던것 같아요. 이게 구조 바꾸는것은 아닌데 알송달송하네요.

 

참고해보시고 적용은 알아서 판단해보세요.

 

 

 

 

2017/10/26 - [블로그/운영노하우] - 구글 상위노출을 위한 모바일 친화성 테스트

2017/10/25 - [블로그/수익노하우] - 애드센스 입금 안됨 어떻게 해결할까?

2017/10/11 - [블로그/수익노하우] - 애드센스 모바일 상단 확인해보세요

2017/10/10 - [블로그/꾸미기노하우] - 티스토리 스킨 상단 버튼 없애기(by fastboot)

2017/09/26 - [블로그/수익노하우] - 애드센스 사이트확인 하셨나요?

 

티스토리 공감버튼 이동방법 안내

충분히 간단합니다. 스킨에디터에서 본문내용 위치를 찾아주세요.

요즘 너무 바빠서 블로그에 거의 신경을 못쓰고 있는데, 카톡이었던것 같은데 공감버튼 위치를 수정할 수 없냐고 물어보셔서 급하게 포스팅을 해봅니다. 사실 이러한 기법등은 간단한 스크립트등으로 충분히 할 수 있는 부분이라 어렵지는 않은데요. jQuery라는 스크립트언어와 Css 만 조금만 아시면 간단하게 적용해 보실 수 있습니다. 다만, 티스토리 공감버튼의 경우 인위적인 위치변경은 추천해 드리고 싶지 않은데요.

 

공감이라는 특수한 환경때문에 조작의 부작용이 있어서 권장해드리지는 않습니다. 비슷한 이유로 티스토리측에 문의를 했던것 같은데 오래되어서 가물가물합니다. 구조를 바꾸는것은 안된다 이런 답변이었던것 같아요. 이게 구조 바꾸는것은 아닌데 알송달송하네요.

 

참고해보시고 적용은 알아서 판단해보세요.

 

 

 

 

2017/10/26 - [블로그/운영노하우] - 구글 상위노출을 위한 모바일 친화성 테스트

2017/10/25 - [블로그/수익노하우] - 애드센스 입금 안됨 어떻게 해결할까?

2017/10/11 - [블로그/수익노하우] - 애드센스 모바일 상단 확인해보세요

2017/10/10 - [블로그/꾸미기노하우] - 티스토리 스킨 상단 버튼 없애기(by fastboot)

2017/09/26 - [블로그/수익노하우] - 애드센스 사이트확인 하셨나요?

 

티스토리 공감버튼 이동방법 안내

충분히 간단합니다. 스킨에디터에서 본문내용 위치를 찾아주세요. 라는 치환자로 구성되어 있습니다. 이부분이 티스토리 본문을 생성해주는 역활을 합니다. 티스토리 본문은 지금 보시는 화면에서 제가 작성한 글까지가 본문이 되며, 공감버튼은 꼭 본문의 마지막에 들어가기 때문에 애드센스 코드를 본문밑에 넣어주시면 항상 애드센스 위에 공감 버튼이 위치해 있게 됩니다.

 

이러한 부분을 극복하기 위해서는 한가지 꽁수가 필요한데요. 바로 공감 버튼을 이동 시켜버리는 됩니다.

 

이동을 위해서는 jQuery코드에 대해서 조금은 알아 두시면 좋은데요. 본문의 내용이 전부 로드되고 나면 jQuery를 이용해서 로드된 공감버튼의 위치를 애드센스 코드로 내려주기 위해서 이동될 위치를 지정을 해주셔야 합니다.

 

즉, 본문 아래에 위치해 있는 애드센스나 원하시는 위치에 특정 코드를 삽입해두고 본문이 전체 로드된 뒤 공감 버튼을 옮겨주게 되는 것이죠.

 

 

 

포스팅을 위해서 공감 버튼 위치를 살펴보았는데요. 공감버튼이 없어서 살짝 당황했습니다. 저장할때 주제를 선택하지 않으면 공감버튼이 안나오는거 아시죠? 요즘 너무 생각없이 포스팅하는 것 같네요.

 

수정모드로 들어가서 IT분야로 주제를 정하고 공감버튼이 나오게 바꾸었습니다.

 

 

 

일반적으로는 이렇게 공감버튼이 본문 아래에 위치해 있게 됩니다 .그래서 본문 제일 하단 아래에 공감 버튼을 위치 시키기 위해서는 본문포스팅을 할때 애드센스 코드를 넣는 방법과 공감 버튼 위치를 바꾸는 방법이 있겠죠. 티스토리 공감 버튼을 이동시키기 위해서는 꼭 대상 위치를 지정해주셔야 합니다.

 

 

 

 

매번 포스팅 마다 본문 하단에 애드센스 광고코드를 넣는것도 너무 힘드니까요^^

 

 

 

 

 

 

이렇게 위치를 옮겨 보았습니다. 방법은 아래와 같습니다.

 

 

우선 스킨에디터에서  본문 코드를 찾아서 아래에 아래 코드를 넣어주세요. 첫번째는 공감버튼이 이동할 태그가 되며, 두번째가 sns 필드가 이동될 태그입니다.

 

순서대로 넣었는데 공감버튼이 아래에 위치해 있는데요. 이는 로딩속도의 차이때문에 공감버튼이 아래로 가는게 아닐까 추측이 드네요. sns가 필요없으신 분들은 빼러려도 무방합니다.

 

 

 

 

다음으로 해주셔야 될 부분은 에디터 영역 마지막에 소스코들를 붙여주는 일입니다.

 


   function move_gong() {

      $("#gong").append($(".daum_like_wrapper"))
     $("#sns").append($(".tt-sns-wrap"))
 
   }
  
   $('document').ready(move_gong());
</script>

 

 

 

잠깐 설명을 드리자면, 공감버튼을 이동시키고, sns태그그룹을 이동시키는 역활을 하며, 제일 마지막에 있는  $('document').ready(move_gong()); 요기부분이 함수를 호출해서 이동시키는 역활을 합니다. 에디터 제일 마지막에 붙이는 이유도 화면이 전체 로드되고 난 뒤 작업을 하는게 제대로 동작을 하기에 제일 하단에 붙여주게 되며, 사실 이러한 소스코드를 계속 사용하면 본문의 로딩속도가 점차적으로  느려지게 됩니다.

 

따라서 이처럼 본문을 호출하고 난뒤 로딩되는 이러한 소스코드들은 전체적으로 모아서 같이 동작할 수 있게 만드는게 가장 좋습니다.

 

관련 소스는 아래 첨부하였습니다.

 

소스코드.txt

참고하셔서 공감버튼 잘 이동시켜보시기 바라겠습니다. SNS관련 태그들은 제거해도 됩니다. 여기까지 티스토리 공감버튼 이동시키는 방법이었습니다. 생각보다 아주 간단하니 적용시키기는 어렵지 않으실꺼에요.

 

 

 

 

 

라는 치환자로 구성되어 있습니다. 이부분이 티스토리 본문을 생성해주는 역활을 합니다. 티스토리 본문은 지금 보시는 화면에서 제가 작성한 글까지가 본문이 되며, 공감버튼은 꼭 본문의 마지막에 들어가기 때문에 애드센스 코드를 본문밑에 넣어주시면 항상 애드센스 위에 공감 버튼이 위치해 있게 됩니다.

 

이러한 부분을 극복하기 위해서는 한가지 꽁수가 필요한데요. 바로 공감 버튼을 이동 시켜버리는 됩니다.

 

이동을 위해서는 jQuery코드에 대해서 조금은 알아 두시면 좋은데요. 본문의 내용이 전부 로드되고 나면 jQuery를 이용해서 로드된 공감버튼의 위치를 애드센스 코드로 내려주기 위해서 이동될 위치를 지정을 해주셔야 합니다.

 

즉, 본문 아래에 위치해 있는 애드센스나 원하시는 위치에 특정 코드를 삽입해두고 본문이 전체 로드된 뒤 공감 버튼을 옮겨주게 되는 것이죠.

 

 

 

포스팅을 위해서 공감 버튼 위치를 살펴보았는데요. 공감버튼이 없어서 살짝 당황했습니다. 저장할때 주제를 선택하지 않으면 공감버튼이 안나오는거 아시죠? 요즘 너무 생각없이 포스팅하는 것 같네요.

 

수정모드로 들어가서 IT분야로 주제를 정하고 공감버튼이 나오게 바꾸었습니다.

 

 

 

일반적으로는 이렇게 공감버튼이 본문 아래에 위치해 있게 됩니다 .그래서 본문 제일 하단 아래에 공감 버튼을 위치 시키기 위해서는 본문포스팅을 할때 애드센스 코드를 넣는 방법과 공감 버튼 위치를 바꾸는 방법이 있겠죠. 티스토리 공감 버튼을 이동시키기 위해서는 꼭 대상 위치를 지정해주셔야 합니다.

 

 

 

 

매번 포스팅 마다 본문 하단에 애드센스 광고코드를 넣는것도 너무 힘드니까요^^

 

 

 

 

 

 

이렇게 위치를 옮겨 보았습니다. 방법은 아래와 같습니다.

 

 

우선 스킨에디터에서 

요즘 너무 바빠서 블로그에 거의 신경을 못쓰고 있는데, 카톡이었던것 같은데 공감버튼 위치를 수정할 수 없냐고 물어보셔서 급하게 포스팅을 해봅니다. 사실 이러한 기법등은 간단한 스크립트등으로 충분히 할 수 있는 부분이라 어렵지는 않은데요. jQuery라는 스크립트언어와 Css 만 조금만 아시면 간단하게 적용해 보실 수 있습니다. 다만, 티스토리 공감버튼의 경우 인위적인 위치변경은 추천해 드리고 싶지 않은데요.

 

공감이라는 특수한 환경때문에 조작의 부작용이 있어서 권장해드리지는 않습니다. 비슷한 이유로 티스토리측에 문의를 했던것 같은데 오래되어서 가물가물합니다. 구조를 바꾸는것은 안된다 이런 답변이었던것 같아요. 이게 구조 바꾸는것은 아닌데 알송달송하네요.

 

참고해보시고 적용은 알아서 판단해보세요.

 

 

 

 

2017/10/26 - [블로그/운영노하우] - 구글 상위노출을 위한 모바일 친화성 테스트

2017/10/25 - [블로그/수익노하우] - 애드센스 입금 안됨 어떻게 해결할까?

2017/10/11 - [블로그/수익노하우] - 애드센스 모바일 상단 확인해보세요

2017/10/10 - [블로그/꾸미기노하우] - 티스토리 스킨 상단 버튼 없애기(by fastboot)

2017/09/26 - [블로그/수익노하우] - 애드센스 사이트확인 하셨나요?

 

티스토리 공감버튼 이동방법 안내

충분히 간단합니다. 스킨에디터에서 본문내용 위치를 찾아주세요. 라는 치환자로 구성되어 있습니다. 이부분이 티스토리 본문을 생성해주는 역활을 합니다. 티스토리 본문은 지금 보시는 화면에서 제가 작성한 글까지가 본문이 되며, 공감버튼은 꼭 본문의 마지막에 들어가기 때문에 애드센스 코드를 본문밑에 넣어주시면 항상 애드센스 위에 공감 버튼이 위치해 있게 됩니다.

 

이러한 부분을 극복하기 위해서는 한가지 꽁수가 필요한데요. 바로 공감 버튼을 이동 시켜버리는 됩니다.

 

이동을 위해서는 jQuery코드에 대해서 조금은 알아 두시면 좋은데요. 본문의 내용이 전부 로드되고 나면 jQuery를 이용해서 로드된 공감버튼의 위치를 애드센스 코드로 내려주기 위해서 이동될 위치를 지정을 해주셔야 합니다.

 

즉, 본문 아래에 위치해 있는 애드센스나 원하시는 위치에 특정 코드를 삽입해두고 본문이 전체 로드된 뒤 공감 버튼을 옮겨주게 되는 것이죠.

 

 

 

포스팅을 위해서 공감 버튼 위치를 살펴보았는데요. 공감버튼이 없어서 살짝 당황했습니다. 저장할때 주제를 선택하지 않으면 공감버튼이 안나오는거 아시죠? 요즘 너무 생각없이 포스팅하는 것 같네요.

 

수정모드로 들어가서 IT분야로 주제를 정하고 공감버튼이 나오게 바꾸었습니다.

 

 

 

일반적으로는 이렇게 공감버튼이 본문 아래에 위치해 있게 됩니다 .그래서 본문 제일 하단 아래에 공감 버튼을 위치 시키기 위해서는 본문포스팅을 할때 애드센스 코드를 넣는 방법과 공감 버튼 위치를 바꾸는 방법이 있겠죠. 티스토리 공감 버튼을 이동시키기 위해서는 꼭 대상 위치를 지정해주셔야 합니다.

 

 

 

 

매번 포스팅 마다 본문 하단에 애드센스 광고코드를 넣는것도 너무 힘드니까요^^

 

 

 

 

 

 

이렇게 위치를 옮겨 보았습니다. 방법은 아래와 같습니다.

 

 

우선 스킨에디터에서  본문 코드를 찾아서 아래에 아래 코드를 넣어주세요. 첫번째는 공감버튼이 이동할 태그가 되며, 두번째가 sns 필드가 이동될 태그입니다.

 

순서대로 넣었는데 공감버튼이 아래에 위치해 있는데요. 이는 로딩속도의 차이때문에 공감버튼이 아래로 가는게 아닐까 추측이 드네요. sns가 필요없으신 분들은 빼러려도 무방합니다.

 

 

 

 

다음으로 해주셔야 될 부분은 에디터 영역 마지막에 소스코들를 붙여주는 일입니다.

 


   function move_gong() {

      $("#gong").append($(".daum_like_wrapper"))
     $("#sns").append($(".tt-sns-wrap"))
 
   }
  
   $('document').ready(move_gong());
</script>

 

 

 

잠깐 설명을 드리자면, 공감버튼을 이동시키고, sns태그그룹을 이동시키는 역활을 하며, 제일 마지막에 있는  $('document').ready(move_gong()); 요기부분이 함수를 호출해서 이동시키는 역활을 합니다. 에디터 제일 마지막에 붙이는 이유도 화면이 전체 로드되고 난 뒤 작업을 하는게 제대로 동작을 하기에 제일 하단에 붙여주게 되며, 사실 이러한 소스코드를 계속 사용하면 본문의 로딩속도가 점차적으로  느려지게 됩니다.

 

따라서 이처럼 본문을 호출하고 난뒤 로딩되는 이러한 소스코드들은 전체적으로 모아서 같이 동작할 수 있게 만드는게 가장 좋습니다.

 

관련 소스는 아래 첨부하였습니다.

 

소스코드.txt

참고하셔서 공감버튼 잘 이동시켜보시기 바라겠습니다. SNS관련 태그들은 제거해도 됩니다. 여기까지 티스토리 공감버튼 이동시키는 방법이었습니다. 생각보다 아주 간단하니 적용시키기는 어렵지 않으실꺼에요.

 

 

 

 

 

본문 코드를 찾아서 아래에 아래 코드를 넣어주세요. 첫번째는 공감버튼이 이동할 태그가 되며, 두번째가 sns 필드가 이동될 태그입니다.

 

순서대로 넣었는데 공감버튼이 아래에 위치해 있는데요. 이는 로딩속도의 차이때문에 공감버튼이 아래로 가는게 아닐까 추측이 드네요. sns가 필요없으신 분들은 빼러려도 무방합니다.

 

 

 

 

다음으로 해주셔야 될 부분은 에디터 영역 마지막에 소스코들를 붙여주는 일입니다.

 


   function move_gong() {

      $("#gong").append($(".daum_like_wrapper"))
     $("#sns").append($(".tt-sns-wrap"))
 
   }
  
   $('document').ready(move_gong());
</script>

 

 

 

잠깐 설명을 드리자면, 공감버튼을 이동시키고, sns태그그룹을 이동시키는 역활을 하며, 제일 마지막에 있는  $('document').ready(move_gong()); 요기부분이 함수를 호출해서 이동시키는 역활을 합니다. 에디터 제일 마지막에 붙이는 이유도 화면이 전체 로드되고 난 뒤 작업을 하는게 제대로 동작을 하기에 제일 하단에 붙여주게 되며, 사실 이러한 소스코드를 계속 사용하면 본문의 로딩속도가 점차적으로  느려지게 됩니다.

 

따라서 이처럼 본문을 호출하고 난뒤 로딩되는 이러한 소스코드들은 전체적으로 모아서 같이 동작할 수 있게 만드는게 가장 좋습니다.

 

관련 소스는 아래 첨부하였습니다.

 

소스코드.txt

참고하셔서 공감버튼 잘 이동시켜보시기 바라겠습니다. SNS관련 태그들은 제거해도 됩니다. 여기까지 티스토리 공감버튼 이동시키는 방법이었습니다. 생각보다 아주 간단하니 적용시키기는 어렵지 않으실꺼에요.