티스토리, 댓글의 HTTP 링크가 클릭되도록 수정.
티스토리 블로그의 경우 댓글이나 방명록에 http로 시작하는 주소를 입력하면 본문과 같이 자동링크 설정이 안된다.
사이트 - http://blog.kjslab.com/16 를 참고, autolink.js 와 jquery-1.9.1.js 스크립터를 이용한 댓글 자동링크 설정방법을 적용해 본다.
설정방법은 간단하다.
일단, 첨부파일을 다운로드 받고 티스토리에 파일을 업로드 한다.
autolink.zip티스토리 skin.html을 열어 그림과 같이 <title> 위에
<Script Type="Text/Javascript" Src="./Images/Autolink.Js"></Script>
<Script Type="Text/Javascript" Src="./Images/Jquery-1.9.1.Js"></Script>
를 삽입한다.
skin.html 파일 맨 아래에 그림과 같이
<script type=text/javascript>autolink($('#container'));</script>
를 삽입한다.
단, #container 이름은 티스토리 블로그의 스킨마다 다르니 본인 스킨에 맞게 수정하여 입력한다.
2017.09.05 11:04 신고
저도 이거 해놔야 하는데 생각만 하고 미루기만 하고 있었는데 이참에 추가해야겠네요..
2017.09.05 17:05 신고
댓글에 주소입력시 링크가 자동으로 되는게 생각보다 편하길래 추가했는데, SONYLOVE님도 이 기회에 추가해 놓으시면 편하실거예요. 환절기 건강 조심하세요.
2017.09.25 14:41 신고
재미있네요~
일단 코드는 손 안대기로 했기 때문에...
패스하지만, 랜덤 첫 페이지등 묘한 구석이 많은 블로급니다!!!
2017.09.25 14:46 신고
http://ooppa.tistory.com 이나 상단에 집모양 아이콘을 누르시면 매번 새로운 페이지로 랜덤하게 접속이 가능하도록 했습니다.
필요하실 때, 말씀하세요 ^^
2017.09.25 14:58 신고
신비롭습니다!!!
2017.09.25 15:23 신고
변덕이 죽끓듯하다보니 ...ㅋㅋ
2018.01.10 18:55
비밀댓글입니다
2018.01.10 21:55 신고
위의 설명대로 js파일 업로드 하시고
<!-- 추가 - 댓글 autolink -->
<script type="text/javascript" src="./images/autolink.js"></script>
<script type="text/javascript" src="./images/jquery-1.9.1.js?ver=1.9.1"></script>
<script type="text/javascript"> autolink($('#container')); </script>
</html>끝나는 바로 위에 넣으시면 됩니다
블로그 찾아가서 소스보기해서 js파일 클릭하니 404에러가 뜨는것 봐서는 js파일이 업로드가 안되었던지 아니면 경로가 잘못되었던지 하지 않을까싶네요
2018.01.10 22:03 신고
404에러 원인은 대/소문자 구분 때문에 그렇습니다.
업로드된 js파일 대/소문자 구분해 주면 됩니다. 링크를 소문자로 변경해서 접근하니 정상동작 확인했습니다 ^^
2018.01.11 20:12 신고
알려주신 방법으로 해결했습니다.
직접 소스 분석도 해주시고, 정말 감사합니다~
2018.01.11 20:26 신고
기존에 있던 것을 공유하는 것이라... 해결되셨다니 다행입니다.
잘 모르는 저에게 질문해 주셔서 제가 더 영광이죠 ^^
2018.03.09 13:03 신고
안녕하세요. http://mysnowbear.tistory.com 을 운영하고 있는 '눈곰'이라고 합니다.
묘한오빠님께서 안내해주신대로 java script 파일을 티스토리에 업로드하고, 코딩들을 붙였는데요. 제 블로그에서는 댓글에서 http://..로 시작하는 주소들이 자동 클릭이 되지 않습니다. 혹시 왜그런지 한번만 살펴봐주실 수 있을까요? 감사합니다 ㅠㅠ
2018.03.09 13:52 신고
찾아주셔서 감사합니다. 아래와 같이 답변을 참고하시면 될것 같네요 ^^
id 는 스타일을 지정할 때 한 가지만 지정해서 쓰는 이름. (표기방식은 #이름)
하나의 문서에 고유한 id 하나밖에 쓸 수 없습니다.
class 그룹으로 묶어서 스타일을 지정할 때 쓰는 이름. (표기방식은 .이름)
ID, CLASS 이름은 자유롭게 지으면 되지만 숫자로 시작해선 안 됩니다.
<nav class="navbar navbar-fixed-top">
<div class=container>
를
html에서 <div id=container> 로 변경하셔야 하고 style.css에서도 #container 선언을 해주셔야 합니다
저의 경우 </html> 바로 위에 아래와 같이 한번만 해주시면 됩니다.
<!-- 추가 - 댓글 autolink -->
<script type="text/javascript" src="./images/autolink.js"></script>
<script type="text/javascript" src="./images/jquery-1.9.1.js?ver=1.9.1"></script>
<script type="text/javascript"> autolink($('#container')); </script>
블로그를 보시니 <html> 시작에도 넣으시고 </html> 마지막에도 2중으로 넣으셨던데 그러면 블로그 속도가 느려지지 않을까싶네요
2018.03.09 14:06 신고
친절한 답장 감사합니다. 혹시 css에서 #container 선언을 어떻게 하는지도 알려주실 수 있을까요?
단순히 css에다가 #container 를 한 줄만 써주면 되는건가요?
2018.03.09 14:12 신고
id, class 에 대해 찾아보셔야 할듯합니다.
"이건 여기다 넣어라"라고 말씀드리지 못하는 이유는 bootstrap도 사용하신것을 보아 JS끼리 충돌이 생길수도 있기 때문이고 skin파일 어떻게 구현될지 가늠하지 못하기 때문입니다.
2018.03.09 14:27 신고
제가 알고 있기로는 css는 폰트의 색깔이나 폰트 사이즈, border의 크기나 border radius를 정하는 곳인데요. 제가 보통 css에서 사용했던건 class라서 .(class name)이런식으로 썼구요.
그래서 #container 선언하는 것도 class 사용했던거랑 비슷하게 하면 될 것 같은데요.
선언 내용을 무엇으로 하면 되는지 여쭈어 본 것입니다!
혹시 길잡이를 알려주신다면 더 찾아서 제 블로그에 꼭 이 기능 적용해보겠습니다. 조금만 더 도와주신다면 정말로 감사하겠습니다!
2018.03.09 15:06 신고
설명드리면 skin에서 div id=container 라고 하셨다면 css에서 .container 가 아니고 #container 라고 변경해야 한다는 말입니다
그에 맞게 수정을 하셔야되겠습니다
2018.03.09 15:15 신고
지금 옆자리 친구의 도움으로 찾아보니 굳이 autolink($('#container'))라고 써줄 필요가 없는 것 같은데요? div class=container처럼 class로 정의가 되어있으니 autolink($('.container'))로 하면 잘 작동하더라구요. 왜 class->id로 바꾸라고 권유하셨는지 여쭈어봐도 될까요?
2018.03.09 15:42 신고
id 는 스타일을 지정할 때 한 가지만 지정해서 고유한 id 하나밖에 쓸 수 없는 이름,
class 그룹으로 묶어서 스타일을 지정할 때 쓰는 이름이기 때문입니다.
일반 스킨이나 반응형 스킨이나 나중에 관리가 용이하게 하기 위해서 그렇습니다.
2018.03.09 18:46 신고
덕분에 이제 댓글에서도 http 링크 클릭이 가능하네요! 앞으로도 좋은 글 많이 써주세요 ^^
2018.04.18 12:46 신고
도움이 되셨다니 다행입니다. ^^
2018.04.18 11:10 신고
안녕하세요. 제가 찾던 기능이라 글 설명대로 모두 따라 했는데 잘 안됩니다. 혹시나 댓글 영역을 감싸는 div 클래스 명을 모두 넣어보면서 테스트해봤는데도 적용이 안되더라고요. 지금 사용하고 있는 스킨은 html에 container라는 id가 없습니다. body 하단에 들어가는 스크립트에서 #container는 무슨 영역이며 이런 경우는 어떻게 해결할 수 있을지 여쭤봐도 될까요? 초면에 번거로운 질문 죄송합니다 ㅠ
2018.04.18 12:47 신고
스크립터 대소문자 구분하셨는지... 스크립터 경로는 잘 설정하셨는지... 궁금하네요
2018.04.18 12:50 신고
타이틀 위에 들어가는 소스는 모두 소문자로 바꿨고 파일 모두 업로드 했고 다 확인했어요. 지금 이것 저것 만져보고 있습니다.
2018.04.18 12:52 신고
cont...는 따로 설정하기 귀찮아 div 레이아웃의 가장 큰 테두리에 지정했다고 생각하시면 됩니다.
2018.04.18 12:57 신고
엇! 방금 말씀하신 댓글을 보고 container를 body의 id로 바꿨더니 바로 적용됐어요!
2018.04.18 13:19 신고
테스트 해보니까 잘 됩니다. 이제 css 만지는 일만 남았네요. 좋은 글 감사합니다!
2018.04.18 15:05 신고
뭔지 모르지만 도움이 되셨다니 ^^