본문 바로가기
블로그 BOX/블로그 팁

티스토리 제목 물결무늬 플래시로 바꾸는 방법

by 쿨펀치 2011. 12. 24.
반응형


티스토리 제목 물결무늬 플래시로 바꾸는 방법

블로그 초보님들이 많이 찾으시는 포스트 제목 바꾸기 입니다.
저번 포스트 제목 바꾸기에서는 단순한 제목의 크기와 색상을 바꾸는 법을 알아봤습니다.

포스트 제목 색상 바꾸기 - 구경가기

이번 시간엔 좀 더 발전한 포스트 제목 변경 방법을 알아보겠습니다.
단순한 색상과 글자 크기만을 바꾸던 방식에서 제목이 역동성 있게 움직이는 물결무늬 플래시로 한층 업그레이드 시켜 봅시다.


초보님들을 위해 하나씩 설명 드리고자 합니다.


 포스트 제목 물결무늬 플래시로 바꾸는 방법

물결무늬 플래시로 제목을 바꾸기 위해서는 skin. html 소스를 수정  & 추가를 해야 한다.


우선 물결무늬 플래시 변경하기 위해성 위 관련 파일을 다운로드 해주세요.
파일 압축을 풀면 다음과 같은 파일이 있습니다.


viewTitle.js , view Title.swf  2개의 파일을 skin. html 업로드 해야 합니다.

업로드 하기 위해 티스토리 관리자 모드로 접속 해주세요.

HTML/CSS 편집 클릭.

   
검색 Ctrl + F 하셔서 

article_rep_title       <=== 요 항목을 검색해 주세요.




article_rep_title  소스 수정을 할 때, 1번 작업으로 제목의 물결무늬로 바뀌지 않습니다. 
article_rep_title  검색 하시면 1개 더 있습니다. 총 2번의 작업을 하셔야 완벽하게 포스트 제목이 물결무늬 플래시가 적용이 됩니다.

 
첫 번째 article_rep_title  소스 수정 위치


<h2><a href="[##^_article_rep_link_^##]">[##^_article_rep_title_^##]</a></h2> 앞뒤로 주석을 단후
새로운 소스를 넣어 주셔야 합니다.

1. 기존 소스를 <!-- 주석넣기 --> 주석 넣기로 블로그 해당 프로그램을 비 활성화시킴.
2.물결무늬 소스를 넣어 줍니다.


위 소스를 다운로드하셔서 사용 하시면 좀 더 편하게 작업 하실 수 있으십니다.

 
변경전 

첫번째 소스 삽입
<div class="entryProtected">
     <div class="titleWrap">         
     <h2><a href="[##^_article_rep_link_^##]">[##^_article_rep_title_^##]</a></h2>        <== 주석으로 비활성화 시켜야함
                                                                                                                           <== 이곳에 물결무늬 플래시 소스 삽입
 
      <span class="date">[##^_article_rep_date_^##]</span>
     </div>
     <p class="text">보호되어 있는 글입니다. <br />

( 소스중 ^ 은 예제를 보여주기 위해 적은 것이므로 실제 적용 시에는 꼭 ^삭제 하셔야 합니다. )


 
변경후 

첫 번째 소수 삽입
<div class="entryProtected">
     <div class="titleWrap">         
<!-- 기존 타이틀1 시작
     <h2><a href="[##^_article_rep_link_^##]">[##^_article_rep_title_^##]</a></h2>      
기존 타이틀1 종료 -->
<!-- 물결 플래시 타이틀1 시작 -->
<script language="javascript" src="./images/viewTitle.js" type="text/javascript" />
</script>
<script language="javascript" />
showTitle("./images/", "viewTitle.swf", 600, 30, "[##^_article_rep_title_^##]", "[##^_article_rep_link_^##]", "left", "#000000");
</script>
<!-- 물결 플래시 타이틀1 종료 -->
      <span class="date">[##^_article_rep_date_^##]</span>
     </div>
     <p class="text">보호되어 있는 글입니다. <br />

( 소스중 ^ 은 예제를 보여주기 위해 적은 것이므로 실제 적용 시에는 꼭 ^삭제 하셔야 합니다. )



두 번째 article_rep_title  소스 수정 위치


<h2><a href="[##^_article_rep_link_^##]">[##^_article_rep_title_^##]</a></h2> 앞뒤로 주석을 단후
새로운 소스를 넣어 주셔야 합니다.

   
변경전 

두 번째 소스 삽입
<div class="entry">
     <div class="titleWrap">
     <h2><a href="[##^_article_rep_link_^##]">[##^_article_rep_title_^##]</a></h2>    <== 주석으로 비활성화 시켜야함
                                                                                                                 <== 이곳에 물결무늬 플래시 소스 삽입


      <span class="category"><a href="[##^_article_rep_category_link_^##]">[##^_article_rep_category_^##]</a> </span>
      <span class="date">[##^_article_rep_date_^##]</span>

( 소스중 ^ 은 예제를 보여주기 위해 적은 것이므로 실제 적용 시에는 꼭 ^삭제 하셔야 합니다. )


   
변경전 

두 번째 소스 삽입
<div class="entry">
     <div class="titleWrap">
<!-- 기존 타이틀2 시작
     <h2><a href="[##^_article_rep_link_^##]">[##^_article_rep_title_^##]</a></h2>
기본 타이틀2 종료 -->
<!-- 물결 플래시 타이틀2 시작 -->
<script language="javascript" src="./images/viewTitle.js" type="text/javascript" />
</script>
<script language="javascript" />
showTitle("./images/", "viewTitle.swf", 600, 30, "[##^_article_rep_title_^##]", "[##^_article_rep_link_^##]", "left", "#000000");
</script>
<!-- 물결 플래시 타이틀2 종료 -->
      <span class="category"><a href="[##^_article_rep_category_link_^##]">[##^_article_rep_category_^##]</a> </span>
      <span class="date">[##^_article_rep_date_^##]</span>

( 소스중 ^ 은 예제를 보여주기 위해 적은 것이므로 실제 적용 시에는 꼭 ^삭제 하셔야 합니다. )


두 번째 소스 까지 변환이 완료 되었다면. 저장하시기 전에 미리보기를 통해서  먼저 체크 해보세요.

<h2><a href="[##^_article_rep_link_^##]">[##^_article_rep_title_^##]</a></h2> 이소스는 스킨에 따라 살짝 다를 수 있지만 그렇게 큰 차이는 나지 않습니다. 초보자님도 충분히 따라 하실 수 있습니다.  물결무늬 소스 txt 파일을 첨부 해놨습니다. 

이상 물결무늬 플래시 제목 변경법을 마치겠습니다.

   
관련 글 & 도움이 되는 글

- 티스토리 제목 색상 바꾸기 2가지 방법

- 티스토리 블로그 이미지 테두리 없애는 방법 TIP
- 티스토리 블로그 스크롤바 색상 변경하는 법 !
- 티스토리 블로그 댓글창 스크롤바 넣어보자.
- 티스토리 댓글창 위치 변경하는 법!

- 검색엔진 최적화하는 방법01 - 타이틀 순서 변경
- 검색엔진 최적화하는 방법02 - 페이지 로딩 속도 개선 방법
- 검색엔진 최적화하는 방법03 - 구글 검색엔진 메타태그 설치
- 구글 웹로그 분석 Google Analytics 설치방법
- 구글 애드센스 단가 알아보기.
- 구글 애드센스 광고위치 내 맘대로 상단 하단 변경
- 애드센스 광고위치 변경 좌측 우측에 애드센스 넣기
- 애드센스 와 뷰 애드박스 동시에 달아보자.

- 블로그 사용 중인 광고용어 정리
- 블로그 자신의 SEO 지수 확인 사이트!



 


 


쿨펀치의 세상리뷰 는 여러분의 소중
댓글과 VIEW ON 클릭 구독 클릭이 큰힘이되어.
더 좋은 블로그를 만들 수 있게 하는 원동력이 됩니다.  

반응형

댓글