티스토리 블로그 jquery 중복 로딩 관련 수정 방법

2022. 12. 6. 18:42 / 서기랑

 티스토리 블로그 스킨 중에는 jquery를 사용하는 스킨이 많이 있다.

 문제는 스킨에서 사용하기 위해 jquery를 로딩하게 되면 티스토리에서 자체적으로 로딩하는 jquery와 함께 중복으로 로딩이 된다는 것인데 스킨에서 사용하는 jquery와 티스토리에서 로딩하는 jquery의 버전에 큰 차이가 없다면 스킨을 수정하여 jquery가 한 번만 로딩되도록 변경해주는 것이 좋다.

 

티스토리 블로그 jquery 중복 로딩 수정 하기

1. 중복 로딩 확인.

 어차피 스킨에서 jquery를 로딩하는 부분이 있다면 중복 로딩이 거의 확실하지만 그래도 혹시 모르니 개발자 도구를 통해 확인해 보자.

 

 자신의 블로그에 접속한 뒤 [F12]를 눌러 개발자 도구를 불러오자.

 개발자 도구가 나타나면 Network 탭으로 이동한 뒤 [Ctrl + R] 혹은 [F5]를 누르면 현재 페이지에서 사용하는 파일들이 나타난다.

 여기서 jquery-xxx.min.js와 비슷한 파일이 2개 이상 있다면 jquery가 중복 로딩된다고 보면 된다.

 (이름으로 정렬해서 보면 편하다.)

개발자 도구 네트워크 파일

2. 중복 로딩 수정.

 티스토리에서 자체적으로 로딩하는 jquery를 어찌할 방도는 없다.

 때문에 중복 로딩을 수정하기 위해서는 스킨에서 로딩하는 jquery부분을 수정해야 한다.

 

 티스토리 스킨 편집에 들어가서 <head> </head> 사이에 있는 jquery를 로딩하는 부분을 찾아보자.

 코드가 있다면 보통 아래와 같은 형태로 되어있지 않을까 한다.

<script src="//t1.daumcdn.net/tistory_admin/lib/jquery/jquery-1.12.4.min.js"></script>

 

 로딩 부분을 찾았다면 앞 뒤에 <!-- -->를 넣어 주석처리 한 뒤 아래와 같이 코드를 추가하고 저장하자.

 (추가 코드는 티스토리에서 로딩한 jquery를 스킨에서도 사용하겠다는 의미라고 보면 된다.)

<!--<script src="//t1.daumcdn.net/tistory_admin/lib/jquery/jquery-1.12.4.min.js"></script>-->
<script tpye="application/javascript">
window.jQuery = window.$ = window.tjQuery;</script>

티스토리 html 수정

3. 로딩 확인.

 개발자 도구를 다시 확인해 보면 jquery를 한 번만 로딩하는 것을 확인할 수 있을 것이다.

jquery중복 로딩 문제 해결

 

그 외 내용

- 코드 변경으로 인하여 문제가 발생했다면 추가한 코드와 주석을 지워서 원상 복구하면 된다.

 

- 특정 스킨의 경우 jquery 버전의 변경으로 인하여 스킨의 js 부분을 수정해야 할 수도 있다.

 수정 후 개발자 도구의 console 부분을 확인해보고 새로운 오류가 발생했다면 다른 부분에 문제가 없는지 확인해 보자.

 보통은 아무 에러도 발생하지 않아야 정상이긴 하지만 스킨에 따라서는 jquery 변경과 관련 없는 별도의 에러가 있을 수도 있으며 애드센스를 사용하고 있다면 애드센스와 관련된 에러도 발생하기 때문에 변경 후 새로 생긴 에러를 확인해봐야 한다.

 (애드센스 관련 에러는 사용자가 어떻게 할 수 없으니 넘어가자.)