|
|
|
|
|
|
예를 들면,
제목 : 큰제목
내용 :
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=[##_article_rep_link_##]&detailText=" name="FlashVars" />
<embed flashvars="isContent=Y&titleText=출력할타이틀부분&titleLink=[##_article_rep_link_##]&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=[##_article_rep_link_##]&detailText=" name="FlashVars" /><embed flashvars="isContent=Y&titleText=출력할타이틀부분&titleLink=[##_article_rep_link_##]&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.rarHTML 를 체크합니다. 하단 부분쯤에 출력할타이틀부분 2개 부분을 원하는 소제목으로 변경을 해줍니다.
(예) 출력할타이틀부분 → 나 글쓰는 중 말리지 마!
나 말리지 말라고 했지? 말리지 마요!!~ 라고 저는 입력했습니다.
HTML 체크를 다시 해제한뒤 소제목 아래에 본문에 해당하는 글을 적고 글을 완성해 나갑니다. 소제목 아래에 또 다른 소제목이 있어야한다면 위에 과정을 다시 반복해서 또 소제목을 입력해줍니다.
글을 모두 완성한 뒤, 저장하기를 하면 플래쉬 타입의 Object 에 입력했던 글들이 나타납니다. 완성!
* 넉두리
처음에 이부분을 따서 만들때 고민을 좀 많이 했습니다. 조금 쉽게 사용가능하게 하려고 스크립트를 썻지만, 그렇게 할 경우에는 글을 길게 적었을때, 어느부분에 소제목을 추가했는지 나타나지 않으니 알 수 가 없더군요. 그래서 <embed> 부분은 꼭 살아있어야했는데 그래서 어쩔 수 없이 코드가 전체적으로 다 들어가도록 만들어서 서식을 만들었습니다. 덕분에 소제목을 2번 입력해야하는 수고는 있지만, 소제목 2번만 입력하면 깔끔하게 플래쉬 소제목이 뜨는군요.
<embed> 태그만 바로 쓰는것보다는 <object> 태그로 묶어서 사용하는게 아무래도 더 좋기에 (여러 브라우저에서 통용하기 위해서) 가능한 에러가 안나도록 만들어보았습니다.
정말 여러가지 실험을 해봤네요. 좀 쉽게 쓰게끔 만들어보려고했는데 계속 벽에 부딪치네요. 한참 스크립트를 만들어놓고 돌리니 FF 에서는 잘 되지만 IE 에서는 출력이 안되고 또는 서식이 재대로 동작을 안하고.. 지금 이코드는 IE,FF 둘다 잘 돌아가는걸 확인했습니다.
플래쉬파일도 사실 제가 게시물에 넣어둔것을 끌어가는 형태이기때문에 스킨에 업로드해놓은것보다 가벼울듯하네요.
스킨에 올려놓는다면 항상 로드하기 때문에 무거워질테니까요. 플래쉬파일은 삭제하거나 하진 않겠지만 꼭 불안하신분은
파일을 압축해서 올릴테니 자신의 계정에 업로드 후 경로를 따서 코드를 수정하시기 바랍니다.
플래쉬타입의 제목을 블로그의 본문글 제목으로 사용하는경우도 있는데요(스킨) 이경우에는 SEO 때문에 좀 신경을 써 주어야할듯합니다. 좀 찾아보니 플래쉬글자는 당연 Object 이기때문에 검색사이트에 검색이 안된다고 하는글이 보이네요. 저는 본문에 플래쉬 제목을 넣은것이기때문에 이것과는 무관합니다.
처음에 이부분을 따서 만들때 고민을 좀 많이 했습니다. 조금 쉽게 사용가능하게 하려고 스크립트를 썻지만, 그렇게 할 경우에는 글을 길게 적었을때, 어느부분에 소제목을 추가했는지 나타나지 않으니 알 수 가 없더군요. 그래서 <embed> 부분은 꼭 살아있어야했는데 그래서 어쩔 수 없이 코드가 전체적으로 다 들어가도록 만들어서 서식을 만들었습니다. 덕분에 소제목을 2번 입력해야하는 수고는 있지만, 소제목 2번만 입력하면 깔끔하게 플래쉬 소제목이 뜨는군요.
<embed> 태그만 바로 쓰는것보다는 <object> 태그로 묶어서 사용하는게 아무래도 더 좋기에 (여러 브라우저에서 통용하기 위해서) 가능한 에러가 안나도록 만들어보았습니다.
정말 여러가지 실험을 해봤네요. 좀 쉽게 쓰게끔 만들어보려고했는데 계속 벽에 부딪치네요. 한참 스크립트를 만들어놓고 돌리니 FF 에서는 잘 되지만 IE 에서는 출력이 안되고 또는 서식이 재대로 동작을 안하고.. 지금 이코드는 IE,FF 둘다 잘 돌아가는걸 확인했습니다.
플래쉬파일도 사실 제가 게시물에 넣어둔것을 끌어가는 형태이기때문에 스킨에 업로드해놓은것보다 가벼울듯하네요.
스킨에 올려놓는다면 항상 로드하기 때문에 무거워질테니까요. 플래쉬파일은 삭제하거나 하진 않겠지만 꼭 불안하신분은
파일을 압축해서 올릴테니 자신의 계정에 업로드 후 경로를 따서 코드를 수정하시기 바랍니다.
플래쉬타입의 제목을 블로그의 본문글 제목으로 사용하는경우도 있는데요(스킨) 이경우에는 SEO 때문에 좀 신경을 써 주어야할듯합니다. 좀 찾아보니 플래쉬글자는 당연 Object 이기때문에 검색사이트에 검색이 안된다고 하는글이 보이네요. 저는 본문에 플래쉬 제목을 넣은것이기때문에 이것과는 무관합니다.
아 참고로 피드버너가 100명이 넘었네요 구독자분들께 감사드립니다. 조만간 선물 행사를 해야겠네요 ^^
|
|
|
|
|
|
'유용한_팁 > 블로그_팁' 카테고리의 다른 글
| 블로그 방문자 늘리기 - 주제에 맞는 스킨, 꾸미자 (16) | 2009.09.06 |
|---|---|
| 블로그 방문자 늘리기 - 블로그 처음 시작 하기 (10) | 2009.09.06 |
| 블로그 서식 꾸미기 #2 - 플래쉬 소제목 활용하기 (동영상) (81) | 2009.09.01 |
| 트위터카운터(Twittercounter)를 자신의 트위터로 바로 연결하기 (24) | 2009.08.31 |
| 티스토리 블로그 스킨 분석해보자 - 둘째편 (68) | 2009.07.23 |
| 티스토리 블로그 스킨 분석해보자 - 처음편 (70) | 2009.04.21 |
TAG Blog Tip,
It,
동영상,
동영상 강의,
동영상강의,
블로그,
블로그 서식,
블로그 팁,
블로그팁,
서 식,
서식,
서식 공유,
서식 꾸미기,
서식 블로그,
서식공유,
서식꾸미기,
서식이란,
서식이란?,
자축,
티스토리 서식,
티스토리서식,
프리셋,
피드100돌파
Rss 2.0
우왕 !! 정말 쉽게 설명해주셔서 감사합니다 ㅠㅠ..
아, 혹시 이거 폰트를 바꿀 수 있는 건가요? 바꿀 수 있다면 어떻게 바꾸나요?
블로그 시작한지 얼마 안됬는데 여기서 도움이 많이 되었어요 ㅎㅎ
좋은 정보 받아갑니다. ^^
감사합니다^^
너무 궁금했던 유용한 정보에요! +_+ 우왕! 잘 보고 갑니다. 앞으로도 유용한 정보 많이 올려 주세요!
비밀댓글입니다
우와.. 어떻게 이런 대단한 걸 만드시는지요~
소중히 사용할게요. 감사합니다! ^_^
유용하게 사용하세요 ^^ 즐거운 밤 되시구요 ^^
정말 유용한 정보 잘보고 갑니다
인용구 관련 그림을 찾다가 또 훌륭한 팁 발견했네요...
제가 필요한 기능만 포스팅하셨네여...
정말 유용했습니다.
감사합니다.
운전 조심하세요~^^
소제목 서식을 찾아 헤매다가 정말 좋은 것을 발견했네요^^
테스트로 적용해보니까 아주 예쁘고 보기 좋은 것 같아요~
유용한 tip 잘 얻어갑니다!
와우, 이렇게 간단하게 적용할 수 있게 해주셔서 감사합니다. 잘 활용하겠습니다^^
완전 감사합니다.ㅠㅠ
정말 좋은거 배워가네요...
당장 실행해봐야겠어요^^
아~~ 정말 너무 감사한 팁입니다. ㅠ
이런 스타일을 하고 싶었는데, 이렇게 가져다가 쓰면,,,그냥 거저 먹는거니, 죄송스럽고,;
감사하고 그러네요 ㅠ.
잘 쓰겠습니다!!
블로그 초보입니다. 블로그 디자인을 수정하려고...
1. 제목을 강조하고싶어서요. LG 블로그처럼.. 여기선 플래시 썻더군요. 내용 잘 참고할께요.
2. 중간제목도 강조하고 싶어서요.
테스트 해보고 다른방법도 찾아볼려 합니다.
이런 정보 공개가 참으로 감사합니다.
(질문이 있습니다) 씨디맨님 유용한 정보 감사합니다. 다름이아니라 플래쉬파일을 스킨에 업로드하고 사용할려고 합니다. 근대 어떤 부분의 내용(소스)를 수정해야 되는지 모르겠습니다. 도와주세요!
제가 할 수 있는 설명은 이 글에 모두 다 있습니다. 이글을 천천히 정독하시고 아래에 동영상도 보시면 아마 가능하실겁니다. 실제로 아주 초보자 분들을 위해서 적어둔 글입니다. 아래 동영상만 먼저 보시는것도 도움이 됩니다.
답글 감사합니다. 제가 너무 서툴게 봤나봐요. 알려주셔서 고맙습니다.
멋지신 시디맨님,
적용 했어요. 신나요! 야호! :D
감사합니다.
좋은 정보 감사합니다.^^*
그런데 소제목 색깔을 바꾸려면 더떤걸 만져야 하나요?
자세히 봐도 칼라 라는 부분이 없어서요
혹시나 싶어 출력할 타이틀부분에 제목 치환자를 넣고 시험해보니 제목으로도 뜨네요~ 웹폰트를 적용하고 싶었는데 번번이 실패했었거든요ㅠㅠ 대신 이 방법으로 제목에 멋진 폰트로 출력할수 있어서 좋으네요~ 좋은 정보 감사합니다!
폰트나 색상을 변경하고 싶은데 어디를 손봐야 할지 모르겠습니다. HTML 서식에서는 폰트와 색상에 대해서 없는거 보니 플래쉬 파일에 정해진 대로만 가능한건가요? 혹 괜찮으시다면 저만의 플래쉬를 만들어 보고싶은데 그거에 관한 포스팅이 가능할까요?
컬러도 가능은 한걸로 압니다. 다만 저도 정보를 다 가지고 있진 않습니다. 만들어놓은 용도를 벗어나서 따로 빼서 쓰는것이라서요.
궁금한게.,핸드폰에서 볼 수 있나요??
플래시로 된 거요^^
이 글을 쓸 당시에는 나왔지만 지금은 안되므로 가능하면 hx 태그를 쓰시는게 좋습니다.