[티스토리 팁_4] 블로그 첫 화면 반응형 티에디션

티스토리 블로그를 만들어서, 반응형 스킨을 적용하고, 대문 이미지를 바꾸고 나니까 많이 한 것 같이 마음이 뿌듯합니다. ㅎㅎㅎ

그런데 첫 화면부터 모든 글들의 전체 내용이 보이니까.

긴 글을 세 개만 작성해도 어마어마한 스크롤의 압박이 있네요.

그리고 본문내에 애드센스 광고를 달 생각인데

본문내용이 첫 화면에 줄줄줄 노출되면 애드센스 정책 위반이 됩니다.

애드센스 규정상 한 화면에 노출되는 광고단위는 세 개로 한정되어있습니다.

앞으로 애드센스를 신청하실 분들은 참고하세요.

그래서 첫 화면을 목록형으로 바꿀 필요가 있겠습니다.

(이미지가 있고 옆에 내용 요약이 되는 형태가 되면 좋을 것 같네요.)

작업 개시.

Mission: 첫 화면을 목록형으로 바꾸기

전제조건

>스켈레톤 스파이더 웹 스킨 3.0.5 버전을 기준으로 작성되었습니다.

>나는 허접 초보임 (태클 금지)

1. 티스토리에서 제공하는 기본기능인 티에디션을 활용해보겠습니다.

   진입루트 : 관리자 - 화면설정 - 티에디션 탭에서 '사용하기'를 누른시면 됩니다.

2. '티에디션 시작하기' 버튼을 눌러봅시다.

    티에디션을 발행한다는 의미가 정확하게 뭔지 잘 모르겠지만 아래 화살표를 눌러서 내용을 보니 SNS플러그인을 설정해야하는 것을 봐서 뭔가 SNS에 업데이트를 하는 기능인것 같습니다.

    글 하나씩 올리고 난 다음에 일일이 여기저기 올리고 있는데 한번에 가능한걸까요?

3. 시작하기를 누르면 새로 뜨는 창에는 블로그 첫 화면에 저런 비활성화된 팝업창이 떠있습니다.

   비활성화되었다고 놀라지 마시고, 아래쪽 블로그 본문 영역의 점선 형태의 영역을 클릭하면 활성화가 됩니다..

   처음에 헷갈렸던건 아래쪽 디폴트로 설정되어있던 영역 세 개를 다 살려야 하는것인가? 였는데 일단은 한 개만 이용하기로 결정했습니다.

   본문 점선 영역 근처의 엑스표시를 눌러서 한개만 남기고 다 지우겠습니다.

시작하면 만나게 되는 첫 화면

4. 팝업창 탭에서 나는 아래와 같이 선택했습니다.

   ㅇ아이템 - 목록형 - 목록형 1개 보이는 것으로

   ㅇ글선택 - 최신글/카테고리별 - 최상단 카테고리 선택

   ㅇ디자인 - 아래 그림처럼 HTML 단추를 누른다.

5. 그러면 아래와 같은 html 태그 창이 나타나는데

   일단 여기 있는 내용은 다 지운다.

    5-1. 3.0.5 스킨 폴더 내 test라는 폴더가 있었다.

          test - tiedition - horizontal-patterns - medium-thumb-desktop1col-mobile1col 루트로 찾아들어와보자.

          JPG 파일 두 개, css 파일 하나, html 파일 하나 이렇게 발견이 된다.

          이 창에는 html 파일을 넣어주면 되는데 나의 경우에는 아래 단계로 진행함

    5-2. 메모장 실행 - html 파일을 끌어서 메모장으로 이동(태그 나타남) - Ctrl+A(전체선택) - 복사 - 붙여넣기 - 적용

6. 여기까지 하고나면 초기화면 영역이 좀 width가 좁아보이지만 반응형이니까

   적용하고나면 짠 하고 화면크기에 맞도록 변형이 될 것 같지만. 그렇지 않다. ;;;

   오른쪽 상단 회색영역을 보면 '너비보정'이라는 메뉴가 보일 것이다.

   이걸 누르면 그 아래 팝업창이 뜨는데 넓이를 최대한 넓히시길....반응형이니까 줄어들긴 하는데 늘어나지는 않았다는 결론.

    

7. 글 목록이 한개만 보이는 경우에는 당황하지 말고

   아래쪽의 + 표시를 눌러보자. 첫 화면에 몇개의 글을 표시할지 선택하는 것이다.

8. 모든게 적용되면 화면 젤 오른쪽 상단에 적용하기를 누르고

   내 블로그에 적용된 모습을 보러가시면 됩니다.

   이 티에디션은 미리보기 기능이 없어서 적용하기를 누르신 후 수정하는 단계로 진행하셔야 합니다.