본문 바로가기

Blog/티스토리스킨

스파이더 웹 반응형 스킨 사이드바 하단에 내맘대로 추가하기

마크쿼리 웹 반응형 스킨 사이드바 하단 추가

Spider’s Web 3.0.5 기준으로 작성했습니다.

지금 제 블로그 하단에 최신 댓글, 트랙백, 태크 목록을 사이드바 아래쪽에 추가해서 사용하는 방법입니다.
완벽한 건 아닌 거 같고?
그냥 막 추가해서 만든 거? 하지만 잘만 끼워 맞추면 쓸만한 거 같습니다.


블로그하단 사이드바



몇 가지의 사이드 메뉴가 하단에 내려놓으니까 없던 게 있어서...
보통 마크 쿼리님 Spider’s Web 스킨에는 없는 부분?이라 관심 가지는 분도 있어서 나름 좋더라고요 '';;


사이드바두개

  1. 블로그 하단에 사이드바 추가
  2. 하단 사이드바에 사용할 메뉴 옮기기

블로그 하단에 사이드바 추가

<div class="row">
<div class="col-sm-12">
<aside role="complementary">
<s_sidebar>
<!-- 여기 -->
</s_sidebar>
</aside>
</div>
</div>

우선은 </div><!-- site layout : /.container --> 이 부분을 찾아서 바로 위에 소스를 입력하면 관리 페이지에서 사이드바 메뉴 누르면 사이드바 2 라고 생깁니다.


<div class="row">
<div class="col-sm-12">
<aside role="complementary">
<s_sidebar>
<s_sidebar_element>
<!-- Global tags -->
<div class="col-sm-4">
	<section class="widget">
		<div class="widget-inner">
		<h3>Tag List</h3>
		<ul class="list-inline">
                   <s_random_tags>
                   <li> <a href="[*#_tag_link_##]" class="[*#_tag_class_##]">[*#_tag_name_##]</a></li>
                   </s_random_tags>
               </ul>
               </div>
	</section>
</div>
</s_sidebar_element>
</s_sidebar>
</aside>
</div>
</div>

블로그 하단에 추가한 사이드바에 옮길 사이드 바이 요소를 위에처럼 옮기시면 됩니다.
위에 부분에 여기라고 해놓은 곳에 붙여넣기'';;
<div class="col-sm-4"> 여기에 col-sm-4 숫자를 1~12 숫자를 바꾸시면 크기가 변하고 원하는 크기를 맞추시면 됩니다.

위에 숫자는 대충 쉽게 얘기하면 12는 100%로 6은 50%라 생각하면 돼요
위에 4는 33.333...%라고 생각하면 됩니다.

Download 하단에 사이드바 추가.txt


수정완료


그리고 사이드 바 전체를 하단으로 옮기고 조금만 수정하면 Spider’s Web 스킨을 Doo Be Doo 스타일로 사용할 수 있습니다.


Plus

정리해보면

사이즈를 원하는 대로 잘 맞추면 괜찮은데 잘못 맞추면 이상할 수도 있어요.
암튼 막 추가해서 만드는 사이드바 하단에 추가하는 방법입니다.
예전에 누가 문의한게 생각나서 포스팅한겁니다.
혹시나 도움 되면 좋겠네요.
그리고 더 궁금하시면 댓글이나 방명록으로 문의하세요.