티스토리 뷰

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="[##_list_link_##]">[##_list_title_##]</a></div>
           <span class="TD_more_btn"><a href="[##_list_link_##]">더보기</a></span> </div>
   </s_more>
</div>
<div class="TD_recent">   
   <s_list>
       <div class="TD_thumblist">
           <div class="TD_thumbimg">"[##_item_thumbnail_##]"</div>
           <div class="TD_headline">
               <a href="[##_item_link_##]">[##_item_title_##]</a> <span class="TD_date"> [##_item_date_##]</span>
           </div>
           <div class="TD_summary"><p>[##_item_summary_##]</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="[##_rctps_rep_link_##]"> [##_rctps_rep_title_##]</a>
<span class="cnt">[##_rctps_rep_rp_cnt_##]</span>
</li>
</s_rctps_rep>
</ul>
</div>
</div>
</div></s_sidebar_element>

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


댓글
  • 프로필사진 BlogIcon J군™. 처음에 웹슬라이스 기능을 적용하려면 많이 복잡할줄 알았는데, 그게 아니군요..
    간단한 태그 몇줄이 저에게는 왜 복잡하고 어렵게 보였을까요..? ^^;
    제 블로그에도 바로 적용해야겠네요. 좋은 정보 잘 얻고 갑니다.
    2009.03.21 20:44 신고
  • 프로필사진 BlogIcon 궁극의 힘 좋은 정보 감사합니다. 많은 도움이 되었습니다.^^ 2009.03.31 21:16 신고
  • 프로필사진 BlogIcon NoPD 웹 슬라이스를 적용하는게 이렇게 쉬운 것이었군요 ^^;;
    한번 적용해 봐야겠습니다~
    2009.03.31 22:50 신고
  • 프로필사진 BlogIcon 사이트 헌트 지우개님 안녕하세요^^
    티스토리 유저 사이트헌트입니다.
    님의 블로그에 방문하면서도 늘 눈팅만 하다 처음으로 댓글을 달아봅니다.
    티스토리 유저님들께서 웹조각기능을 활용할수 있다면 많은 도움이 되리라 여겨져
    님의 포스트를 포럼에 링크걸려고 합니다. 괜찮겠죠^^
    우측에 실시간 온라인 위젯이 눈에 들어와 제 사이트에도 달았읍니다.
    참 위와 같은 방법으로 응용하면 최근 코멘트나 트랙백에도 웹조각기능이 가능할 것 같은데..
    제가 잘못 알고 있는 것인지...
    늘 건강하시고 행복하시길 바랍니다.
    2009.04.02 03:38 신고
  • 프로필사진 비밀댓글입니다 2009.06.19 22:33
  • 프로필사진 BlogIcon 지우개 웹조각(슬라이스)은 IE8.0 부터 지원한답니다.
    IE6.0 이나 7.0 에선 확인이 불가능하구요.
    IE8.0 으로 확인하셔야 됩니다.

    링크 걸어주신 주소를 확인해 보니 웹조각(슬라이스)이 적용이 되어 있질 않습니다.

    만약 현재 사용하시는 블로그에 웹조각(슬라이스)을 적용하셨다면,
    블로그 주소를 가르쳐 주시면 제가 확인해 보겠습니다.
    2009.06.19 22:44 신고
  • 프로필사진 비밀댓글입니다 2009.06.20 09:33
  • 프로필사진 젤리 또다른 질문 -
    http://www.textcube.org/attach/2/1096527855.jpg
    JP Simple v2 Edition for Textcube v1.6을 티스토리용으로 쓰고싶은데
    그냥 덮어버리니까 안되네요 ->http://affbbbrrb.tistory.com/

    전체 가로폭도 줄이고,중간에 존재하지 않는 페이지?
    좀 도와주세요
    2009.06.20 09:39 신고
댓글쓰기 폼
Total
7,131,368
Today
1,226
Yesterday
2,190
«   2018/02   »
        1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28      
글 보관함