Yesterday : 264
Total : 669,446
- 쿠팡파트너스
- 애드핏
- 애드픽
- 달빛이비추는 금빛작업실
- #폰요리
- 생명유지필수영양소
- 코코소프트
- 재테크포럼
- 나라디자인
- 기면기의 기억을 걷는 시..
- Carbon Fiber Workroom
- 작은설탕
- 김장배추의 게임스토리
- 문또또 라이프
- 필로소피아트
- TakeALook
- 하포의블로그
- 주니엘의 라이프 스토리
- neverending
- NEOEARLY*
- 서기닷컴
- 나 혼자 중얼??
- 먹보a의 살찌는 블로그
- 블로그팩
- 내다보는 (창)
- 집사 강가이버
- JunToday.com
- Hi Hello, Daily
- 영웅엔진
- 사람의 향기
- READ!
- Half and Half
- 비행인생
- Urban Country Diary
- 푸우시로의 지식창고
- Never Ending Story
- 오다
- 꽃길만 걷자
- 실버스타그램
- 하이공도리
- MY FIRST REFRAIN
- 브로페's
- 지금, 당신은 행복합니까?
- JS Storage
- 여행지스크랩북
- 재무컨설턴트 이주호
- 미친듯이 만들어 재끼자.
- 마음의 평온
- Papa's Lab
- Almost nothing
- OK건설워커
- Enjoy the monent ~ Laon..
- Lifelog of Sol
- moviescale
- The Invincible Iron Man
호기심 가득! 모지모지!
티스토리 반응형 스킨 #2 PC화면좌측 방문수 추가하기 본문
어느 분의 요청으로
블로그 좌측화면에 방문수추가하는 방법을
간단히 적어보겠습니다.
제 블로그를 기준으로 위와 같이
PC화면(넓은화면)에서
오늘 방문자, 어제 방문자, 총 방문자 수를
표시하는 방법입니다.
* 기본 스킨과는 조금 다른 부분이 있을 수 있습니다.
방법은
1. HTML상에 소스를 넣기
2. CSS에 스타일속성을 추가하기
순 입니다.
첫번째,
HTML상에 좌측 붙이고자 하는 부분을 찾아
소스를 넣습니다.
<div class="top_visitor">
Today:[##_count_today_##]
Yesterday:[##_count_yesterday_##]
Total:[##_count_total_##]
</div>
[##_...._##]는 아시겠지만
티스토리에서 제공하는 치환자입니다.
즉, 이 부분이 알아서 방문자수가 표시되는 부분입니다.
HTML 상의 위치는 제블로그 기준이기 때문에
따라하시는 분은 기존 소스를 참고해서
적당한 곳에 붙여주세요. 대략 저 위에 표시된대로
74줄 근처일거라고 생각됩니다.
* 붙여보시고 여러번 바꿔보시며 찾아보셔도 됩니다.
HTML상에 소스를 붙였다면
다음은 위와 같이 CSS를 추가하는 겁니다.
위에 표시된 165줄근처에 아무곳이나 넣으면 됩니다.
.top_visitor {margin-top:0px;font-size:12px; color:#a7a7a7}
역시나 제 블로그 기준이기때문에
본인 CSS파일에 맞게 적당한 곳에 넣으셔도 적용이 됩니다.
* CSS를 잘 모르시는 분은 가급적 아래쪽 혹은 끝 줄 쪽에는 적지마세요.
이유는 화면별로 CSS속성이 적용되는 부분이 적용이 되어있어서
반영이 되지 않을 수 있습니다.
여기까지하면 PC화면일 경우, 방문자수가 표시되게 됩니다.
그런 다음 마지막으로 한가지 추가작업,
모바일 화면에서는 방문자수 표시하는 부분이 다를 수 있기 때문에
보이지 않게 해야합니다.
방법은 바로 위의 이미지에 나타난 속성처럼
@media
only screen and (max-width:738px){
부분을 찾습니다.
간단히 설명드리자면 좌우폭 738px보다 작은 화면일 경우
아래 적히 속성들이 적용된다라는 뜻입니다.
위와 같이
그 아래 적당한 줄에
.top_visitor {display:none}
를 추가합니다.
적용되었는지 확인해보시고,
혹 다르게 표현된다면 질문 남겨주십시오~~
급하게 내용을 적다보니
부족한 부분이 있을 수 있습니다.
요청하신 분 도움이 되었으면 좋겠네요~^^
-
Atomseoki 2016.11.19 11:38 신고 전 글씨가 회색으로 나오는데 흰색으로 표시는 어떻게 변경하면 되나요?
-
Byulvely 2016.11.29 17:47 신고 잘보고가요 덕분에 성공적으로 추가했어요!
-
하이공도리 2016.11.29 22:55 신고 모지모지 님 모바일버전에서는 PC버전처럼 홈화면에 사이드바가 있는데 어떻게 설정하신 건가요?ㅠㅠ
-
멈블즈 2017.01.26 22:14 신고 좋은 정보 감사합니다.^^
-
SONYLOVE 2017.01.27 13:28 신고 폰트가 아기자기하네요. 완전 귀여워요. ㅎㅎ
-
3투5 2017.04.22 10:12 신고 http://positiveme.tistory.com/ <- 제 블로그입니다. 저도 님처럼 글목록 | 방명록 | 이웃추가를 추가했는데요..근데 저는 왜 이 글씨가 흰색이 아니라 검은색으로 나오는지 모르겠네요. 님이 이 포스팅에 남기신 코드 이미지 보고 그대로 따라 넣었습니다. ^^ 혹시 하얀색으로 하는 방법 알려주시면 정말 너무 너무 고맙겠습니다.^^
-
모지모지 2017.04.24 07:44 신고 http://www.mojimoji.co.kr/m/594
제가 피씨로 보면 찾아봐드릴 수 있을텐데 일단 위 글 참고하셔서 해당 부분 링크 색상 고치는 부분을 직접 찾아보세요~ 해당부분 붙이신거보면 크게 어렵진 않으실겁니다 -
건방진병아리 2019.01.13 17:53 신고 하나하나 익히느라 시간이 많이 걸리지만 정말 도움많이 받고 있어요. 감사합니다.
세세하게 적어주셔서 열심히 흉내내고 있는 중이에요.
앞으로도 자주 방문할게요. -
모지모지 2019.01.17 17:25 신고 부족한데 좋게 봐주셔서 감사합니다.
요즘엔 HTML에 손을 떼고 지내는지라 관련 업데이트가 힘들겠지만, 종종 들러주세요.