버튼 아닙니다 이미지입니다


    티스토리 이용자 분들은 대부분 다음뷰를 이용하고 계실텐데요.


    이 버튼의 위치를 옮기거나, 혹은 다른 요소를 다음 뷰 버튼쪽으로 옮기고 싶지만, skin.html수정으로는 한계가 있음을 알고계실겁니다.


    이번 글에서는 jQuery의 append문을 이용해 요소들의 자리를 바꾸는 방법을 알아보겠습니다.



    다음뷰 아래에 클릭 구걸(..)달기


    구걸해봤자 안눌랴쥼..


    1. 다음뷰 밑에 넣을 말을 만들고 skin.html어딘가에 넣습니다.(어짜피 옮겨지므로 아무데나 상관없음) 

    그리고 첫 태그에 id를 plzclck으로 지정해줍니다.

    예시)

    <p id="plzclck" style="text-align: center;"><b><span style="font-family: 'Times New Roman';font-size: 14pt; background-color: rgb(168, 196, 13); color: rgb(255, 255, 255);">손가락 꾹! ↑↑ 눌러주세요<img src="https://i1.daumcdn.net/mimg/mypeople/sticker/edit/sticker_003.png" alt="좋은하루"></span></b>

    </p>


    2. skin.html에서 </body> 바로 위쯤에 다음 코드를 삽입해줍니다.

    <!-- 다음뷰 밑으로 옮기기 -->

    <script type="text/javascript">

       function reLocate() {

          $(".blogger-news-widget").append($("#plzclck"))

       }

       $('document').ready(reLocate());

    </script>


    ※본 스크립트는 jQuery를 사용합니다. 스크립트가 작동하지 않는다면 스크립트 윗줄에 다음을 추가해주세요.

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

    <!--[if lte IE 8]> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <![endif]-->



    응용

         $(".blogger-news-widget").append($("#plzclck"))

    여기서 파란색이 다음뷰의 class 값이고, 빨간색의 id를 가진 태그를 다음뷰 태그 아래로 보낸다는 구문입니다.


    다음뷰를 옮기려고 한다면, 옮기고 싶은 위치에 예를들어 

    <div id="viewhere"></div>를 삽입해놓고

    위의 스크립트에서 append문을

         $("#viewhere").append($(".blogger-news-widget"))

    로 바꾸면 다음뷰 버튼이 div를 삽입한 곳으로 이동하게 됩니다.

    본문 작성시 본문 위쪽에 div를 삽입해두면 본문 위쪽으로 다음뷰를 옮기는 것도 가능하겠죠?


    여러분이 원하는 곳에 view버튼을 이동시켜보세요.



    Posted by 뭐하라

    문제가 있나요?(?)

    내용상 오류가 있음 업데이트 필요 화면이 깨짐 기타 수정이 필요함
    • BlogIcon HAWOOL
      2014.11.17 22:52 신고

      안녕하세요 블로그 내용잘 봤습니다.
      ADDTHIS 에 카카오까지 연동에서 입력까지는 했습니다.

      그런데 ADDTHIS 를 공감 밑에다가 바로 나오게 하고 싶은데 어떻게 해야 하나요 ?
      스크립트를 응용해봤는데 되지는 않습니다...

      • BlogIcon 뭐하라
        2014.11.17 23:06 신고

        스킨이 이쁘네요 ^^
        jQuery(".addthis_sharing_toolbox").append(jQuery(".another_category"))
        카테고리 다른글 보기 위로 옮기는 스크립트입니다

티스토리 툴바