본문 바로가기

TBlog/TStory Skin / Tip

티스토리 블로그 포스트 글제목을 물결무늬 플래시로


블로그를 개설하면서 가장 먼저 블로그스킨이나 여기저기 꾸미기에 신경을 쓰게 됩니다. 저도 지금부터 시작이라 하나하나 알아가고 있지만, 혹여나 시간이 흘러 나중에 다시 변경할 때를 대비하고, 블로거를 시작하시는 다른 분들에게도 좋은 정보를 공유하려는 차원에서 이 글을 작성했습니다.

제목글에 물결무늬 플래시로 변경하여 적용한 결과는 아래와 같습니다.




어떻게 적용하는지 순서대로 정리해봤습니다.


1. 파일 다운로드

먼저 아래의 압축파일을 다운로드 하세요. 다운로드 한 파일의 압축을 풀게 되면, viewTitle.js viewTitle.swf 이렇게 두개의 파일을 확인하실 수 있습니다.

물결무늬플래시.zip


2. 파일 업로드

이렇게 압축 해제한 두개의 파일을 관리자 페이지 ▶ 꾸미기 ▶ HTML/CSS편집 ▶ 파일업로드 항목을 이용하여 업로드 합니다.


3. 스크립트 수정

업로드가 완료되면 이제 관리자 페이지 ▶ 꾸미기 ▶ HTML/CSS편집 ▶ HTML/CSS 항목으로 이동해서 스크립트를 수정합니다.

skin.html 창에서 Ctrl+F 키를 이용하여 검색창을 여신 후 article_rep_title 을 입력하고 검색 합니다. 검색하시면, 스킨마다 틀리겠지만, 위의 검색된 문구가 2번 나오는데 2개 모두 수정해주시고 하단의 저장을 클릭해야 변경이 됩니다.


제 스킨에는

<h2 class="title"><a href="[##_article_rep_link_##]">[##_article_rep_title_##]</a></h2>

이런 형식으로 된 부분이군요. 기존의 소스에는 앞뒤로 ‘<!--’, ‘--->’를 입력해서 주석처리해주시고, 다음 줄에 아래와 같이 입력해줍니다.

<script language="javascript" src="./images/viewTitle.js" type="text/javascript" />

</script>

<script language="javascript" />

showTitle("./images/", "viewTitle.swf", 640, 60, "[##_article_rep_title_##]", "[##_article_rep_link_##]","left", "0xCC0000");

</script>

마지막으로 적용이 됐는지 확인해보시고, 본인에 맞게 정렬 및 색상을 변경하시면 됩니다.

• 글제목의 크기를 변경할려면 showTitle("./images/", "viewTitle.swf", 640(가로), 60(세로) 이 부분을 변경하시면 됩니다.

• 제목의 정렬을 변경할려면, 소스 끝 부분의 left(왼쪽 정렬) 부분을 center(가운데 정렬)이나, right(오른쪽 정렬) 로 수정하시면 됩니다.

• 마찬가지로 색상을 변경하실 경우에는 0xCC0000 부분을 수정해주시면 됩니다.

저는 결과적으로 아래와 같이 변경해서 적용했습니다.

<!--<h2 class="title"><a href="[##_article_rep_link_##]">[##_article_rep_title_##]</a></h2>-->

<script language="javascript" src="./images/viewTitle.js" type="text/javascript" />

</script>

<script language="javascript" />

showTitle("./images/", "viewTitle.swf", 640, 40, "[##_article_rep_title_##]", "[##_article_rep_link_##]","left", "0x000000");

</script>