본문 바로가기

IT 서비스 바라보기/Blog

블로그 댓글 입력창에 배경 이미지 넣기


요즘 블로그 디자인을 조금씩 변경하고 있는데 어젠 댓글 창에 배경 이미지를 한번 삽입해 봤습니다. 포토샵 사용 안한지 1년 가까이 되니 단축키도 잘 기억 안나고 디자인 감각도 많이 떨어진 듯한..-_-
암턴 "댓글 창에 이미지를 추가 했습니다..." 라고만 글 써두고 넘어가는 것 보다 티스토리 스킨 변경에 어려움을 많이 느끼시는 분들을 위해서 간단히 설명이라도 남겨 두면 좋을 것 같단 생각이 들어 포스팅 합니다. ^-^

자, 그럼 따라 오세요!! Go~ Go~!!

1.
댓글창 배경으로 사용할 이미지를 준비 합니다. 그래픽 툴(포토샵, 페인트샵 등) 을 사용가능 하신 분은 댓글 창 크기에 맞춰 임의의 사이즈로 편집하셔도 되겠죠. 저는 댓글창 크기에 맞춰서 임의로 편집을 했답니다 ^^
준비하신 이미지를 업로드 하여 이미지 주소를 복사해둡니다.
티스토리 사용자분들은 관리자 모드에서 스킨 - HTML/CSS - 파일 업로드 에서 업로드 하시면 되며 이미지 주소는 ./images/파일이름 입니다.

2.
관리자 모드로 접속하여 스킨 - HTML/CSS 편집 화면으로 들어가고 CTRL + F 키를 눌러 .commentWrite 란 단어를 검색합니다.



▲ 위 이미지처럼 .commentWrite textarea 항목을 찾아 해당 라인 뒤쪽에 찾아 다음 소스를 추가해줍니다.

background:url('이미지주소'); no-repeat;

어떻게 추가 해야 할지 모르겠다.. 하시는 분들을 위해 제 블로그에 적용된 소스 일부를 보여 드릴께요^^

.commentWrite textarea { width:620px; height:190px; padding:5px; top:5px; color:#08f; background:url('./images/reply.png'); no-repeat;}

설명이 길어서 그렇지 별로 어려운건 없죠? ^^
이미지를 준비 하고 html 태그만 살짝 수정해주면 되니깐요~
쉽죠쉽죠? ^^

혹, 이해 안되시거나 추가적으로 궁금하신 점 있으시면 댓글 남겨 주세요 ^-^