반응형

블로그 스킨 배경화면을 계절마다 바꾸잔 생각을 하고 있습니다. 일부러 투명 스킨이 아닌 스킨으로 쓰고 있는 것도 그래서입니다. 흰 바탕의 스킨이 의외로 투명 스킨인 경우가 있습니다. 현재 제 블로그 스킨도 원래는 투명 스킨이어서 바탕화면을 깔면 텍스트 영역의 글을 읽기 힘든 구조였습니다. 나름(?) 손봐서 불투명 스킨으로 개조하여 쓰고 있습니다. 

블로그 스킨을 여름 스킨으로 바꿔 봤습니다. 좀 늦었죠. 7월 초에 바꿨음 좋았을 건데 그러지 못했습니다. 8월 하순 접어들면서 바꾸었으니 대략 9월 말 정도까지만 걸고, 그 후엔 스킨을 바꾸는 게 계절에 맞을 것 같습니다. 바다 풍경이 딱히 계절을 타는 건 아니지만요. ^^

언젠가 블로그 지인에게 '공개하겠다'고 했던 블로그 스킨 배경화면 쉽게 바꾸는 방법입니다. 잊고 지낸 건 아닌데 시간이 많이 흘러 버렸군요. (아. 사용 환경에 따라 html/css 가 조금 다른 양상을 보일 수 있긴 하겠습니다만 대동소이할 거라 봅니다.)



 블로그 스킨 배경화면 이미지 쉽게 바꾸는 방법. 전혀 번거롭지 않은! ^^ 

이번에 바꾸어 본 블로그 스킨 배경화면. 여기에 적은 방법으로 바꿨습니다.
지금까지는 상하좌우 구분이 안 되는 이미지로 했는데,
이번에는 변화를 줘봤습니다. ^^ 
 
 
먼저,

관리자 페이지 > 메뉴 > 스킨 > HTML/CSS 편집 > 파일 업로드

로 들어가서 배경화면으로 올리고자 하는 파일을 업로드 합니다.
파일명을 잘 기억해 둡니다. (예컨대, IMG_0001.jgp 라고 합시다.)



다음,

관리자 페이지 > 메뉴 > 스킨 > HTML/CSS 편집 > HTML/CSS 편집

으로 가서, 하단의 style.css 란을 살펴 봅니다. (앞부분에 있음.)

/*@background-image=background-image:*/background-image: url("images/○○○")/*@*/;

열을 찾습니다. ○○○란에 아까 업로드한 파일명을 적습니다. (예컨대, 앞서 올린 파일의 이름 IMG_0001.jpg 를 적는 겁니다. 파일명을 복사해 오면 편하겠죠.) 그 외의 것은 건드리지 않습니다. ○○○ 자리에 이미 입력되어 있는 파일명을 지우고 입력하면 됩니다. 

그리고 나서, 화면 하단의 [저장] 버튼을 클릭합니다. 이제 블로그 스킨 배경화면이 바뀐 것을 확인할 수 있을 겁니다.



그 다음으로, 

1) 가능하다면 이미지 파일을 리사이즈하여 파일 크기를 줄이는 것이 좋겠죠. 방문자 중에는 블로그 바탕화면 로딩에 버거워할 분도 계시니까요. 저는 대략 100kb 내외로 리사이징 하고 있습니다.

2) 또한 이제 안 쓰는 배경화면 이미지 파일은 삭제해 주는 게 좋겠죠.
관리자 페이지 > 메뉴 > 스킨 > HTML/CSS 편집 > 파일 업로드
에서 이미지를 선택하고 미리보기로 확인한 후 [삭제] 버튼을 클릭하면 됩니다. 
 


블로그 스킨 변경을 하는 게 무려 엄두씩이나 필요한 일이었습니다. 스킨위저드를 통해서 바꾸었더랬는데, 그렇게 바꾸는 경우 기존에 스킨 html/css 상에 몇 가지 손본 게 초기화 되는 현상이 벌어지더군요. 제 경우 포스트 텍스트 영역과 답글 입력창 크기가 초기값으로 되돌아갔습니다. 스킨위저드 돌릴 때마다, 돌린 후에 반드시 skin.html과 style.css로 들어가서 초기화 된 부분을 다시 만져줘야 했습니다. 그러다가, 귀찮아 하다가, 어쩌다가, ... (^^) 편하게 블로그 스킨을 바꾸는 방법을 알게 되었습니다. 스킨 위저드 통하는 방법보다는 이 방법이 훨씬 편합니다. html/css 초기화 되는 일도 없고 손봐 주는 수고도 필요 없습니다. 보통, 발견은 우연이란 이름으로 오는 거 같습니다.
 
 
 



글의 내용이 유익하셨다면 추천버튼을 쿡! ^^


2011 0820 토 22:20 ... 11:10  비프리박

 
 
반응형



: