티스토리 메뉴바 패치에 따른 FastBoot 로그인/로그아웃 버튼 문제해결

로그인/로그아웃 기능 패치

  티스토리에서 개발인력을 충원한다는 공지가 오래전에 있었는데, 그 때문인지는 몰라도 로그인/로그아웃 기능에 변화가 있었습니다. 사용하시는 분들은 알아채지 못할 변화일 수도 있지만 이 기능 변화 때문에 FastBoot 스킨도 영향을 받아서 상단과 Offcanvas에 있는 로그인/로그아웃 버튼이 먹통이 되는 현상이 있었네요. 뭐하라님께서 제보해주셔서 수정하는 방법에 대해서 알려드리고자 포스팅합니다.

skin.html

  아래 부분이 찾으셔야 할 부분입니다. (삭제해야할 부분)

	
<!--F Login Button Mapping -->
<script>
	var tmpLogin = document.getElementsByClassName("tt_menubar_logout")[0].getElementsByTagName("a")[0];
	tmpLogin.className = "";
	tmpLogin.innerHTML = tmpLogin.innerHTML.replace("로그아웃",'<i class="fa fa-unlock fa-fw"></i> Logout');
	tmpLogin.innerHTML = tmpLogin.innerHTML.replace("로그인",'<i class="fa fa-lock fa-fw"></i> Login');
	document.getElementById("loginout_append").innerHTML = tmpLogin.outerHTML;
</script> 
	

  이 부분을 일단 지우신 다음에 </html> 다음 부분에 아래에 새로 적어드리는 코드를 넣어주시면 됩니다. 티스토리에서 메뉴바를 불러올 때 페이지 맨 하단 부분에 메뉴바 관련 코드를 집어넣는 것으로 위치를 수정해서 발생하는 문제였습니다. 이렇게 하면 페이지 로딩이 끝난 다음에 메뉴바를 로딩하기 때문에 더 빨라보이는 효과가 있어서 티스토리에서 패치를 한 것으로 생각됩니다.

  </html> 다음에 새로 넣으셔야 할 부분

	
<!--F Login Button Mapping -->
<script>
	var tmpLogin = document.getElementsByClassName("tt_menubar_logout")[0].getElementsByTagName("a")[0];
	tmpLogin.className = "";
	tmpLogin.innerHTML = tmpLogin.innerHTML.replace("로그아웃",'<i class="fa fa-unlock fa-fw"></i> Logout');
	tmpLogin.innerHTML = tmpLogin.innerHTML.replace("로그인",'<i class="fa fa-lock fa-fw"></i> Login');
	document.getElementById("loginout_append").innerHTML = tmpLogin.outerHTML;
	$('#lnav ul li ul a')[0].outerHTML = tmpLogin.outerHTML;
</script> 
	

  수정 후 되어야 할 모습

	
	<script>if (ielt9 == 1) window.jQuery || document.write('<script src="./images/jquery-1.11.0.min.js"><\/script>');
	else if(ielt9 == 0) window.jQuery || document.write('<script src="./images/jquery-2.1.0.min.js"><\/script>');</script>
    <!--F FastBoot_Plugins -->
	<script>if(rssLogFlag==1)document.write('<script src="./images/fastboot_index.js?05156"><\/script>');</script>
    <script src="./images/fastboot.min.js?0507"></script>
    <!--[if (gt IE 8)|!(IE)]><!--><script src="./images/fastboot_offcanvas.min.js"></script><!--<![endif]-->
	<div id="toTop" onclick="window.scrollTo(0, 0);"><i class="fa fa-angle-double-up fa-2x"></i></div>
</body></html>
<!--F Login Button Mapping -->
<script>
	var tmpLogin = document.getElementsByClassName("tt_menubar_logout")[0].getElementsByTagName("a")[0];
	tmpLogin.className = "";
	tmpLogin.innerHTML = tmpLogin.innerHTML.replace("로그아웃",'<i class="fa fa-unlock fa-fw"></i> Logout');
	tmpLogin.innerHTML = tmpLogin.innerHTML.replace("로그인",'<i class="fa fa-lock fa-fw"></i> Login');
	document.getElementById("loginout_append").innerHTML = tmpLogin.outerHTML;
	$('#lnav ul li ul a')[0].outerHTML = tmpLogin.outerHTML;
</script> 
	

  다만 이전과 다르게 로딩 후 살짝 튕겨보이는 현상이 있기는 할 것입니다. 기존에는 페이지 로딩중에 로그인/로그아웃 여부를 알 수 있어서 거의 사용자가 알아채지 못하게 로그인/로그아웃을 감지할 수 있었는데 티스토리 패치 이후로는 그것이 불가능하네요..

  FastBoot 스킨의 로그인/로그아웃 기능을 사용하고 계신 분들은 위 내용 참고하시어 수정해주시면 되겠습니다. 감사합니다. ^^