IE8 웹조각(web slice) 티스토리 응용기

IE8에 있는 웹조각(web slice)를 티스토리에서도 사용이 가능합니다.

제 블로그 메인 화면에 있는 "추천 소프트웨어" 에 마우스를 올려 놓으시면, 웹조각(web slice)이 적용되어 있습니다.



아주 간단히 사용하실 수 있습니다.



"즐겨찾기 모음 추가"를 클릭하시면,
아래 이미지 처럼 즐겨찾기 옆에 추가된 화면을 보실 수 있습니다.




기본 옵션입니다.
<div class="hslice" id="사용할 id 지정">
<div class="entry-title">추가시 사용할 이름 지정</div>
<div class="entry-content">슬라이스 할 내용</div>
</div>

테터데스크가 설정된 경우는..
슬라이스 만들 항목에 있는 "아이템 HTML 수정" 을 클릭합니다.



저 같은 경우는 테터테스크 메인이 섬네일 목록형이라고 지정이 되어 있기 때문에,
섬네일 목록형 아이템 HTML 수정이라는 창이 뜹니다.



ⓐ 수정창에 있는 HTML 소스를 메모장 같은 곳에 붙여 놓으세요.

그런 다음,

<div class="hslice" id="사용할 id 지정">
<div class="entry-title">추가시 사용할 이름 지정</div>
<div class="entry-content">슬라이스 할 내용</div>
</div>

이런식으로 수정해 주시면 됩니다.


응용기 들어 갑니다.

<!-- 슬라이스 시작 -->
<div class="hslice" id="seo">
<div class="entry-title" style="display:none">지우개 SEO </div>
<div class="entry-content"> 기존에 있던 HTML 소스 </div>
</div>
<!-- 슬라이스 끝 -->

<div class="entry-title" style="display:none">지우개 SEO </div>

style="display:none" 추가 된것을 확인할 수 있습니다.
- 이유는 타이틀을 감추기 위해서 입니다.


<div class="entry-title">지우개 SEO </div>



<div class="entry-title" style="display:none">지우개 SEO </div>



아래에 있는 검정색의 바탕에 있는 소스는 "ⓐ 기존에 있던 HTML 소스" 입니다.



진한 파란색으로 된 코드가 기존에 있는 "기존에 있던 HTML 소스"입니다.

<div class="hslice" id="seo">
<div class="entry-title" style="display:none">지우개 SEO </div>
<div class="entry-content">  
<div class="TD_recent">
   <s_more>
       <div class="TD_more">
           <div class="TD_more_title"><a href=""></a></div>
           <span class="TD_more_btn"><a href="">더보기</a></span> </div>
   </s_more>
</div>
<div class="TD_recent">   
   <s_list>
       <div class="TD_thumblist">
           <div class="TD_thumbimg">""</div>
           <div class="TD_headline">
               <a href=""></a> <span class="TD_date"> </span>
           </div>
           <div class="TD_summary"><p></p></div>
       </div>
   </s_list>
</div> </div>
</div>

대충 이해가 되시죠?

사이드바에도 웹조각(web slice) 추가가 가능합니다.


<s_sidebar_element>
<!-- 최근 포스트 모듈 -->
<div class="hslice" id="recent_posts">
<div class="entry-title" style="display:none">지우개닷컴 최신글 </div>
<div class="entry-content">
<h3><a href="#" onclick="showHide('recentPost'); return false;">Recent Post</a></h3>
<div id="recentPost" style="display:block">
<ul>
<s_rctps_rep>
<li>
<a href=""> </a>
<span class="cnt"></span>
</li>
</s_rctps_rep>
</ul>
</div>
</div>
</div></s_sidebar_element>

붉은색으로된 소스가 "웹조각(web slice) 소스" 입니다.


  • 네이버 블러그 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 카카오스토리 공유하기