티스토리 고정형 플로팅배너 사이드바 손가락달기
티스토리 고정형 플로팅배너 사이드바 손가락달기
드디어 구경만하던 플로팅배너를 달았습니다.
고정형 플로팅배너라고 하던데 정확한 명칭은 모르겠습니다.
그럼 여러번의 수정을 거쳐 완성한(?) 플로팅배너 만들기 시작하겠습니다.ㅎㅎ
1. 우선 현재 스킨을 저장하세요.
스킨을 잘못 만졌다가 블로그 날린 느낌 아시는 분들은 꼭 저장하고 진행하시기 바랍니다.
2. 첨부한 압출파일을 풀고 'HTML/CSS-파일업로드' 들어간뒤 파일을 업로드해주세요.
압축파일은 Hanon/out, Viewon/off, Click 이렇게 5개 파일이 있습니다.
(click.jpg 파일은 직접 만들어봤습니다.ㅎㅎ)
티스토리 플로팅배너 버튼.zip
3. 'Html/CSS-skin.html'에서 'article_rep_desc'를 찾으세요.
Ctrl+F로 찾으면 빠르게 찾을 수 있습니다.
첨부한 플로팅배너 코드를 'article_rep_desc'하단에 입력하면 되지만,
코드를 약간 수정해야 하니 아래 글을 꼭 읽어주세요!!!
티스토리 플로팅배너 코드.txt# 플로팅배너 코드 수정 #
1. 일단 3곳의 'OOO.tistory.com' 부분을 자신의 티스토리 주소로 바꿔주세요. 저는 OOO자리에 제 블로그 주소인 anythingtip을 넣으면 되겠죠.
2. 뷰온구독과 한RSS구독의 'onMouseover/onMouseout'는 마우스가 그 위치에 올라갔을때 색상이 컬러로 바뀌도록 설정한 부분입니다. 마우스에 상관없이 컬러로 표시하고 싶으면 이 부분을 삭제하면 됩니다.
3. 한RSS부분에 onclick부분은 현재 코드대로하면 자동으로 한RSS가 구독됩니다(한RSS에 등록된 경우). 단순히 링크만 시키고 싶다면 onclick부분도 삭제해주세요.
# 플로팅배너 위치수정 #
코드 최상단에 있는 부분이 위치를 수정할 수 있는 코드입니다. 몇가지 코드면 설명드리자면...
1. MARGIN-LEFT: 화면중앙에서 거리를 말함니다. -500px은 중앙에서 왼쪽에, 500px은 오른쪽에 위치합니다.
2. TOP: 상단위치를 수정합니다. 화면 중간에 위치시키려면 50%를 입력합니다.
3. background-color: 배경색을 변경합니다. 투명화는 transparent, 색상은 해당 색상코드를 입력합니다.
4. border: 테두리 두께를 설정합니다.
5. solid: 실선색상을 지정합니다. 역시 원하는 색상코드를 입력하시면 됩니다.
