예를 들면,
제목 : 큰제목
내용 :
1. 소제목입니다.
내용 :
1. 소제목입니다.
어쩌고 저쩌고 어쩌고 저쩌고
2. 소제목 2입니다.
어쩌고 저쩌고 어쩌고 저쩌고
이렇게 글을 쓸 수있겠죠. 이때 소제목에 해당하는 부분을 플래쉬 글꼴로 나타나도록 서식을 만드는 방법에 대해서 설명하고 쓰는 방법을 공유하겠습니다. 서식을 만드는것은 코드를 복사한뒤 붙여넣고 서식을 만든뒤, 글을 쓸때 서식을 불러와서 소제목을 입력해주기만 하면 됩니다. 참 쉽죠.
먼저 사용 예시를 보여드리겠습니다.
글 본문 부분입니다
11111111111111111111111111111111111111111111111111111111111111111111111111111111111111
11111111111111111111111111111111111111111111111111111111111111111111111111111111111111
11111111111111111111111111111111111111111111111111111111111111111111111111111111111111
22222222222222222222222222222222222222222222222222222222222222222222222222222222222222
22222222222222222222222222222222222222222222222222222222222222222222222222222222222222
22222222222222222222222222222222222222222222222222222222222222222222222222222222222222
지금 이것은 서식에서 불러와서 간단히 제목에 해당하는 부분만 입력하고 완성한것입니다. 복잡한 설정으로 만든것이 아니라는것이죠.
그림으로도 처리할 수 있겠지만, 포토샵이나 기타 툴을 이용해서 만들고 업로드하고 좀 복잡하겠죠? 근데 쉽게 하는 방법이 있습니다.
포토샵 NO , 복잡한것 NO
급하신분은 맨아래 동영상파일을 다운로드 후 압축 해제해서 보세요. 바로 이해가 가실겁니다.
<object height="50" width="600" align="middle" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000">
<param value="always" name="allowScriptAccess" />
<param value="http://cdmanii.com/attachment/cfile10.uf@116B5E214A9910892D2C30.swf" name="movie" />
<param value="transparent" name="wmode" />
<param value="false" name="menu" />
<param value="high" name="quality "/>
<param value="isContent=Y&titleText=출력할타이틀부분&titleLink=&detailText=" name="FlashVars" />
<embed flashvars="isContent=Y&titleText=출력할타이틀부분&titleLink=&detailText=" height="50" width="600" align="middle" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" allowscriptaccess="always" name="title_flash" quality="high" menu="false" wmode="transparent" src="http://cdmanii.com/attachment/cfile10.uf@116B5E214A9910892D2C30.swf" /></object>
먼저 위에 코드를 복사를 합니다.
 |
티스토리 관리자 페이지 > 글쓰기 > 서식 체크 > HTML 체크 > 서식 제목 입력 > 복사한 코드를 내용에 붙여넣기 > 저장하기
위와 같이 서식을 저장을 합니다. 서식 제목은 햇갈리지 않게 자세히 적어서 입력해 둡니다. 서식은 글관리에서 언제든 불러와서
편집 가능합니다.
 |
티스토리 관리페이지에서 글 쓰기를 합니다. 서식에 위에 과정에서 만들어두었던 서식을 확인합니다.
 |
미리 만들어둔 서식을 불러오기를 합니다. 서식을 불러올까요? 물음에 예를 누릅니다.
 |
서식이 불러와지면 저렇게 Object 가 생성됩니다. 생성되지 않고 실패한다면 다시 서식을 불러옵니다.
 |
<object height="50" width="600" align="middle" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"><param value="always" name="allowScriptAccess" /><param value="http://cdmanii.com/attachment/cfile10.uf@116B5E214A9910892D2C30.swf" name="movie" /><param value="transparent" name="wmode" /><param value="false" name="menu" /><param value="high" name="quality "/><param value="isContent=Y&titleText=출력할타이틀부분&titleLink=&detailText=" name="FlashVars" /><embed flashvars="isContent=Y&titleText=출력할타이틀부분&titleLink=&detailText=" height="50" width="600" align="middle" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" allowscriptaccess="always" name="title_flash" quality="high" menu="false" wmode="transparent" src="http://cdmanii.com/attachment/cfile10.uf@116B5E214A9910892D2C30.swf" /></object>
<!-- 코드설명 -->
<!-- 초보자를 위한 설명 : 출력할타이틀부분 2부분만 수정해서 사용하세요. 아래설명은 패스* -->
<!-- 출력할타이틀부분 은 소제목 타이틀 부분입니다. 이부분이 플래쉬 글자로 나타나게 됩니다. 2부분 모두 같은 제목으로 수정해줍니다. width="600" 은 넓이 부분입니다. 기본적으로 600 사이즈로 해놓았지만 자신의 블로그가 좀 더 넓고 글자를 길게 넣고 싶은경우에는 넓게 수정하세요. 플래쉬 주소 부분은 기본적으로 제가 저 플래쉬를 지우지 않을것이기에 변경하지 않아도 상관없지만, 따로 플래쉬파일을 자신의 블로그에 업로드 해놓고, 사용하고 싶다면 아래의 플래쉬 파일을 다운로드 후 자신의 계정에 업로드 한뒤 플래쉬 주소를 수정한뒤 사용하세요. -->
 subtitle.rar |
HTML 를 체크합니다. 하단 부분쯤에 출력할타이틀부분 2개 부분을 원하는 소제목으로 변경을 해줍니다.
(예) 출력할타이틀부분 → 나 글쓰는 중 말리지 마!
 |
나 말리지 말라고 했지? 말리지 마요!!~ 라고 저는 입력했습니다.
 |
HTML 체크를 다시 해제한뒤 소제목 아래에 본문에 해당하는 글을 적고 글을 완성해 나갑니다. 소제목 아래에 또 다른 소제목이 있어야한다면 위에 과정을 다시 반복해서 또 소제목을 입력해줍니다.
 |
글을 모두 완성한 뒤, 저장하기를 하면 플래쉬 타입의 Object 에 입력했던 글들이 나타납니다. 완성!
* 넉두리
처음에 이부분을 따서 만들때 고민을 좀 많이 했습니다. 조금 쉽게 사용가능하게 하려고 스크립트를 썻지만, 그렇게 할 경우에는 글을 길게 적었을때, 어느부분에 소제목을 추가했는지 나타나지 않으니 알 수 가 없더군요. 그래서 <embed> 부분은 꼭 살아있어야했는데 그래서 어쩔 수 없이 코드가 전체적으로 다 들어가도록 만들어서 서식을 만들었습니다. 덕분에 소제목을 2번 입력해야하는 수고는 있지만, 소제목 2번만 입력하면 깔끔하게 플래쉬 소제목이 뜨는군요.
<embed> 태그만 바로 쓰는것보다는 <object> 태그로 묶어서 사용하는게 아무래도 더 좋기에 (여러 브라우저에서 통용하기 위해서) 가능한 에러가 안나도록 만들어보았습니다.
정말 여러가지 실험을 해봤네요. 좀 쉽게 쓰게끔 만들어보려고했는데 계속 벽에 부딪치네요. 한참 스크립트를 만들어놓고 돌리니 FF 에서는 잘 되지만 IE 에서는 출력이 안되고 또는 서식이 재대로 동작을 안하고.. 지금 이코드는 IE,FF 둘다 잘 돌아가는걸 확인했습니다.
플래쉬파일도 사실 제가 게시물에 넣어둔것을 끌어가는 형태이기때문에 스킨에 업로드해놓은것보다 가벼울듯하네요.
스킨에 올려놓는다면 항상 로드하기 때문에 무거워질테니까요. 플래쉬파일은 삭제하거나 하진 않겠지만 꼭 불안하신분은
파일을 압축해서 올릴테니 자신의 계정에 업로드 후 경로를 따서 코드를 수정하시기 바랍니다.
플래쉬타입의 제목을 블로그의 본문글 제목으로 사용하는경우도 있는데요(스킨) 이경우에는 SEO 때문에 좀 신경을 써 주어야할듯합니다. 좀 찾아보니 플래쉬글자는 당연 Object 이기때문에 검색사이트에 검색이 안된다고 하는글이 보이네요. 저는 본문에 플래쉬 제목을 넣은것이기때문에 이것과는 무관합니다.
처음에 이부분을 따서 만들때 고민을 좀 많이 했습니다. 조금 쉽게 사용가능하게 하려고 스크립트를 썻지만, 그렇게 할 경우에는 글을 길게 적었을때, 어느부분에 소제목을 추가했는지 나타나지 않으니 알 수 가 없더군요. 그래서 <embed> 부분은 꼭 살아있어야했는데 그래서 어쩔 수 없이 코드가 전체적으로 다 들어가도록 만들어서 서식을 만들었습니다. 덕분에 소제목을 2번 입력해야하는 수고는 있지만, 소제목 2번만 입력하면 깔끔하게 플래쉬 소제목이 뜨는군요.
<embed> 태그만 바로 쓰는것보다는 <object> 태그로 묶어서 사용하는게 아무래도 더 좋기에 (여러 브라우저에서 통용하기 위해서) 가능한 에러가 안나도록 만들어보았습니다.
정말 여러가지 실험을 해봤네요. 좀 쉽게 쓰게끔 만들어보려고했는데 계속 벽에 부딪치네요. 한참 스크립트를 만들어놓고 돌리니 FF 에서는 잘 되지만 IE 에서는 출력이 안되고 또는 서식이 재대로 동작을 안하고.. 지금 이코드는 IE,FF 둘다 잘 돌아가는걸 확인했습니다.
플래쉬파일도 사실 제가 게시물에 넣어둔것을 끌어가는 형태이기때문에 스킨에 업로드해놓은것보다 가벼울듯하네요.
스킨에 올려놓는다면 항상 로드하기 때문에 무거워질테니까요. 플래쉬파일은 삭제하거나 하진 않겠지만 꼭 불안하신분은
파일을 압축해서 올릴테니 자신의 계정에 업로드 후 경로를 따서 코드를 수정하시기 바랍니다.
| subtitle.rar |
플래쉬타입의 제목을 블로그의 본문글 제목으로 사용하는경우도 있는데요(스킨) 이경우에는 SEO 때문에 좀 신경을 써 주어야할듯합니다. 좀 찾아보니 플래쉬글자는 당연 Object 이기때문에 검색사이트에 검색이 안된다고 하는글이 보이네요. 저는 본문에 플래쉬 제목을 넣은것이기때문에 이것과는 무관합니다.
아 참고로 피드버너가 100명이 넘었네요 구독자분들께 감사드립니다. 조만간 선물 행사를 해야겠네요 ^^
'Useful Tips > BlogTip' 카테고리의 다른 글
| 블로그 방문자 늘리기 - 주제에 맞는 스킨, 꾸미자 (12) | 2009/09/06 |
|---|---|
| 블로그 방문자 늘리기 - 블로그 처음 시작 하기 (5) | 2009/09/06 |
| 블로그 서식 꾸미기 #2 - 플래쉬 소제목 활용하기 (동영상) (60) | 2009/09/01 |
| 트위터카운터(Twittercounter)를 자신의 트위터로 바로 연결하기 (22) | 2009/08/31 |
| 블로그 서식 꾸미기 #1 (동영상) (21) | 2009/08/16 |
| 티스토리 블로그 스킨 분석해보자 - 둘째편 (56) | 2009/07/23 |
TAG Blog Tip,
It,
동영상,
동영상 강의,
동영상강의,
블로그,
블로그 서식,
블로그 팁,
블로그팁,
서 식,
서식,
서식 공유,
서식 꾸미기,
서식 블로그,
서식공유,
서식꾸미기,
서식이란,
서식이란?,
자축,
티스토리 서식,
티스토리서식,
프리셋,
피드100돌파
Rss 2.0
그렇케 하면 포스트가 보기 좋아 보일것 같음..- 실천 하기가 조금 귀찮아짐.
시간 나실때 한번 해보세요 ^^ 조금 더 편하게 만들어 보고싶었는데 잘 안되어서 조금 아쉽네요.
구차니즘에 굴복하는 착한 어린이라서 포기입니다 ㅋㅋ
그래도 한번 해봐주세요 ㅋ 어제 이거 새벽 2시까지 글 썻네요 -_-;;
근데 글 쓰고 나서 생각해보니 조금 더 쉽게 적용할 방법이 생각 나버렸네요. 코딩은 더 훨씬 복잡해지겠지만 쓰는건 더 간단하게 ..
다음에 다시 포스팅해봐야겠어요.
오~ 요것 완전 좋은데요... +_+ 김군이 찾아 헤메이던 바로 그서식! 아하하~ 감사 :)
플래쉬 타이틀 스킨있죠. 거기있는것의 응용입니다 ㅎ 근데 플래쉬 타이틀경우는 H1 테그를 쓰는게 아니라 타이틀이 플래쉬로 나타나는거라 검색에서는 조금 불리 할 수 있다네요. 타이틀은 그냥 H1 테그 (기본) 으로 쓰고 이렇게 소제목에만 적용하는게 좋은듯해요.
png파일이나 플래쉬로 소제목을 넣을 수 없을까 고민했었는데 방법이 있었네요~^^
좋은 정보 담아갑니다. 꼭 시도해 볼께요~:)
넵 꼭 시도해봐주세요 ^^ 다음에 좀 더 편하게 쓸 수 있는거 올려볼께요 ^^
옷.. 이렇게 좋은 팁을 ㅎㅎ
저도 응용해봐야겠습니다^^
본문이 흰색인 분들께는 아주 딱인듯해요. 그런데 이미 소제목 멋진 서식 가지고 계시네요. 간혹 새로운 분위기 낼때는 한번 써봐주세요 ^^
괜찮네요...
좋은 팁 감사합니다. ^^
괜찮죠 그쵸 ? ㅎ 저 어제 이거 써놓고 발행하고 싶어서 죽겠더라구요 ;
대박입니다! 와.. html코딩 되게 잘하시나봐요
상당히 블로그가 깔끔하네요!
본받고싶습니다
아직 초보입니다 ^^;; 다음에 더 좋은 팁 써볼께요 ㅎ
오홍~! 검색용, 발행용 제목을 한방에 해결할 수 있군요~! ㅋㅋ
좋은 정보 감사합니다 ㅎㅎ
그렇죠 ㅎ 타이틀은 안건드리고 소제목에 활용하므로서 검색에도 유리하고 소제목이 이쁘게 출력되기도 하구요 ㅎ
다음에는 좀 더 코딩을 복잡하게 짜서 간단하게 쓸 수 있고 글꼴체도 바꿀 수 있게 만들어보려구요. 다음 포스팅 기대해주세요 ㅎ
오 .. 저도 몰랐던 거였고, 사용도 하지 않았는데.이렇게 보니 참 유용하군요. 감사합니다. 잘 보고 배울게요.
천천히 한번 해보시면 그다음부터 쓰시는건 너무 쉬울거에요. 원래 서식이란게 만드는것만 복잡하고 쓰는건 간단하니까요 ^^
완전 대박인데요...
이렇게도 만들수가 있군요~^^
넵 ㅎ 근데 글 쓰고 나서 더 좋은 아이디어가 떠올랐네요 -_-;; 다음에 포스팅 한번 더 해볼께요 ㅎ
ㅎㅎ 신기하네요 ..@@ ^^
꼭 한번 써보세요 직접 써보면 더 신기합니다 ㅋ
고맙습니다. 좋은 정보;;
Q/A에 댓글을 남겼다가; 어라? 하는 기분에 다시 보니...성격이 맞지 않는 종류의 글이라 삭제하고 다시..(.....);;구경 잘 하고 가요~ 종종 배우러 올게요.
댓글 감사합니다 ^^ Q/A 는 방명록 역할도 같이 하고 있어요. 맘것 댓글이나 방명록 남기셔도 됩니다 ^^
좋은 팁이네요~
유용하게 써먹을수 있겠다능...^^
그렇죠? ㅎ 다음에는 좀 더 개선된 팁 올려볼께요 ^^
좋은 팁 잘 보고 갑니다^^
감사합니다 (__)
우왕~ 좋은 팁 너무 감사드려요~
저도 써먹어야겠습니다..^^
꼭 한번 써보세요 ^^
Hi,
I have already seen it somethere...
Joker
Hi Joker
But it is subtitle of flash program.
:)
Thanks your comment.
플래쉬 글자 간지나서 쓰려는 데 이렇게 쉽게 가능하다니 ㅋㅋ
서식으로 만들어서 불러오고 또쓰고~ 잘쓸께요
오키오키
오호 좋은 팁이네요~!! 몰랐던 사실~
쑥스럽습니다 ^^; 블로그강좌 기대할께요 !
소제목 넘 멋져요~ +_+
전 소제목 서식을 못 넣어서, 늘 숫자 붙이고
박스속에 집어넣고 있는데....
유용한 팁 알려주셔서 감사합니다! ^^
멋지죠 ? ㅎ 다음에는 좀더 기능이 보강된 소제목 만들어서 올려볼께요 ㅎ
오옷 !!!! 소제목 필요하신분들 유용하겠어요 ! ㅋㅋ
그렇죠? ㅎ 다음에는 좀 더 기능을 많이 넣어서 만들어보려구요. 쓰는것도 간단하게..
그리고 동기님 올리신 서식도 봤어요 깔끔하고 너무 좋아요 ~
cdmanii님.. 엄청난 능력의 소유자셨군요...
멋쟁이 -ㅅ-b
감사합니다 ^^;;;
서식 퍼갑니다. 좋은 정보 감사합니다. 휴일 잘 보내세요.
휴일이 벌써 지났네요. 댓글 늦게 달아드려서 죄송해요 ~ ㅎ 즐거운 한주 시작하세요 !~
헐.. 티스토리에 서식 저장기능이 있었군요;;
소스를 매번 넣어야 하는 번거로움이 있을 것 같아, 알아도 쓰지 않을 것 같았는데;;
서식이란 게 있으니 해 볼만 할 것 같은데요?ㅋ
한 번 해봐야겠습니다. 좋은 정보 고맙습니다~^^ㅋ
서식 잘 꾸며두면 편리합니다 ^^ 만들기는 번거롭지만 쓰는건 최고죠 ㅎ
너무 마음에 들어서 적용해 보았는데
제가 지금 사용하고 있는 소제목 라인이랑 거리가 너무 떨어져서 나타나네요 ㅠ
그래서 높이 사이즈를 줄이니 받침이 없는 글자는 예쁘게 잘나오는데 받침이 있는 글자는 잘려서 나와요 ㅋ
아이고 ... 아까브라 ... ㅠㅠ
적용해두신거 봤습니다 ^^ 플래쉬가 높이(height) 는 50으로 정해져있는듯하더라구요. 줄이면 글자가 짤릴겁니다. 아래에 스타일바를 두셨지만 바짝 붙여도 좀 떨어져서 보일겁니다. 플래시 높이가 50 이지만 글자가 상중하 중 중간에 뜨거든요. 어쩔 수 가 없는... 그래도 지금 잘 적용시켜두셨네요.
감사합니다.
기회가 되면 한번 응용해 보고 싶네요. ^^
좀 부곽시키고 싶은 부분에 써보세요 괜찮아요 ㅋ
저처럼 html 전혀 모르는 사람이 봐도 쏙쏙 다가오게 적어주셨네요 쌩유~~ 블로그 깔끔하게 적고 싶은데 어렵웠는데 좋은 팁 배우고 갑니다. 정말 고맙습니다^^
잘 정리됬다고 해주시니 기분이 좋네요 ^^ 다음에는 좀 더 진화된 서식 올려볼께요 ^^
우와.. 어떻게 이런 대단한 걸 만드시는지요~
소중히 사용할게요. 감사합니다! ^_^
유용하게 사용하세요 ^^ 즐거운 밤 되시구요 ^^
넘 이뽀여 ㅋㅋ
지금 막 적용했어요..
잘쓸께요..
깔끔하게 잘 적용하셨네요 ^^ 즐거운 하루되세요 ^^
전 이것이 적용이 안되는데요.
다른 것하고 충돌이 생기는지 잠시 보였다가 플래시로 "und"라는 글자만 나오네요.
글을 하나 작성후 서식을 써서 내용을 적구요. 예약발행으로 과거 날자로 하나 공개 한뒤에 주소알려봐주세요. 제가 한번 내용을 볼게요. ^^
우왕 !! 정말 쉽게 설명해주셔서 감사합니다 ㅠㅠ..
아, 혹시 이거 폰트를 바꿀 수 있는 건가요? 바꿀 수 있다면 어떻게 바꾸나요?