워드프레스 뉴스페이퍼 테마: 무한 스크롤 기능 설정하기

인기 워드프레스 테마 중 하나인 뉴스페이퍼(Newspaper)는 뉴스, 매거진, 블로그 사이트 구축에 많이 사용됩니다. 이 테마를 사용하면 비교적 쉽게 전문적인 뉴스, 웹진 사이트를 만들 수 있습니다. 뉴스페이퍼 테마를 사용하여 전면 페이지에 최신 글 리스트를 표시할 때, 맨 아래로 마우스를 내리면 글이 자동으로 로드되도록 하는 무한 스크롤 기능을 설정할 수 있습니다.

워드프레스 뉴스페이퍼 테마: 무한 스크롤 기능 설정하기

뉴스페이퍼 테마에서는 마음에 드는 데모를 로드하여 사이트를 쉽게 꾸밀 수 있습니다. 

Black Version Pro라는 데모를 설치하면 전면 페이지(홈페이지)의 하단에 최신 글 목록이 표시되고 Load More 버튼을 클릭하면 이전 글들이 로드는 형식으로 구현되어 있습니다.

Load More 방식 대신 글 항목 하단까지 스크롤하면 자동으로 이전 글들이 계속하여 스크롤되도록 하는 무한 스크롤(무한 로드) 방식으로 바꾸고 싶을 수 있습니다. 그런 경우 관리자로 로그인한 상태에서 오른쪽 상단의 Edit with tagDiv Composer를 클릭합니다.

그러면 뉴스페이퍼 테마의 기본 페이지 빌더인 tagDiv Composer에서 페이지를 편집할 수 있습니다.

페이지 편집 화면이 표시되면 오른쪽의 최신글 목록 요소(①)를 클릭합니다.

왼쪽 패널에 옵션이 표시됩니다. 위의 그림과 같이 Pagination (페이지 매김) 섹션에서 다음과 같은 옵션을 선택할 수 있습니다.

• No pagination - 페이지 매김 (페이지 나눔) 없음
• Normal numbered - 일반적인 번호 방식
• Nex Prev ajax - 에이젝스 방식의 다음/이전 버튼
• Load More button - '추가 로드' 버튼
• Infinite load - 무한 로드 (무한 스크롤링)

다양한 옵션이 제공되므로 마음에 드는 것을 선택하시기 바랍니다. Infinite load를 선택하면 글 목록 하단으로 스크롤하면 자동으로 계속 글이 로드됩니다.

GeneratePress 테마의 무한 스크롤 기능

아바다 등 다른 테마에서도 최신 글을 로드할 때 무한 스크롤 방식으로 로드하는 옵션을 제공합니다. GeneratePress 테마의 경우 유료 버전에서 이 기능을 사용할 수 있습니다.

GeneratePress 테마에서는 외모 > 사용자 정의하기 > Layout > Blog로 이동하여 Content 섹션의 Archives 탭에서 Use infinite scroll 옵션을 체크하면 무한 스크롤 기능이 사용됩니다.

무한 스크롤 기능을 활성화해도 제대로 작동하지 않는 경우가 있을 수 있습니다. 그런 경우에는 다른 플러그인과 충돌을 의심해볼 수 있습니다. 가령, 일부 레이지 로드(Lazy Load) 플러그인을 사용할 경우 충돌을 일으켜 무한 스크롤 기능이 작동하지 않을 수 있습니다.

속도가 빠른 워드프레스 테마를 원한다면 GeneratePress 테마를 고려해볼 수 있습니다. 개인적으로는 이 테마가 속도면에서 가장 빠른 것 같아서 이 테마를 주로 사용하고 있습니다. 제 메인 워드프레스 블로그에도 이 테마가 사용되고 있습니다.

참고

https://avada.tistory.com/916

워드프레스 아바다 테마 데모 설치 및 제거 (Avada Theme)

https://avada.tistory.com/2278

워드프레스 브릿지 테마 포트폴리오 설정하기 (Bridge Theme)

https://avada.tistory.com/554

워드프레스 아바다 테마 라이선스 (Avada Theme)