WordPress에 팝업을 추가하는 방법(2가지 쉬운 방법)

게시 됨: 2022-11-21
페이스북 트위터 링크드인

WordPress에 팝업을 추가하는 방법을 알고 싶습니까?

팝업은 방문자의 연락처 정보 수집, 특별 제안 및 판매 제공, 이벤트 사용자 등록 등에 매우 유용합니다.

WordPress 웹사이트가 있는 경우 판매 및 마케팅 전략의 일부로 팝업을 추가하는 것을 진지하게 고려해야 합니다.

팝업이란 무엇입니까?

팝업 또는 팝업 상자는 웹 사이트에서 "팝업"하여 사용자에게 특별한 주의를 기울여야 하는 것을 보여주는 작은 창입니다. 많은 웹사이트에서 팝업 상자 안에 있는 간단한 양식으로 이메일 주소를 요청하는 것을 보셨을 것입니다.

MonsterInsights는 최고의 WordPress Analytics 플러그인입니다. 무료로 받으세요!

팝업을 만들기가 어렵습니까?

기술 경험이 거의 없는 사람들도 WordPress 사이트에서 팝업을 쉽게 만들 수 있습니다. 몇 번의 클릭만으로 WordPress 플러그인을 사용하여 팝업을 만들고, 이메일 주소를 수집하고, 해당 이메일을 이메일 목록에 자동으로 추가할 수도 있습니다.

이 게시물의 나머지 부분에서는 WordPress에서 가장 인기 있는 두 가지 팝업 빌더를 사용하여 팝업을 만드는 두 가지 방법을 보여드리겠습니다.

또한 다른 플러그인을 사용하여 리드 캡처 양식을 만들 것입니다. 팝업 캠페인을 만들 때 양식을 팝업에 삽입합니다.

시작하자!

방법 1: OptinMonster 및 WPForms로 WordPress 팝업 만들기

OptinMonster 팝업 빌더 로고

OptinMonster는 워드프레스용으로 가장 널리 사용되는 팝업 빌딩 플러그인으로 백만 개 이상의 활성 설치가 있습니다. 이름에서 알 수 있듯이 옵트인 양식과 팝업 상자를 만들기 위해 설계되었습니다.

옵트인 양식은 단순히 사용자에게 이메일 또는 마케팅 커뮤니케이션 수신을 "옵트인"하도록 요청하는 양식입니다. 그러나 물론 팝업은 그 이상으로 사용됩니다.

이 플러그인을 사용하면 초보자와 전문가 모두 다양한 목적을 위해 아름답고 매력적인 팝업을 쉽게 만들 수 있습니다.

사용 편의성 외에도 OptinMonster는 다음과 같은 강력한 기능을 제공합니다.

  • 드래그 앤 드롭 팝업 빌더를 사용하면 초보자도 맞춤형 팝업을 디자인할 수 있습니다.
  • 모든 필요에 맞는 400개 이상의 템플릿과 6가지 캠페인 유형
  • 원하는 위치와 시간에 팝업을 표시하는 다양한 트리거링 옵션
  • Exit-Intent, InactivitySensor 및 기타 기술 기능으로 전환율 증가
  • WordPress뿐만 아니라 모든 웹사이트에서 작동(플러그인이 필요하지 않음)

OptinMonster에는 간단한 옵트인 양식을 만들 수 있는 기능이 있습니다. 그러나 더 많은 디자인 옵션이 있는 더 강력한 양식을 위해서는 전용 양식 작성기 플러그인을 제안합니다.

다행스럽게도 OptinMonster를 사용하면 몇 번의 클릭만으로 양식을 팝업에 바로 추가할 수 있습니다. 아래 방법을 사용하여 양식을 추가하기 위해 프로그래밍이나 웹 개발을 알 필요가 없습니다.

이 예에서는 얻을 수 있는 최고의 WordPress용 양식 플러그인인 WPForms를 사용할 것입니다.

WPForms - 팝업을 만드는 최고의 양식 플러그인

두 플러그인을 모두 설치하면 WPForms가 OptinMonster와 자동으로 연결됩니다. 이렇게 하면 사용자 지정 양식이 포함된 전문가 수준의 팝업을 매우 쉽게 만들 수 있습니다.

WPForms를 설치하여 시작하겠습니다.

WordPress에 WPForms 설치

사이트에 WPForms를 설치하려면 WPForms로 이동하여 라이센스를 구입하십시오. WPForms Pro 를 다운로드하여 500개 이상의 템플릿, 결제 처리, 설문 조사 및 기타 고급 기능에 액세스하세요.

그러나 제공되는 계획 중 하나를 사용하여 팝업 양식을 만들 수 있습니다.

라이선스를 받은 후 WPForms 다운로드 를 클릭하여 계정에서 WPForms 플러그인을 다운로드합니다. 이 화면에서 라이센스 옆에 있는 클립보드 아이콘을 클릭하여 라이센스 키를 복사할 수도 있습니다.

WPForms 계정 다운로드 플러그인

이제 WordPress 사이트에 로그인하여 플러그인을 설치하십시오. 플러그인 » 새로 추가 를 먼저 클릭합니다. 그런 다음 플러그인 업로드 버튼을 클릭하고 다운로드한 WPForms 파일을 선택합니다.

WPForms 업로드 설치 플러그인

이 시점에서 설치 를 클릭하여 WPForms 설치 및 활성화를 완료할 수 있습니다. 플러그인이 활성화되면 WPForms » 설정 » 일반 으로 이동하여 이전에 복사한 라이선스 키를 입력합니다. 키 확인 버튼을 클릭하면 모든 설정이 완료됩니다!

WPForms 라이센스 키 확인

WPForms에서 리드 캡처 양식 만들기

WPForms에서 새 양식 만들기를 시작하려면 WordPress 대시보드에서 WPForms » 새로 추가 를 클릭하십시오. 템플릿을 시작점으로 선택하라는 메시지가 표시됩니다.

그러나 먼저 화면 상단의 Name Your Form 상자에 적절한 양식 이름을 입력하십시오. 예제 양식의 이름을 Email Lead Capture - Newsletter Signup 으로 지정하겠습니다.

WPForms 새 양식 제목 및 템플릿

이제 막 시작하는 경우 템플릿을 사용하는 것이 좋습니다. 템플릿 사용 을 클릭하여 뉴스레터 가입 양식 템플릿을 선택해 보겠습니다.

좋습니다. 여기 가입 양식 템플릿이 있습니다. 보시다시피 이것은 이름과 이메일 주소만 묻는 간단한 양식입니다.

WPForms 편집기 가입 양식

기본 설정에 만족하면 지금 저장 을 클릭할 수 있습니다. 그러나 방문자가 양식을 작성할 가능성을 높이기 위해 한 가지만 변경해 보겠습니다.

이름 필드 영역을 클릭하면 필드 옵션 상자가 표시됩니다. 이제 사용자가 양식을 제출하기 위해 해당 부분을 완료할 필요가 없도록 이름 필드를 선택 사항으로 지정하겠습니다. 기본적으로 필수이므로 필수 스위치 "꺼짐"을 클릭하여 이 필드를 선택 사항으로 만드십시오.

WPForms 필드 가입 양식 사용자 정의

이제 저장 을 클릭하여 나중에 사용할 수 있도록 이 양식을 저장할 수 있습니다.

이 시점에서 새 팝업을 만든 다음 저장된 양식을 팝업에 추가합니다. 따라서 다음 단계는 WordPress 팝업 플러그인을 설치하는 것입니다.

WordPress에 OptinMonster 설치

이 단계에서는 무료 버전의 OptinMonster 플러그인을 설치하여 WordPress에 팝업을 만듭니다.

도움이 더 필요한 경우 OptinMonster의 기본 플랜에는 Done-For-You 설정 이 함께 제공됩니다. 즉, OptinMonster 전환 전문가가 첫 번째 팝업 캠페인을 설정하여 성공적인 출시를 보장할 수 있도록 도와드립니다!

무료 OptinMonster 플러그인을 받으려면 WordPress에 로그인하고 대시보드 메뉴에서 플러그인 » 새로 추가 를 클릭하십시오.

워드프레스 플러그인 추가 메뉴

이제 검색 필드에 optinmonster 를 입력하고 입력하십시오. 검색 결과에서 OptinMonster를 찾아 지금 설치 버튼을 클릭합니다.

OptinMonster 활성화

설치가 완료되면 활성화 를 클릭하면 완료됩니다!

OptinMonster로 새 팝업 캠페인 만들기

이제 OptinMonster를 설치하고 활성화했으므로 팝업을 만들 차례입니다.

먼저 OptinMonster » 대시보드 를 클릭하여 옵트인 캠페인에 대한 통계를 표시하는 개요 화면을 봅니다. 여기에서 새 팝업 만들기를 시작할 수도 있습니다. 팝업 타일에서 새로 만들기 를 클릭하기만 하면 됩니다.

OptinMonster 새 팝업 만들기

그런 다음 팝업 상자의 템플릿을 선택해야 하는 새 화면이 표시됩니다.

이 예에서는 Entice 템플릿을 선택합니다. 먼저 템플릿을 미리 보고 필요에 맞는지 확인할 수 있습니다. 팝업 템플릿을 결정했으면 템플릿 사용 을 클릭합니다.

OptinMonster 선택 템플릿

이제 팝업 캠페인의 이름을 지정하라는 메시지가 표시됩니다. 이 예제를 Newsletter Signup 이라고 합니다. 상자에 캠페인 이름을 입력하고 구축 시작 을 클릭합니다.

OptinMonster 팝업 캠페인 이름

버튼을 클릭하면 템플릿을 편집할 준비가 된 OptinMonster의 드래그 앤 드롭 편집기가 열립니다. 이제 WPForms 블록 을 왼쪽에서 팝업으로 드래그하여 새 리드 캡처 양식을 배치할 수 있습니다.

OptinMonster Add Form to Popup

WPForms 블록을 배치하면 팝업에 표시할 양식을 선택할 수 있는 드롭다운 목록이 자동으로 열립니다. 따라서 여기에서 WPForms: Email Lead Capture – Newsletter Signup 에서 만든 양식의 이름을 선택합니다.

추가 버튼 제거

이제 팝업을 저장하기 전 마지막 단계입니다. WPForms 양식에는 제출 버튼이 포함되어 있으므로 OptinMonster 템플릿에서 버튼을 삭제해야 합니다. 그렇게 하려면 블록 안에 커서를 놓고 휴지통 아이콘을 클릭하여 삭제하면 됩니다.

OptinMonster 삭제 차단

저장 버튼을 클릭하여 팝업 및 양식을 저장한 다음 X 를 클릭하여 OptinMonster 편집기를 닫습니다. WordPress 대시보드 및 OptinMonster 캠페인 출력 설정 화면으로 돌아갑니다.

여기에서 WordPress 사이트에 팝업을 표시할 위치와 시기를 결정합니다. 기본적으로 팝업 캠페인은 모든 방문자에게 모든 페이지에 표시됩니다.

그러나 몇 가지 예를 들어 단일 페이지에만 표시하거나 게시물에만 로드하거나 로그인한 사용자에게만 표시하도록 팝업을 설정할 수 있습니다.

이 예에서는 출력 설정을 그대로 둘 수 있습니다. 그러나 팝업을 표시하려면 상태 드롭다운으로 이동하여 상태를 게시됨 으로 변경하십시오. 그런 다음 변경 사항 저장 을 클릭합니다.

OptinMonster WordPress에 팝업 추가

좋아, 그게 다야! 이제 새 팝업 및 리드 캡처 양식이 웹 사이트의 모든 페이지에 표시되어 새 구독자를 모으기 시작합니다.

게시 후 샘플은 다음과 같습니다.

OptinMonster Preview 게시된 팝업

팝업 캠페인이 사이트 방문자를 구독자로 전환한 후 WordPress 대시보드의 WPForms » 항목 으로 이동하여 연락처 정보를 찾을 수 있습니다.

WPForms Optin 팝업 항목

WPForms에는 Sendinblue, Constant Contact 및 기타 인기 있는 이메일 제공업체의 이메일 목록에 새 구독자를 자동으로 추가할 수 있는 애드온이 있습니다. 이를 통해 마케팅 워크플로우를 자동화하여 구독자와 매우 효율적으로 커뮤니케이션할 수 있습니다.

이것이 팝업을 만드는 첫 번째 방법의 전부입니다. WordPress에 팝업을 추가하는 두 번째 방법으로 바로 넘어가겠습니다…

방법 2: Popup Maker 및 WPForms를 사용하여 WordPress에 팝업 추가

팝업 메이커 WordPress 플러그인

700,000명 이상의 활성 사용자가 있는 Popup Maker는 WordPress.org에서 두 번째로 인기 있는 WordPress 팝업 플러그인입니다.

WordPress에 팝업 메이커 설치

먼저 WordPress 사이트에 로그인하고 Plugins » Add New 를 클릭합니다. 검색 창에 팝업 메이커 를 입력하고 입력합니다.

WordPress 플러그인 검색 팝업 메이커

검색 결과에서 Popup Maker를 찾아 지금 설치 버튼을 클릭합니다.

팝업 메이커 워드프레스 플러그인 설치

플러그인이 설치된 후 활성화 를 클릭하면 바로 사용할 수 있습니다! 이제 WordPress 대시보드에 Popup Maker 메뉴가 포함되어야 합니다. Popup Maker » Create Popup 을 클릭하여 새 팝업 만들기를 시작합니다.

새 팝업 만들기

Popup Maker 편집기 화면은 WordPress 페이지 편집기와 매우 유사합니다. 상단 필드에 팝업 이름을 입력합니다. 원하는 경우 두 번째 필드의 팝업 안에 표시될 헤드라인을 입력할 수도 있습니다.

팝업 메이커 편집기

이제 양식 추가 버튼을 클릭하기만 하면 됩니다. 이전에 WPForms에서 만든 양식을 선택할 수 있는 드롭다운 목록이 있는 팝업 상자가 나타납니다.

팝업 메이커 WPForms 양식 추가

계속해서 해당 양식을 선택한 다음 양식 추가 를 클릭하십시오. 이렇게 하면 선택한 양식에 대한 WPForms 단축 코드가 팝업에 추가됩니다.

팝업 메이커 WPForms 쇼트코드

좋습니다. 이제 게시하기 전에 트리거를 설정하여 사이트에서 팝업이 표시되는 시기와 위치를 정의해야 합니다.

팝업 설정 상자까지 아래로 스크롤하고 새 트리거 추가 버튼을 클릭합니다.

팝업 메이커 트리거 추가

여기에서 시간 지연 후, 클릭 시 또는 양식 제출 후 팝업 표시 여부를 선택합니다. 시간 지연 을 선택합시다.

팝업 메이커 시간 지연 트리거

추가 버튼을 클릭하면 Popup Maker가 지연 시간을 밀리초 단위로 묻습니다. 기본값은 500(1/2초)입니다. 그대로 두거나 원하는 경우 변경할 수 있습니다. 그런 다음 다시 추가 를 클릭합니다.

WordPress의 팝업 시간 지연(밀리초)

팝업 설정의 다음 단계는 사이트에서 표시되는 위치, 대상 등을 선택하는 것입니다. 타겟팅 탭을 클릭합니다.

팝업 메이커 타겟팅

이 설정의 드롭다운 목록을 사용하면 팝업이 표시될 특정 페이지를 선택할 수 있습니다. Popup Maker에는 카테고리, 태그, 계층 등에 따라 페이지에 팝업을 표시할 수 있는 다양한 필터도 있습니다.

다음 설정은 여러 디스플레이 옵션을 제공합니다. 타일에서 4개의 표시 옵션 중 하나를 선택한 다음 모양 , 크기 , 애니메이션 , 소리 , 위치고급 설정에 대한 위의 링크를 클릭하여 조정합니다.

팝업 메이커 표시 설정

좋아, 거의 다 됐어! 설정 상자에서 닫기 탭을 클릭합니다. 이제 누군가 가입 양식을 제출한 후 팝업이 닫히도록 해야 합니다. 상단에서 양식 제출 을 클릭한 다음 양식 제출 시 닫기 확인란을 선택합니다.

양식 제출 시 팝업 메이커 닫기

좋아, 지금은 다른 모든 것을 기본 설정으로 둘 수 있습니다. 오른쪽 사이드바에서 게시 버튼을 클릭하여 저장합시다.

이제 웹사이트를 방문하여 라이브 팝업을 확인하세요!

Popup Maker WordPress 샘플에 팝업 추가

첫 번째 방법과 마찬가지로 신규 구독자를 보려면 WPForms » 항목 으로 이동하여 가입한 사람들의 연락처 정보를 확인해야 합니다.

OptinMonster는 더 많은 옵션, 내장 템플릿 및 확장 기능을 갖춘 전반적으로 더 강력한 도구이지만 WP Popup Maker는 기본 캠페인에 잘 작동하는 간단한 대안입니다.

WordPress 웹사이트에 팝업을 추가하는 2가지 쉬운 방법에 대한 자습서의 전부입니다. 또한 WPForms를 사용하여 이메일 리드를 수집하기 위해 옵트인 양식을 만드는 방법도 배웠습니다.

MonsterInsights로 양식 전환 추적

WPForms 항목 화면에서 양식 항목을 보는 방법을 살펴보았습니다. 그러나 양식이 어떻게 수행되고 있는지에 대한 많은 정보를 제공하지는 않습니다.

양식 성능에 대한 자세한 내용을 보려면 Google Analytics를 위한 최고의 WordPress 플러그인인 MonsterInsights와 같은 도구가 필요합니다.

MonsterInsights 보고서 화면

MonsterInsights는 노출, 전환 및 양식당 전환율을 포함하여 사용자가 사이트의 양식과 상호 작용하는 방식을 볼 수 있는 양식 애드온을 제공합니다. 사이트에 추적할 양식이나 팝업이 여러 개 있는 경우 유용합니다.

양식 추적이 활성화된 상태로 MonsterInsights를 설치하면 통찰력 » 보고서 로 이동하고 양식 탭을 클릭하여 양식 보고서를 찾을 수 있습니다.

양식 전환 추적을 위한 MonsterInsights 애드온

이제 WordPress의 한 페이지에서 빠르고 효율적으로 모든 양식, 인상 및 전환을 볼 수 있습니다. 양식과 팝업이 올바르게 표시되는지, 잘 변환되고 있는지 또는 개선이 필요한지 파악하십시오.

MonsterInsights의 추적은 WPForms, Gravity Forms, Formidable Forms, Ninja Forms 등을 포함한 거의 모든 WordPress 양식 플러그인에서 자동으로 작동합니다.

MonsterInsights 시작에 대한 자세한 정보가 필요하십니까? MonsterInsights 설치 및 설정 방법에 대한 자세한 자습서는 이 게시물을 확인하십시오.

웹사이트에 팝업을 추가하는 방법에 대해 배우는 것을 좋아했다면 이메일 뉴스레터를 만드는 방법에 대한 이 기사를 읽을 수 있습니다.

더 유용한 리뷰, 자습서 및 Google Analytics 팁을 보려면 Twitter, Facebook 및 YouTube에서 우리를 팔로우하는 것을 잊지 마십시오.