WordPress에 더 많은 게시물 로드 버튼을 추가하는 방법

게시 됨: 2018-06-25

블로거이자 콘텐츠 제작자는 사람들이 계속 참여하고 게시물을 읽도록 하고 싶습니다. 이를 수행하는 방법에는 여러 가지가 있습니다. 좋은 검색 또는 태그 지정 시스템, 최근 게시물 링크 가 있는 사이드바 , 독자가 페이지 맨 아래에 도달하면 이전 게시물 갤러리 등입니다.

또 다른 좋은 방법은 무한 스크롤이라고도 하는 "더 많은 게시물 로드" 버튼을 사용하는 것입니다. 이렇게 하면 관심 있는 독자가 원하는 만큼 콘텐츠를 살펴보게 됩니다. 플러그인을 다운로드하거나 코딩 작업을 수행하려는 경우 이 귀중한 기능을 WordPress 사이트에 쉽게 추가할 수 있습니다. 시작하자.

왜 무한 스크롤링인가?

infinity

사용자가 다음 페이지로 이동할 때 전체 사이트를 다시 로드해야 합니다. 탐색 표시줄, 배경 등 — 이러한 요소가 캐시되어 있을 수 있지만 몇 초만 더 기다려야 합니다. 무한 스크롤을 사용하면 새 게시물만 로드하면 되며 시간이 조금 걸립니다.

또한 무한 스크롤은 방문자를 계속 읽습니다. 오래된 게시물을 찾기 위해 검색해야 하는 경우 계속 읽지 않을 수 있습니다. 그러나 바로 거기에 버튼이 있으면 조금 더 오래 머물 수 있습니다.

WordPress에 추가 로드 버튼을 추가할 준비가 되었다면 명심해야 할 몇 가지 사항이 있습니다.

  • 템플릿 파일이나 코드를 편집하기 전에 항상 WordPress 사이트를 백업하십시오. 또는 기본 사이트에 변경 사항을 적용하기 전에 하위 테마 를 사용하여 실험해 보십시오.
  • WordPress 플러그인을 설치하려면 WordPress 관리 영역으로 이동하여 "플러그인" 아래의 "새로 추가" 버튼을 클릭하십시오. 거기에서 원하는 플러그인을 검색하여 설치하고 활성화하십시오. 그렇게 쉽게!
  • 그래도 작동하지 않으면 찾은 곳에서 플러그인을 다운로드하십시오. 다시 "새로 추가"로 이동하지만 이번에는 "업로드"를 클릭하여 파일을 업로드합니다. 그런 다음 플러그인을 설치하고 활성화합니다.
  • 이러한 방법이 작동하지 않는 것 같으면 일부 플러그인은 다른 설치 지침과 함께 제공됩니다!

플러그인 없이

플러그인 사용자가 아닌가요? 이 작업을 직접 수행하고 싶다면 걱정할 필요가 없습니다. 이것을 직접 코딩하거나 플러그인을 만들고 싶다면 이 가이드 또는 가이드 를 따르세요 . 둘 다 이 기능을 스스로 설정하는 데 도움이 될 수 있습니다. 하지만 플러그인이 제공할 수 있는 추가 기능과 쉬운 사용자 정의를 놓칠 수 있습니다.

이 자습서에는 무서운 코드가 많이 포함되어 있지만 지침을 따르는 한 너무 어렵지는 않습니다. 게시물이 충분하지 않은 경우 버튼이 표시되지 않도록 몇 가지 매개변수를 설정하고, 기본 코드를 설정하고, CSS로 보기 좋게 만듭니다.

쉽게 더 로드

플러그인을 선호한다면 선택하기에 좋은 플러그인입니다. Easy Load More는 이름에서 알 수 있듯이 지연 로딩 플러그인입니다. Ajax를 사용하여 같은 페이지에 추가 게시물을 로드하고 테마 파일을 거의 편집할 필요가 없습니다. 플러그인은 최소한의 사용자 정의 가능한 기본 버튼, 작은 Javascript 크기, SVG로 렌더링된 로딩 아이콘을 사용하여 이미지 파일을 다운로드할 필요가 없도록 특별히 표시를 최소화하도록 만들어졌습니다.

플러그인을 다운로드하면 설정하기가 정말 쉽습니다. 먼저 플러그인 메뉴의 설정 페이지에서 플러그인을 구성해야 합니다. 그런 다음 무한 스크롤을 원하는 페이지를 찾아 테마의 템플릿 파일에 "load_more_button()" 함수를 추가합니다. 홈페이지에서 아카이브 페이지에 이르기까지 사용자 정의 템플릿과 모든 페이지에서 작동합니다.

Ajax 더 로드

더 고급 기능을 찾고 있다면 Ajax Load More에 추가 기능이 많이 제공됩니다.

Ajax load more

다른 페이지, 게시물 또는 댓글에 대한 사용자 지정 쿼리를 만들 수 있는 단축 코드 작성기가 있습니다. 쿼리 매개변수는 로드되는 게시물이 특정 카테고리 또는 게시물 유형에 속할 수 있음을 의미하며 특정 게시물도 필터링할 수 있습니다. 플러그인이 테마와 완벽하게 일치하도록 템플릿을 만들 수도 있습니다.

이러한 모든 기능 외에도 기능을 더욱 확장하는 추가 기능이 있습니다. 게시물을 미리 로드하거나 지연 로드를 페이지로 바꾸거나 플러그인의 모양과 레이아웃을 변경하세요!

Ajax Load More는 고급 사용자가 광범위하게 사용자 정의하고 조정할 수 있지만 설정하는 것은 매우 작은 시련입니다. Shortcode Builder를 사용하여 사용자 정의 단축 코드를 만들고 콘텐츠 편집기를 통해 직접 또는 템플릿 파일에 배치하여 사이트에 추가하십시오. 그리고 그것이 당신이해야 할 모든 것입니다!

WooCommerce에 대한 더 많은 제품 로드

Load More Products for WooCommerce

전자 상거래를 사용하는 경우 이 특수 유형의 추가 로드 버튼은 유사한 Ajax 코딩을 사용하여 무한 제품을 로드합니다. 여러 WooCommerce 플러그인과 호환됩니다. 무료 버전을 사용하면 버튼과 몇 가지 기본 사용자 지정 기능으로 무한 스크롤에 액세스할 수 있습니다. 유료 플러그인에는 애니메이션, 버튼 사용자 정의 및 모바일 장치에 대한 다양한 로드가 포함된 여러 지연 로드 옵션이 있습니다.

단순 더 로드

간단하고 쉽게 활성화할 수 있는 것이 필요한 경우 Simple Load More가 작업을 완료합니다. 홈페이지에서 자동으로 활성화되므로 필요한 경우 설치, 설정 및 완료하면 됩니다.

Simple Load More

다른 페이지에 필요한 경우 간단한 설정을 수행하고 버튼을 원하는 페이지의 템플릿 파일에 "simple_more_button()" 기능 또는 단축 코드 "[load_more button_text="ABC"]"를 추가하세요.

무엇이든 더 로드

간단한 jQuery 로드 추가 플러그인을 사용해보고 싶다면 이 플러그인을 확인하세요. Load More Everything은 모든 페이지, 모든 콘텐츠에 대해 어디서나 작동합니다. 게시물, 댓글, 제품, 이미지 등 무엇이든, 어디서나.

이를 위해서는 약간의 기술 지식이 필요합니다. 테마 파일을 엉망으로 만들 필요는 없지만 버튼을 표시하려는 위치와 콘텐츠를 가져올 위치와 관련된 "div" 태그를 찾아야 합니다. 가장 쉬운 방법은 버튼을 원하는 위치에 "요소 검사"를 사용하고 올바른 div, 클래스 또는 옆 태그를 찾는 것입니다. 웹 개발자가 아니거나 Inspect Element를 탐색하는 방법을 모르는 경우 이 단계를 건너뛸 수 있습니다.

Load More Anything

Load More로 쉽게 독자 참여

그렇게 어려운 일은 아니었어요, 그렇죠? 무한 스크롤은 방문자가 여러 페이지를 로드하거나 탐색 링크를 거치지 않고도 더 많은 콘텐츠에 쉽게 액세스할 수 있는 좋은 방법입니다. 간단하고 가능한 혼란을 제거합니다. 웹사이트에 추가 로드 버튼이 아직 없다면 무엇을 기다리고 계십니까?

이 가이드가 도움이 되었다면 Facebook Twitter 에서 더 많은 WordPress 팁과 튜토리얼을 확인하세요. 그리고 보고 싶은 워드프레스 튜토리얼이 있다면 아래 댓글로 알려주세요.