티스토리 꾸미기 팁 - 티에디션 내맘데로 설정하기...

타 블로그에 비해 티스토리의 장점은 HTML을 직접 편집할 수 있는점이라 생각합니다.

블로그의 HTML을 편집할 수 있다는 거언~ 블로그가 내손안에 있다는것!! ㅋㅋ <유명한 광고카피>

HTML을 편집할 수 없다는 거언~ 걍 글만 쓰라는것!! ㅋㅋ 

알고계시는 분도 계실테고 모르는 분도 계실테고...

티에디션 편집의 필요성은 느끼지만 그냥 모르는 분도 계시리라 생각됩니다. ^^;

이번 글에서는 간단히 티에디션의 HTML을 편집해서

내블로그 메인화면에도 광고를 넣어보겠습니다.

물론 광고가 아닌 다른 어떤것도 삽입이 가능합니다.

먼저 티에디션 설정모드로 진입합니다.

진입하셨다면....

추가하고 싶은 위치에서 + 아이콘을 클릭하시고 

아래와 같이 빈 박스를 추가시켜주세요...

다음은... HTML 편집이 비교적 용이한 목록형중에 단순한 놈을 선택하겠습니다.

헤드라인형은 편집용 HTML이 길어요~~ ㅋㅋ

선택을 하게되면 빈 박스가 바뀐 모습을 볼 수 있습니다.

자 이제 HTML을 편집해서 원하는 내용을 삽입해 보겠습니다.

티에디션 툴박스의 디자인 탭과 HTML 버튼을 차례로 클릭해줍니다.

그러면 HTML 소스가 보여지는데...

// 1 --박스 타이틀 --------------------------------------------------------

<h2 class="tt-item-title"><span class="tt-item-title-bg"><span class="tt-item-title-inner"></span></span></h2>

<ul class="tt-wrap-item">

// 2 --목록이 반복되는 구간 시작---------------------------------------------

    <s_tabloid>

        <s_article_rep>

// 3 --목록을 표현하는 소스 시작---------------------------------------------

            <li class="tt-span-4 ">

                <p class="tt-wrap-post-thumb tt-span-1_2 tt-last">

               <a href="/entry/%ED%8B%B0%EC%8A%A4%ED%86%A0%EB%A6%AC-%EA%BE%B8%EB%AF%B8%EA%B8%B0-%ED%8C%81-%ED%8B%B0%EC%97%90%EB%94%94%EC%85%98-%EB%82%B4%EB%A7%98%EB%8D%B0%EB%A1%9C-%EC%84%A4%EC%A0%95%ED%95%98%EA%B8%B0" title="티스토리 꾸미기 팁 - 티에디션 내맘데로 설정하기..." 

               class="tt-wrap-thumb-link tt-span-1_2-border tt-span-1_2-">

                <img 

                class="tt-post-thumb"

                style=""  

                src="http:////" alt="티스토리 꾸미기 팁 - 티에디션 내맘데로 설정하기..."/></a>

                </p>

                <div class="tt-prepend-1_5">

               <p class="tt-post-title">

                   <a href="/entry/%ED%8B%B0%EC%8A%A4%ED%86%A0%EB%A6%AC-%EA%BE%B8%EB%AF%B8%EA%B8%B0-%ED%8C%81-%ED%8B%B0%EC%97%90%EB%94%94%EC%85%98-%EB%82%B4%EB%A7%98%EB%8D%B0%EB%A1%9C-%EC%84%A4%EC%A0%95%ED%95%98%EA%B8%B0"></a>

               </p>

               <p class="tt-post-etcinfo">

                <span class="tt-post-category"><a href="/category/%ED%8B%B0%EC%8A%A4%ED%86%A0%EB%A6%AC%20%ED%8C%81">티스토리 팁</a></span>

               <span class="tt-post-author">잠탱칼쓰마</span>

            <span class="tt-post-date">2013. 2. 1. 20:17</span>

<span class="tt-post-comment"> comment</span>

               </p>

                </div>

            </li>

// 3 --목록을 표현하는 소스 끝------------------------------------------------

        </s_article_rep>

    </s_tabloid>

// 2 --목록이 반복되는 구간 끝------------------------------------------------

</ul>

복잡한듯 하지만 필요없는 부분을 빼면 단순합니다.

아래 소스를 복사하신 다음에 굵은 글씨체로 된 부분만 내것으로 바꾸시고

여러분의 티에디션 HTML 소스편집창에 붙여넣고 저장하시면 됩니다.

<h2 class="tt-item-title"><span class="tt-item-title-bg"><span class="tt-item-title-inner"></span></span></h2>

<ul class="tt-wrap-item">

      

<script type="text/javascript"><!--

google_ad_client = "ca-pub-XXXXXXXXXXXXXX";

/* 블로그랭키 하단광고 */

google_ad_slot = "XXXXXXXX";

google_ad_width = 728;

google_ad_height = 90;

//-->

</script>

<script type="text/javascript"

src="http://pagead2.googlesyndication.com/pagead/show_ads.js">

</script>

</ul>

이렇게 한 다음 적용버튼을 누르시고 완료하세요.

응용하신다면 티에디션 원하는 위치에 원하는 내용을 넣어서

자유자재로 꾸미실수 있습니다.

티에디션에 대해서는 좀 더 다뤄 보도록 하겠습니다.

재미나는 블로깅 하세요 ^^