로딩 중 화면을 표시하는 워드프레스 프리로더 플러그인 5가지

Last Updated: 2020년 12월 07일 | | 댓글 남기기

페이지의 콘텐츠가 로딩되는 동안 '로딩 중' 아이콘이나 메시지를 표시하고 싶은 경우 프리로더 플러그인을 사용할 수 있습니다. 이 글에서는 많이 사용되는 플러그인을 중심으로 몇 가지 무료 및 유료 워드프레스 프리로더 플러그인을 정리해보았습니다.

로딩 중 화면을 표시하는 워드프레스 프리로더 플러그인 5가지

워드프레스 프리로더 플러그인 5가지

페이지 로딩 속도가 느린 경우 프리로더 플러그인을 사용하면 콘텐츠가 로드되는 동안 로딩 중 아이콘이나 문구를 표시할 수 있습니다. 참고로 페이지 로딩 속도가 느려서 고민인 경우 캐시 플러그인과 최적화 플러그인을 사용하여 사이트 최적화를 시도해볼 수 있을 것입니다("워드프레스 사이트 속도 개선").

많은 플러그인을 설치하거나 동일한 기능을 하는 플러그인을 중복 설치할 경우 플러그인 충돌로 인해 사이트 속도가 느려질 수 있고 이상 현상이 발생할 수 있으므로 가급적 꼭 필요한 최소한의 플러그인을 설치하는 것이 좋습니다("페이스북 공유 시 워드프레스 썸네일이 표시되지 않는 경우" 참고).

Preloader Plus – WordPress Loading Screen Plugin (무료)

무료 워드프레스 프리로더 플러그인

Preloader Plus는 웹사이트 페이지가 로딩되는 동안 프리로더(로딩 중 화면)를 표시하거나 Welcome 화면으로 사용할 수 있습니다.

이 플러그인은 워드프레스 사용자 정의하기 (WordPress Customizer) 내에 통합되어 있으므로 각 설정을 변경하면서 결과를 즉시 확인할 수 있습니다.

Preloader Plus는 모든 주요 브라우저에서 작동하며 대부분의 테마와 장치에서 사용할 수 있습니다.

Preloader Plus 기능

  • 모든 페이지 또는 전면 페이지에만 프리로더 표시
  • 첫 번째 방문 시에만 프리로더 표시
  • 커스텀 이미지(jpg, png, gif, svg) 추가
  • 사용자 정의 이미지에 대하여 애니메이션과 속도 설정
  • 진행률 표시줄 표시: 사이즈, 위치 및 컬러 설정
  • 프리로더 화면에 사이트 이름 표시/숨기기
  • 백분율 카운터 표시/숨기기
  • 프리로더 및 텍스트 색상 설정
  • 사이트 제목 및 카운터의 타이포그래피 설정
  • 6개의 애니메이션 아이콘 중에서 선택하고 크기 설정 가능
  • 사용자 정의 콘텐츠 추가 (HTML 및 숏코드도 지원)
  • 프리로더 애니메이션: 투명도, 방향, 거리 및 스케일
  • 애니메이션 지속 시간 및 지연 시간 설정
  • 페이지 콘텐츠 애니메이션: 선택자(Selector), 거리, 방향 및 스케일 선택

Preloader 플러그인 (무료)

Preloader는 쉽게 프리로더를 추가할 수 있고 모든 주요 브라우저와 호환되는 워드프레스 플러그인입니다. 이 플러그인은 무료 프리로더 플러그인 중에서는 가장 많은 사이트에 설치되어 사용되고 있지만, 사용자 평가는 그리 좋은 편은 아니고 최근 사용자 평가를 보면 부정적인 평가가 눈에 띄네요.

특징:

  • 레티나 레디 (이미지의 사이트에 따라 다름).
  • 사용자 정의 배경색
  • 프리로더 표시 옵션 10가지 (전체 사이트에 표시하거나 포스트에만 표시하거나 페이지에만 표시 등)
  • 우커머스 지원
  • jQuery & CSS3.
  • 구글 크롬(Google Chrome), 파이어폭스(FireFox), 오페라(Opera), 사파리(Safari), IE9, IE10, IE1및 아이패드(iPad), 아이폰(iPhone), 안드로이드(Android)와 같은 모바일 기기와 호환
  • 사용이 쉬움

WP Smart Preloader (무료)

워드프레스 무료 프리로더 플러그인 - 로딩 중 화면 표시하기

WP Smart Preloader는 CSS와 미니멀한 HTML 마크업으로 만든 심플한 CSS 스피너(Spinner)와 트로버(Throbber, 고동치는 것)입니다. 콘텐츠가 로드될 때 시각적인 피드백을 제공함으로써 사용자 이탈률을 줄여줍니다.

WP Smart Preloader 플러그인이 기능

  • 완전 반응형으로 동작하며 크로스 브라우저(Cross Browser) 호환
  • CSS만으로 된 프리로더. GIF나 이미지 없음
  • 완전 사용자 정의 가능
  • 빠른 로딩
  • 코딩 불필요. 플러그인을 활성화하고 설정을 설정하면 됨.

LoftLoader Pro - Preloader Plugin for WordPress (유료)

유료 워드프레스 프리로더 플러그인

무료 프리로더 플러그인을 먼저 사용해보시고, 마음에 들지 않으면 유료 프리로더 플러그인을 고려해볼 수 있을 것입니다.

LoftLoader Pro는 이 분야의 유료 플러그인 중에서는 가장 많은 판매를 기록하고 있고 사용자 평가 점수도 5.0(5.0 만점)으로 매우 좋은 편입니다.

유료 플러그인이라서 그런지 다양한 기능이 제공됩니다. 새로운 기능으로 전체 백그라운드 이미지를 프리로더로 표시하여 사용자가 유쾌한 마음(?)으로 기다리도록 할 수 있습니다.

전체 화면 프리로더 - 워드프레스 플러그인
전체 배경 이미지.

데모와 플러그인에 대한 자세한 정보는 LoftLoader Pro 플러그인 사이트를 참고하시기 바랍니다.

WordPress Preloader Unlimited (유료)

워드프레스 WordPress Preloader Unlimited 프리로더 플러그인

또 다른 유료 프리로더 플러그인인 WordPress Preloader Unlimited를 사용하면 멋진 프리로더를 사이트에 추가할 수 있습니다.

이 플러그인도 별 5개 평점으로 사용자들로부터 좋은 평가를 얻고 있습니다.

5가지 옵션 중에서 선택하여 5가지 유형의 프리로더로 변경할 수 있습니다. 이미지 옵션, CSS 옵션, Awesome 옵션, 페이지 JQuery 옵션, Special 옵션 중에서 선택할 수 있고, 사용자 자신만의 커스텀 프리로더도 만들 수 있습니다.

데모와 자세한 정보는 WordPress Preloader Unlimited 플러그인 페이지를 참고해보세요.

참고


댓글 남기기

Leave a Comment