http://badnom.com/777 을 봐주세요.
사진 한장짜리 밑에 캡션이랑 이미지 갤러리로 올린 사진의 캡션이랑 다르다는걸 알 수 있습니다.
그걸 같게 하고 싶습니다ㅠ.ㅠ/헬프미~
사진 한장짜리 밑에 캡션이랑 이미지 갤러리로 올린 사진의 캡션이랑 다르다는걸 알 수 있습니다.
그걸 같게 하고 싶습니다ㅠ.ㅠ/헬프미~
지금은 w0rm9님께서 이미 저 문제를 해결하셨으므로, 저는 제 test블로그를 캡쳐했습니다.
이것은 티스토리에서 기본으로 제공되는 이미지 아래의 자막입니다.
이것은 이미지갤러리의 자막입니다.
이미지 자막은 연회색, 이미지 갤러리의 자막은 연청색인 것을 알 수 있으며, 이는 스킨이 변경되어도 바뀌지 않습니다. 그러므로 어두운 색이나 푸른 계통의 스킨을 쓰시는 분들에게는 상당히 불편하겠지요.
글씨체는 고사하고, 색상조차 바꾸지 못한다면 너무 큰 불편이겠죠?
좀 더 편리한 티스토리 생활을 위해서 여기 저기 검색을 하다 보니 저랑 비슷한 궁금증을 가진 분이 딱! 한 분 게시더군요. 바로 Soon-il DDang님이신데요, 이 분께서 태터툴즈 포럼 게시판에 이에 대한 글을 올리셨습니다.
Soon-il DDang님의 글 중에서 style.CSS 부분 인용했습니다. (도움 많이 주셔서 감사합니다.)
태터툴즈/텍스트큐브 기본 스타일 (이미지 캡션 스타일)
/* image caption style 이미지 아래 캡션 스타일 */
.cap1 { color:#fff; text-align:center;}
/* imageblock 그림 */
.imageblock { }/* align left 왼쪽 */
.left { }/* align center 가운데 */
.center { }/* align right 오른쪽 */
.right { }/* image 2 align 그림 2개 배치 */
.dual { background-color:#345; margin-bottom:5px;}/* image 3 align 그림 3개 배치 */
.triple { background-color:#345; margin-bottom:5px;}/* media 동영상 */
.mov {background: #345; margin-bottom: 5px;}
이 중에 우리에게 필요한 것은 이 부분입니다.
/* image caption style 이미지 아래 캡션 스타일 */
.cap1 { color:#fff; text-align:center;}
.cap1 { color:#fff; text-align:center;}
티스토리의 여러 스킨을 가지고 이것 저것 실험을 해본 결과 티스토리의 모든(?) 스킨에는 기본적으로 단일 이미지 아래에만 캡션 html태그를 제공하고, 여러 장을 한꺼번에 올릴 수 있는 이미지 갤러리에는 태그 자체가 없습니다. 하지만 티스토리에 안되는게 어딨니? 다 되지~ 우리는 갤러리 캡션을 입력만 해주면 되는 것입니다.
이것이 제 블로그 Style.css 의 기본 캡션 스타일입니다.
.cap1 { color:red; text-align:center; padding:4px 0; margin:0;}
이미지 갤러리에는 캡션 설정이 아예 없습니다만 다음을 입력하면 설정변경이 가능합니다.
요건 여러분 블로그의 .cap1 부분을 찾아서 고대로 복사해서 조금만 수정하면 됩니다.
.galleryCaption {color: blue !important; font-weight: bold; font-family: dotum, gulim, sans-serif !important; }
잘 살펴보시고, 필요한 부분만 고치시면 됩니다.
.cap1 - 한 장씩 올라오는 이미지의 캡션
{ color: red; ====> 색깔 변경
text-align:center; ====> 위치 변경
padding:4px 0;
margin:0;
font-weight: bold; ====> 굵기 변경
font-family: Gungsuh; } ====> 폰트 변경
이미지 한 장씩 수정하는 것과 달리 이미지 갤러리의 캡션 수정은 일반 html 태그를 입력해도 조정이 안되었습니다. 이유는 알 수 없으나 !중요하다고 ( !important ) 강조를 해주니까 되더군요.
.galleryCaption - 이미지 갤러리에서의 캡션
{ color: blue !important ;
font-weight: bold ;
font-family: verdana !important ; }
이렇게 수정을 해주고 나면 드디어 원하는 스타일의 자막/캡션을 얻을 수 있습니다.
궁서체로 고친 후의 이미지 자막
verdana로 고친 후의 이미지 갤러리 자막
어때요? 쉽죠??
여러분도 이젠 마음에 드는 글씨체와 색깔을 변경해보세요^^
여러분도 이젠 마음에 드는 글씨체와 색깔을 변경해보세요^^
'읽을 거리 > 블로그 이야기' 카테고리의 다른 글
| 블로그 통계분석: 2008년 2월, 재미있게 구경하세요^^ (40) | 2008/03/04 |
|---|---|
| 티스토리 편리한 로그인 방법 (현재 게시물에서 바로 로그인 등) 모두 소개 (58) | 2008/03/01 |
| 불펌방지 html 태그 - 티스토리 불펌 방지 플러그인보다 강력! (32) | 2008/03/01 |
| 이미지, 이미지갤러리(티스토리) 캡션/자막 수정하는 방법 (38) | 2008/02/18 |
| 블로그 통계 분석 2007년 11월~2008년 1월까지 (56) | 2008/02/14 |
| 너무 음란한 내 블로그? -_- (부제: 유입검색어 분석) (124) | 2008/01/30 |
| 펌질/불펌에 대한 단상 (부제: 절대바통 놀이 까칠맨님 바통터치) (72) | 2008/01/29 |
이 게시물이 도움이 되었다면 제 블로그를 한RSS로 구독해보세요.
댓글을 달아 주세요
오호라.......이런 방법이.......감사합니다 :-)
저는 본문 글자체와 갤러리 캡션이 달라서 이걸 쓰게 됏어요^^ 색깔은 기본으로 하고 폰트만 바꿨습니다.
티스토리 아직 배워야 할꺼 정말 많은것 같아요 ㅠㅠ
티스토리 진짜 골치아파요ㅡㅡ;
역시 배울게 많은 티스토리... 넘후 어렵다 ㅋ
넘 어려워서 티스토리 싫어!!를 외치다가도 무제한 용량을 생각하면 다시 겸허해지는 간사한 파란토마토입니다.ㅋㅋ
오~ 좋은 정보입니다..ㅎㅎ
떠먹여주는 듯한 곳도 좋긴 했지만,
티스토리의 찾아서 블로그 인테리어 하는 것도..ㅎㅎ 재밌더라구요.
솔직히 첨엔 좀 짜증났지만...
원래 역경이 있어야 열매가 단 법 아니겠습니까~ ㅋㅋㅋ
여기저기서 팁 얻어서 블로그 뚝딱뚝딱 하는 재미 쏠쏠하네요~
근데 이건 언제 실행해보나...항상 실행은 늦게 한다는 단점이..ㅡㅡ;
(참..저 파비콘이랑 아이콘 바꿔봤어요. 일단 실험이지만..더 짠한 이미지 나타나면 제대로 바꿔보려구요..ㅎㅎ)
엇?? 달빛효과님.ㅋㅋ 블로그 아이콘을 이렇게 바꾸신 거군요. 계속 예전 그림이 나오더니.. 제 구글 광고 위치 요리 조리 붙여보느라 계속 F5를 눌렀더니 이제야 보이네요.ㅋ 귀엽습니다. 사막을 지나는 고양이 글 맞죠?
그건 글코.. 티스토리 넘 골치아파요.ㅠㅠ 전 솔직히 떠먹여주는게 더 좋은데.ㅋㅋㅋ 그래도 네이버처럼 거기서 주는 것만 하라고 하면 이젠 갑갑해서 못할 거 같네요.
저거 예전에 태터툴즈 스킨에서 한번 본건데 잊어버리고 그 스킨을 못찾고 있었는데 ㅎㅎ...
잘 찾으셨네여...ㅎㅎ
예전엔 태그를 이리저리 바꾸는 재미로 막 했었는데...요즘은 그냥 한가지에 안착을 ㅎㅎ..
스킨한번 손되기 시작하니 바끼는게 많아서리...
Fallen Angel님 스킨 이쁘잖아요^^ 댓글창에 야웅이도 너무 이쁘구요. 저는 그런 이미지가 없어서 허접한 포토샵 실력으로 만든 제 파란토마토를 넣었지만요.ㅋㅋ 이거 진짜 티스토리랑 다음 서버를 다 뒤져도 없더라구요. 순일땅님 아니었으면 지레 포기했을 듯..
파란토마토님의 글을 볼때 마다 참 부지런하시다는 느낌이 듭니다. 저는 처음 갤러리와 개별 그림의 캡션이 다르다는 말을 보고도 무엇을 이야기 하는지 알아차리지 못했거든요. 왜냐면 어떻게 출력되는지 관심을 가져 본 적도 없고 고쳐야 겠다는 생각도 안 들더라구요. 참 게으르게 블로깅하는 거 같아 반성했습니다.
어이쿠.. 부지런하긴요. 다만 하나 궁금한 거 찾아다니다가 알게 된 자료를 같이 나누려고 한 것이죠. 이거 대충 알아본 날짜는 1월 초인데 힘들어서 차일피일 미루다가 한달 보름 후에나 겨우 글쓴 거에요.
과분하신 칭찬 감사합니다만.. 이카루스님 블로그 충분히 훌륭하십니다. 반성하실 필요 전혀 없습니다.
그나저나 확실히 블로그팁이나 재미로 보는 자료가 영어보다 호응이 좋군요. 영어는 다들 싫어하는구나..게속 영어만 올리면 구독자, 방문자 다 떨어질라~~ 어흑~~ㅋㅋ
토마토님 새로운 한주 즐겁게 보내세요^^
이미지 캡션은 시간이 한가할때 배우도록 하겠습니다.^^
중계사님은 이미지 사용 잘 안하시니 필요없을거가타요^^
이런 기능이 있었군요...^^
재미있는 정보 잘 배우고 갑니다..^^
몰라도 되지만 가끔 궁금한 것들이죠^^
옷!!이런 방법이 있었군요.
안그래도 흐릿하니 영~~맘에 안들었었는데 저도 색상을 한번 바꿔 봐야겠네요.....
늘 새로운 것에 도전하시는 빨간 여우님^^ 댓글 감사합니다.
블로그에 좋은정보들이 많네요. 안녕하세요~ Daum신지식 담당자입니다 ^^
바로 조금전 신지식 트랙백답변이 오픈하였습니다. 전에 http://jumpcut.tistory.com/22 네멋대로 써라님의 블로그에 남겨주신 댓글보고 방문했습니다. 아직 공지도 올리기전인데^^ 블로그내 좋은 지식들 신지식에 트랙백으로 한번 엮어보세요~
우와.. 다음 신지식도 티스토리 블로그가 있었군요!! 다음 신지식 트랙백 오픈이라니.. 정말 축하합니다!! 저도 기쁘네요. 블로그 칭찬 감사합니다.
앗!!! 이렇게 일일이 설명해주시다니.....파란토마토님 센스쟁이!!!ㅋㅋㅋㅋ
사실 저도 좀 손대볼까 하다가 소스 위치 찾기가 귀찮아서 미루고 미루고 있었는데..ㅠ_ㅠ
이렇게 찾아서 설명까지 해주시니...!!!!! 또 바꿔봐야겠네요..ㅋㅋㅋ
오늘 뭐 하나 건졌네요...으흐흐흐흐흐-_,-!!!ㅋㅋㅋ
저는 아예 모르던 백지 상태에서 순일땅님 덕분에 알게 되었답니다. 정말 힘들어서 한달 넘게 미루다가 이제야 글 올리네요.ㅋ 도움이 되었다니 기쁩니다.
앗... 오랜만이예요. 파란 토마토님~ ^^ 오랜만에 남겨주신 파란토마토님의 흔적을 타고 왔어요... ^^)/
순일땅님.. 무지몽매한 중생에게 가르침을 주셔서 다시 한번 감사합니다.
이미지 하니까 몇가지 괜찮은 사이트 남기고 갑니다
http://bbom.org/tools/index.html
http://www.poporo.co.kr/main.asp
1. 사진편집, 2. GIF animation, 3. 연속사진, 4. 사진일기 (오픈예정)
웹에서 위의 기능 사용하여 이미지 편집할 수 있는 사이트에요 'ㅅ')
http://home.kele8.com/smallgame/signetImg/default.aspx
요기는 도장 이미지 만들어 주는 사이트.
이미지 하니까 몇가지 괜찮은 곳 남기고 갑니다
http://bbom.org/tools/index.html
http://www.poporo.co.kr/main.asp
1. 사진편집, 2. GIF animation, 3. 연속사진, 4. 사진일기 (오픈예정)
웹에서 위의 기능 사용하여 이미지 편집할 수 있는 곳이에요'ㅅ')
http://home.kele8.com/smallgame/signetImg/default.aspx
요기는 도장 이미지 만들어 주는 곳
이미지 하니까 몇가지 괜찮은 곳 남기고 갑니다
bbom.org/tools/index.html
www.poporo.co.kr/main.asp
1. 사진편집, 2. GIF animation, 3. 연속사진, 4. 사진일기 (오픈예정)
웹에서 위의 기능 사용하여 이미지 편집할 수 있는 곳이에요'ㅅ')
home.kele8.com/smallgame/signetImg/default.aspx
요기는 도장 이미지 만들어 주는 곳
이미지 하니까 몇가지 괜찮은 곳 남기고 갑니다
bbom.org/tools/index.html
www.poporo.co.kr/main.asp
home.kele8.com/smallgame/signetImg/default.aspx
요기는 도장 이미지 만들어 주는 곳
호 좋은 팁이네요.
그러나 전 스킨이 또 자체 인공지능(?)으로 어떻게 망가질지 알 수 없으므로
당분간은 그냥 밝은 것만 쓰렵니다. ㅡㅡ;
하하하^^ 저도 그러다가 본문의 글씨체를 바꿨을 때 이미지캡션,갤러리캡션이 다르길래 알아본 거랍니다.^^
아.. 정말 좋은 팁이네요.
이런걸 쓰시다니.. 실력이 대단하십니다.
티스토리 자체를 업그레이드 시키신듯 합니다. ^^
아이쿠. 과찬이십니다.ㅋ 저는 순일땅님의 도움이 없었다면 암것도 못했을 거에요.^^;; 그냥 물어물어얻은 답으로 계속 실험해가며 얻은 답이죠^^
전지현만 뚫어지라 쳐다보다 도망가는 ㅠㅠㅋㅋ
하하..러브네슬리님은 왠지 그럴 거 같았습니다.^^
참고로, !important는 css 스타일을 지정하다가 두 개의 스타일이 충돌될 때 이 쪽을 써달라는 뜻입니다.
즉,
.gallerycaption {color:red;
color:blue !important; }
하면 red를 무시하고, blue를 선택하라는 뜻입니다.
그냥 적어봤습니다. (_._)
감사합니다. 오늘도 이렇게 유용한 팁을 알려주시는 bluenlive님^^ 어찌 이리 친절도 하신지요.
토마토 아이콘이 바뀌었네요 ^^// 눈이 달렸어요 ㅎㅎ 오호 더 귀여워졌다는 ~! ㅎ
감사합니다^^ 근데 요걸 줄이면 알아보질 못해요.. 아이콘 너무 크니까 무식해보어서 줄이고 싶은데.. ^^;;