[Blogger] 구글 블로그 페이징 처리하는법 4 : 스타일 수정~블로거 페이지리스트 만드는 방법4~ (설정 스크롤링 이벤트)_page list scrolling indie

+ 구글 블로그 페이징 처리하는법 1 : 블로그에 페이징 처리 적용

+ 구글 블로그 페이징 처리하는법 2 : 페이징 처리 시 버그(문제점 해결) 1

+ 구글 블로그 페이징 처리하는법 3 : 페이징 처리 시 버그(문제점 해결) 2

+ 구글 블로그 페이징 처리하는법 4 : 스타일 수정

1. 레이아웃 위치지정 : 페이지 본문에 최상단에 위치를 지정한다.

= 개인적으로 페이지리스트가 상단에 있는걸 선호하며, 페이지 목록(상단)이나 헤더에 적용하면 넓이가 본문보다 작아지고 모바일적용 시 불필요한 공간을 잡아먹어서 해당위치에 적용하였다.

2. 스타일적용 : 페이지리스트 위젯의 스타일을 수정

- 위젯의 제목을 지정 할 경우 제목이 노출되며, 불필요한 높이 공간을 잡아먹어서 이름지정 하지 않음

- 적용한 사진에서 빨간색으로 표시한 All List는 검색 시 검색한 문자열이 노출되는 부분임

- 모바일 버전에서는 검색 시 검색어 입력 후 모바일 엔터(이동)을 누르면 검색 됨

- 본문은 최대한 깔끔하게 하기 위해 기존 소스에서 제목 제외하고 전부 제거해주었으며,

모바일 버전을 생각하여 노출되는 포스트수를 3개로 제한하였다.

- 페이지 목록은 마찬가지로 모바일 버전을 생각하여 5개만 노출시키도록 설정해놓았으며,

모바일에서 선택하기 쉽게 크기를 키워주었다.

* PC 적용모습

* MOBILE 적용모습

3. 다음편 예고

- 적용한 위젯 소스 및 테마 HTML 소스 공유 예정

Rock Bottom Dev Bus