티스토리 반응형 Square 스킨 편집 - 태그 위치 이동 및 광고 겹침 현상 해결방법

이번 포스팅은 티스토리 반응형 Square 스킨에 대한 내용입니다. html 이나 css 수정을 모르시는 분들이라도 충분히 따라 할 수 있는 내용이니 필요하시면 참고 하시기 바랍니다. 또한 티스토리 스킨편집까지 가는 스텝은 기본적인 내용이고 다 아는 부분이라 생각하여 생략하였습니다.

오늘 내용은 square 스킨에서 본문 위에 배치된 태그의 위치를 변경하는 내용입니다. 또한 태그의 위치 변동시 상단에 배치된 광고와 날짜 부분이 겹치는데 이 부분을 수정하는 내용도 같이 포함되어 있습니다. 사진 속에 말풍선을 이용해서 보기 쉽게 설명해놓았으니 천천히 보고 따라해보시기 바랍니다. 감사합니다.

<태그 아래로 이동하는 방법>

1.

square 스킨의 포스팅 위의 태그를 아래로 이동 시켜 보겠습니다.

2.

스킨의 사이드 바를 수정하니 위와 같이 가끔 태그가 날짜와 겹치는 현상이 발생하여 태그의 위치 이동을 고민하던 차에 오늘 마음먹고 수정 후 포스팅을 합니다. 누군가에게 도움이 되길 희망합니다.

3.

1. 스킨편집 -> html 클릭 합니다.

2. ctrl + F 찾기 기능을 활성화 합니다.

3. <div id="body" class="entry"> 문장을 검색합니다.

4. 두 번째 검색 부분을 수정하여 하니 그 부분으로 스크롤을 이동 시켜 줍니다.

4.

1. 위와 같이 코드의 순서를 변경 시켜 줍니다. 위의 그림이 순서를 변경한 이후의 완성된 코드 입니다. 위의 그림처럼 순서를 변경 해주시면 됩니다. 변경 이후 적용 버튼을 클릭 하여 어떻게 변경이 되었는지 확인을 합니다.

 

5.

1. 확인하면 위의 그림처럼 태그는 포스팅 윗 부분에서 사라진 것을 확인 할 수 있습니다.

2. 그러나 문제점이 발생합니다. 바로 플러그인으로 활성화 시킨 상단 광고와 날짜 부분이 겹치는 문제입니다.

3. 이 문제를 해결 해보도록 하겠습니다.

6.

위 코드를 삽입해줍니다. 빈 태그 공간을 입력하는 코드 입니다. 제가 찾은 방법은 이건데, 혹시나 더 좋은 방법이 있으신 분들은 댓글로 알려주시기 바랍니다.

7

1. 태그가 아래로 이동이 완료 된 것을 확인 하실 수 있습니다.

2. 날짜와 상단 광고 겹침 현상이 해결 된 것을 확인 하실 수 있습니다.

<연관글>

포스팅 29 - 티스토리 Square Recent post 스킨 오류 해결 방법

포스팅 71 - 반응형 광고 짤림 현상 해결 방법 - 티스토리 휴대폰 어플로 확인 시 모서리 짤림 현상 해결하기

포스팅 72 - square 반응형 스킨 수정 - 사이드 바 조절 방법

<포스팅을 마치며>

안녕하세요, gapsoo life blog의 gapsoo 입니다. 제 블로그를 방문 해주셔서 감사합니다. 오늘은 스킨 편집에 대한 내용을 담아보았는데요, 필요한 자료였으면 합니다. 글을 읽으시다가 모르는 부분이나 잘못된 부분은 댓글 남겨주시기 바랍니다. 응원의 댓글도 환영 합니다. 저는 프로그래머가 아니라서 제가 사용한 방법이 옳은지 확실하지 않습니다. 혹시나 오류가 있거나 더 좋은 방법이 있으면 댓글로 알려주시기 바랍니다. 지금까지 제 포스팅을 읽어 주셔서 감사합니다. 남은 주말 즐겁게 보내세요. ^^ 봄이 왔어요.

gapsoo 드림.