■ 변경하는 부위


1024해상도에 최적화된 블로그들은 와이드 모니터에서 조금 휑하게 보일수 있기때문에
블로그의 가독성이 높여보이게 하기위해서 좌우에 회색배경을 넣어봤습니다.





■ 블로그 회색 배경을 넣어서 가독성 높이기


넷북을 많이 사용해서 해상도 1024*768에 맞춰서 블로그를 꾸며왔는데 와이드 모니터에선 좌우가 너무 휑하게 보여서 어떻게 할지 고민을 하다가 링크프라이스 사이트를 보고 답을 찾았습니다. 

링크프라이스에서는 1024 해상도에는 블로그가 100%가 보이고 그 이상의 해상도에는 좌우에 연한 회색 배경색을 넣어줘서 블로그의 가독성을 높여줬습니다.  

크프라이스 홈페이지 (보러가기)



■ 준비물


1. 타이틀 이미지

- 타이틀부분을 가득채우는 이미지를 준비합니다.

2. 본문배경색재료


-  가로크기 : 타이틀 배경이미지와 가로크기가 같게 합니다.

- 세로 크기 : 배경상하 반복을 이용하기 때문에 크기가 작아도 상관이 없습니다. 
- 설명하기 힘들어 아래에 파일을 첨부했습니다.




■ 변경하는 방법


제가 사용하는 Life in Mono 스킨을 기준으로 포스팅 해봤습니다.  
배경색을 넣어주고 그위에 배경,타이틀 이미지를 흰색으로 덮어주는 방법입니다. 
(배경색만 회색으로 바꿔줘도 적용이 되는 스킨도 있습니다. )


-  배경 변경



1. 스킨> 스킨위자드>배경>배경색상을 #efefef를 입력해줍니다
2. 스킨> 스킨위자드>배경> 직접올리기에서 자신의 배경 이미지를 올려줍니다.
3. 이미지사용을 체크하고 상하반복을 선택합니다.
4. 가운데 정렬을 눌러주고 적용을 해줍니다.


-  타이틀 변경



1. 스킨> 스킨위자드> 타이틀> 배경색 #efefef를 입력해줍니다

2. 스킨> 스킨위자드 > 타이틀 > 직접올리기 > 찾아보기에서 타이틀이미지를 넣어줍니다.
3. 이미지사용을 체크하고 원래크기를 선택합니다.
4. 가운데 정렬을 해줍니다.



■ 완성된 모습





■ 후기


간단한 원리지만 처음에는 레이아웃을 변경해야되는건 아닌지 고민하다가 레이아웃을 변경을 하지 않아도 할수 있어서 혹시 모르시는분들이 계실까봐 포스팅해봤습니다.

저처럼 해상도 1024에 블로그를 최적화하셨는데 좌우가 너무 휑하게 보이시는분들은 이 포스팅 참고하셔서 좌우에 회색 여백을 한번 넣어보세요 ^^ 스킨마다 방법이 조금 달라질수 있습니다.


신고

댓글을 달아 주세요

  1. 이전 댓글 더보기
  2. 아..스킨.. 정말 저도 수정 좀 해야겠어요^^;;

    2010.06.29 13:34 신고 [ ADDR : EDIT/ DEL : REPLY ]
  3. 스킨 바꾸는 방법이 이거였군요 ㅎㅎ

    아 좋은 정보 얻어갑니당 ㅎㅎ

    2010.06.29 13:50 신고 [ ADDR : EDIT/ DEL : REPLY ]
  4. 좋은 정보 감사합니다.
    제 레이아웃은 너무 간단한거라..가끔 변화도 좀 줘야하는데요..쩝..

    2010.06.29 13:50 신고 [ ADDR : EDIT/ DEL : REPLY ]
  5. @.@ ㅎㅎ저도 지금 바로 따라했습니다.
    타이틀 변경에서 고심했습니다. 이미지를 새로 올리니...제목이 사라져서요.^^; ㅋ

    2010.06.29 14:09 신고 [ ADDR : EDIT/ DEL : REPLY ]
    • 눠한님.. 오랜만에.. 아디랑 비번 비밀댓글주시면
      메뉴판쪽 수정해드릴께요 ^^;;;

      2010.06.29 14:23 신고 [ ADDR : EDIT/ DEL ]
    • ?? 어라? 완벽하게 따라했다고 생각했는데?
      @.@ 이상하게 보이는 부분이 있나요?

      2010.06.29 17:29 신고 [ ADDR : EDIT/ DEL ]
    • 카운터부분쪽이 회색이잖아요 ㅠ
      그리고 눠한님 폭을 좀 늘리셔서.. 약간 흰색이미지를 더길게 해서좀
      여유있게 하시는게 좋아보여요 ㅎㅎ

      2010.06.29 17:32 신고 [ ADDR : EDIT/ DEL ]
    • 아. 그런가요? 눈이 나빠서 보이지가 않네요.ㅋ
      어떻게 하지..흠.ㅎㅎ 어느 폭을 더 늘리면 되죠? ^^; ㅎ

      어라...티비님 색을 더 진하게 바꾸셨네요? ㅎㅎ
      이게 더 나아보여요!! ㅎㅎㅎ

      2010.06.29 21:42 신고 [ ADDR : EDIT/ DEL ]
    • 카운터쪽에 회색이예요 ㅎㅎ
      일단 눠한님 혼자하시려면 타이틀이미지 조금만 아래로 길게 해주시면되요!
      진하게는 배경색을 c8c8c8로해주시면되구요 ( 욕아니예요 ㅎㅎ)

      2010.06.29 22:25 신고 [ ADDR : EDIT/ DEL ]
  6. 저는 원래 그렇게 되어있어서 안건드려도 되겠어요 ㅎㅎ 티비님은 블로그를 참 잘만지시는 것 같아요..
    저는 글씨체도 바꿀줄 모르고 이것저것 배울게 많습니다..ㅋ

    2010.06.29 14:19 신고 [ ADDR : EDIT/ DEL : REPLY ]
  7. 요래 요래 좋은 블로그와 블로그 주인장이신 티비님이 계신걸 얼마전에 알고 가끔 눈팅 했다가 잠시 이 포스팅의 궁금함에 들려서 처음으로(아마도??) 한마디 흔적 남기고 갑니다^^
    항상 올때마다 느끼지만 블로그에 정성이 가득담겨 있다는걸 배우고 또 배웁니다.

    2010.06.29 14:59 신고 [ ADDR : EDIT/ DEL : REPLY ]
  8. ㅎㅎ 전 화면이 작아서 회색이 끝에 겨우 보일락 말락합니다.
    글읽고 순간 당황했습니다.^^;

    2010.06.29 15:55 신고 [ ADDR : EDIT/ DEL : REPLY ]
    • 저처럼 블로그를 모두 흰색으로 통일하신 분들을 위한 포스팅이여서요
      버스님처럼 회색배경이시면 꼭 수정안해주셔도 되요 ㅎㅎ
      제가 괜히 당황시켜드렸네요 ^^:

      2010.06.29 16:08 신고 [ ADDR : EDIT/ DEL ]
  9. 바로 따라 했습니다~^^

    2010.06.29 16:29 신고 [ ADDR : EDIT/ DEL : REPLY ]
    • 잘적용하셨네요 ^^;
      Life in Mono스킨이시면
      html/css편집에서요 css부분중에서요
      마지막부분
      border-top:4px solid #5C5C5C; <- 이부분삭제해주면 위쪽에 라인 없어지실꺼예요!!
      ------------------------------------------
      body {
      background-color:/*@background-color=*/#FFFFFF/*@*/;
      background-image:/*@background-image=*/none/*@*/;
      background-repeat:/*@background-image-repeat=*/no-repeat/*@*/;
      background-position:/*@background-image-position=*//*@*/;
      font-size:12px;
      border-top:4px solid #5C5C5C;
      }
      ------------------------------------------

      2010.06.29 16:36 신고 [ ADDR : EDIT/ DEL ]
  10. 항상 좋은팁 감사합니다.
    티비님 때문에 지금 사용하는 스킨이 인기가
    많이 올라가는 것 같습니다^^

    2010.06.29 17:00 신고 [ ADDR : EDIT/ DEL : REPLY ]
  11. 가끔씩 이웃블로그를 돌아보면 티비님 스킨이 많이 보이더라구요...
    역시 티비님의 영향력이 대단한것 같더라는.. 언제나 수고해주셔서 감사합니다.

    2010.06.29 17:33 신고 [ ADDR : EDIT/ DEL : REPLY ]
    • 기존에 티스토리 스킨이 좋은거구요
      저는 수정만 조금한거뿐이예요요 ^^;;;;
      연필님도 즐거운 하루보내세요 !

      2010.06.29 17:39 신고 [ ADDR : EDIT/ DEL ]
  12. 회색이 조금 더 진해도 괜찮을 것 같은데요..^^
    암튼 대단하시네요..

    2010.06.29 19:11 신고 [ ADDR : EDIT/ DEL : REPLY ]
    • 달콤한님 말듣고~
      좀더 찐하게 했는데 훨씬 보기 좋은것 같아요!!
      좋은 이야기 감사드려요 ^^

      2010.06.29 19:32 신고 [ ADDR : EDIT/ DEL ]
    • 조금 진하니까 진짜 보기 좋네요..ㅎㅎ

      점점 디자인이 깔끔해 지는데요...
      나날이 발전을 더해 갑니다. 제 블로그는 점점 퇴행하는거 같은데..^^

      2010.06.29 20:25 신고 [ ADDR : EDIT/ DEL ]
    • 달콤한님 덕분이예요 ㅎㅎㅎㅎ
      달콤한님도 이스킨으로 넘어오세요~! ^^;;

      2010.06.29 20:37 신고 [ ADDR : EDIT/ DEL ]
  13. 생각보다 쉽네요...ㅎㅎ
    아니면 잘 가르쳐주셔서 그런가..
    잘 보고 가요~

    2010.06.29 23:20 신고 [ ADDR : EDIT/ DEL : REPLY ]
  14. 아~~~
    알고보니 간단하면서 이용을 못하고 있었네요... 역시 우리 티비님 짱!!
    오늘은 바빠서 잠깐 참고만 하고 내일 다시 들어와 자세히 차근차근 이용해야 겠어요..
    늘 빠르고 좋은 정보 감사

    2010.06.30 00:46 신고 [ ADDR : EDIT/ DEL : REPLY ]
  15. 작은거 하나하나 놓치지 않으시군요...

    그 세세함이 부럽습니다.

    2010.06.30 09:28 신고 [ ADDR : EDIT/ DEL : REPLY ]
  16. 잉 이거 싫다시더니? ㅋ 티비뉨 따라쟁이~

    2010.06.30 14:32 신고 [ ADDR : EDIT/ DEL : REPLY ]
  17. 흠..무슨차이지? 하며 따라해봤는데..
    확실히 차이가 나네요 ㅎㅎㅎ

    2010.07.07 10:21 신고 [ ADDR : EDIT/ DEL : REPLY ]
  18. 블로그타이틀이커서..ㅜㅜ

    2010.09.29 22:37 신고 [ ADDR : EDIT/ DEL : REPLY ]
  19. 많은 것을 깨우치게 해주시내요..
    한번 실행해보겠습니다..제가 사용중인 스킨은 HTML/CSS에서 수정을 해야되는
    번거로움은 있지만 노력해봐야죠..감사합니다..^^

    2011.02.16 06:06 신고 [ ADDR : EDIT/ DEL : REPLY ]
  20. 적용은 했는데....본문 글 안에 있는 라인이 일려서 넘어가 버렸습니다. 왜 그럴까요?
    등록날짜 나오고 우측에는 폴더명이 짤려서 나옵니다. 그 밑의 선은 넘어가서 그런지 갈고리 처럼 됐습니다.
    어케 해야할지 ㅡㅡ;

    2012.05.02 18:15 신고 [ ADDR : EDIT/ DEL : REPLY ]
  21. 좋은 정보 감사합니다. 많이 배웁니다.

    2013.06.17 15:37 신고 [ ADDR : EDIT/ DEL : REPLY ]

티스토리 툴바