티스토리 꾸미기 팁 - 내블로그만의 마우스 포인트로 개성있는 블로그를 만들어보자

나만의 개성이 담긴 블로그 꾸미기 프로젝트 ^^

마우스 커서편입니다.

적용하는 작업은 단순하지만 초보자는 좀 어려울 수도 있습니다.

그리고 설치형 블로그나 티스토리 블로그외에는 적용이 불가능 합니다.

개발자 기술문서 입니다. 필요하신 분은 참고하시면 되겠습니다.

https://developer.mozilla.org/ko/docs/Using_URL_values_for_the_cursor_property

적용 단계 요약

1. 확장자가 Cur 인 커서 파일을 다운받거나 만들다.

2. 블로그 HTML 편집창에서 CSS 편집기를 아래 설명을 참고해서 수정한다.

3. 저장하고 블로그를 확인한다. ^^ 끝!

준비됐다면 적용해봅시당...

먼저 커서 이미지로 사용하실 .Cur 파일을 정하셔야 됩니다.

직접 만드실 수도있지만,

아래 홈페이지에 가시면 무료로 다운 받아서 사용할 수 있습니다.

http://www.rw-designer.com/

이제 마음에 드시는 Cur 이미지를 찾았으면...

아래와 같이 Css 편집창을 열어서 소스를 편집할 준비를 합니다.

초보자는 좀 어려울 수 있으니 변경전 소스를 꼭 보관하신 후에 작업해주세요 ^^

소스 편집도 티스토리 어드민에서 하시면 눈이 빠져 나올것 같은 고통이 올지도 모르니

윈도우 메모장이나 다른 텍스트 편집기로 전체를 복사해서 편집하시는게 좋습니다. ㅋ

1. body 스타일 편집 :: body { 로 시작하는 줄을 찾아서 편집합니다.

body { 

... 내용

... 등

cursor: url(http://www.blogrankey.com/images/choco.cur),default;

}

위에 빨간색 굵은 글자로 표시된 부분과 같이 추가해줍니다.

http:// 으로 시작하는 cur 파일 주소는 사용하실 주소로 바꿔줍니다.

body { 가 여러번 정의 된 경우도 똑같이 모두 똑같이 추가해줍니다.

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,... {

... 내용

... 등

cursor: url(http://www.blogrankey.com/images/choco.cur),default;

}

2. html 스타일에도 적용해줍니다.

* html #adTistory .linkTistory {

... 내용

... 등

}* {

cursor: url(http://www.blogrankey.com/images/choco.cur),default;

}

이렇게 소스를 편집하고 저장을 하면 끝입니다.

CSS 구문에 따라 중복정의 등의 이유로 잘 안되실수도 있으니 

주변에 HTML을 잘 아시는 분이 있다면 도움을 받는것도 좋겠네요 ^^