[Tistory] 티스토리 상황에 맞는 로그인 링크 바꾸기

지난 포스트에서 "티스토리의 로그인 체크"하는 방법에 대하여 알아보았습니다.

 

관련글

1. [Tistory] Jquery를 이용한 티스토리 로그인 체크

2. jQuery 를 이용하여 티스토리의 온/오프 상태를 확인하는 방법

 

그전에도 한번 티스토리 블로그의 상단에 뜨는 티스토리 툴바를 이용한 로그인 체크를 다루었는데 스킨을 바꾸면서 이 툴바를 숨기는 바람에 작동이 안 되는 것으로 착각하였습니다.

 

그러나 소스를 살펴보면 이 툴바가 보이지 않도록만 설정한 것이지 실제로는 해당 코드는 이미 뿌려져 있는 상태라는 것을 알 수 있었습니다.

 

따라서 "티스토리의 로그인 체크"의 경우 이 태그를 체크하는 것만으로 만들 수 있게 되었습니다.

 

 

티스토리 상황별 로그인/로그아웃 메뉴 달기

 

이 방법의 특징

이 방법은 티스토리 블로그 어디에서도 여러분의 로그인 체크가 가능합니다.
관리자이건 아니건 상관없습니다.
여러분이 티스토리에 로그인했나 안 했나를 체크 합니다.

 

1. 먼저 로그인/로그아웃 메뉴가 상황별로 바뀌는 메뉴 부분을 지정해 주어야 합니다.

 

로그인 메뉴의 링크를 감싸고 있는 태그에 class 명을 줍니다. 저는 "login"으로 설정하였습니다.

 

실제 바뀌는 부분은 <li class="login"></li> 사이의 내용인 <a href="https://www.tistory.com/login"><i class="fa fa-sign-in"></i> 로그인</a> 이 내용이 바뀌게 됩니다.

 

 

 

2. 블로그 HTML 최하단의 </body> 위에 다음의 스크립트를 입력합니다.

 

<script type="text/javascript" language="javascript">
   $(document).ready(function(){
      //로그인 스크립트 (로그인시 로그아웃으로 로그인을 바꾼다.)
      var login_ch = $('.tt_menubar_logout').text().replace( /(\s*)/g, "" );
      if (login_ch == "로그아웃"){
         var logout = '<a href="https://www.tistory.com/logout/?requestURI=http://' + location.host + '/921">로그아웃</a>';
         $("#header li.login").html(logout);
      }
   });
</script>

 

var login_ch = $('.tt_menubar_logout').text().replace( /(\s*)/g, "" );

 

이 코드의 의미는 .tt_menubar_logout을 찾아서 태그를 지우고 text 만 남긴 후 모든 공백을 제거 후 login_ch에 저장한다는 겁니다.

 

 

마치며

이 로그인 체크의 경우는 티스토리에서 "로그인/로그아웃" 글자를 바꾸지 않는 한 이상이 없을 것입니다.

 

이 코드는 jQuery 코드가 들어가 있습니다.

 

감사합니다.