블로그팁/ 더보기 버튼 삽입해서 문장을 숨겨놓기/펼쳤다 접었다 하기

안녕하세요 낭만고양이 입니다. 블로그 돌아다니다보면 더보기 글자를 클릭하면 내용이 쫙 나오고 감추기 버튼을 누르면 다시 숨겨지는 그런형태의 포스팅을 보신적이 있을겁니다. 저또한 그렇게 하고싶어서 알아보니 의외로 쉬워서 포스팅을 하게되었습니다.

<!-- 내용 보이기 숨기기 -->
<p id="more134_1" class="moreless_fold">
<span style="cursor: pointer;" 
onclick="toggleMoreLess(this, '133_1',' more.. ',' less.. '); return false;"> 
자세히... 
</span>
</p>
<div id="content133_1" class="moreless_content" style="display: none;">
감춰둔 본문입니다.<p></p>
여기에 자세한 내용을 적으시면됩니다.<p></p>
자세히 버튼을 한번더 클릭하시면 <p></p>
내용을 다시 감춥니다.<p></p>
<p></p></div>

위와같은 소스를 html 모드에서 붙어넣고 테스트 해보세요 그러면 아래처럼 실행될것입니다.

자세히...

감춰둔 본문입니다.

여기에 자세한 내용을 적으시면됩니다.

자세히 버튼을 한번더 클릭하시면

내용을 다시 감춥니다.

쉽지요? 티스토리 블로그에서만 가능한 소스이구요. 스킨에 따라 스타일이 다를수가 있습니다. 스타일을 바꾸는건그 ccs 를 설정해야하는데 그것까지는 잘몰라서 패스하겠습니다..

사실 이 방법보다 더 쉬운 방법이 있습니다. 

티스토리 자체에 포함된 기능입니다. 저도 몰랐는데 포스팅하면서 발견했네요.. ㅜ.ㅜ

여기에 본문내용을 적으세요.

이것은 티스토리 자체기능을 이용했습니다.

이것이 더 쉽군요.ㅎㅎ

괜히 어렵게 할뻔했습니다.

글쓰기 누르시면 상단에 위와같이 빨간색네모와 같은 버튼이 숨기기 보이기 버튼입니다. 이걸 활용하시면 쉽게 감추고 보고를 할수가 있습니다.  이상 끝~~