makeBCT

#AI #OpenAI #Chatbot #Cloud #WordPress

워드프레스에서 사용자 정보 입력 후 파일을 다운로드 할 수 있는 방법 2

이전 글 “워드프레스에서 사용자 정보 입력 후 파일을 다운로드 할 수 있는 방법”에서 사용자 정보를 입력한 후 파일을 다운로드 할 수 있는 방법을 정리한 적이 있습니다. (참고)

 

이번 글에서는 이전 글과 유사하나 사용자 입력 폼을 팝업으로 띄우고 팝업에서 사용자 정보 입력과 파일을 다운로드 할 수 있는 방법을 설명합니다. 이 글에서 최종 보게 될 결과는 다음과 같습니다.

 

 

이 작업을 위해 필요한 플러그인 종류 및 버전 정보는 다음과 같습니다.

 

 

각 플러그인의 설치 및 활성화 과정은 이미 완료된 것으로 가정하고 다음을 진행합니다.

 

 

(1) Contact Form 7 설정

 

Contact Form 7에서는 사용자 정보를 위한 폼을 설정할 수 있습니다. 폼 설정은 ’워드프레스 관리자 > Contact > Contact Forms’ 메뉴에서 할 수 있으며, 완성된 폼 설정은 다음과 같습니다.

 

 

 

 

(2) Download Monitor 설정

 

Download Mionitor에서는 사용자 정보 입력 후 다운로드 할 파일을 등록합니다. 파일 등록은 다음과 같이 ’워드프레스 관리자 > Downloads > Add New’에서 할 수 있습니다.

 

 

 

참고로 사용자 정보 입력 후 다운로드 파일이 제목 또는 파일명 등을 설정할 수 있는데, 이는 ‘워드프레스 관리자 > Downloads > Settings’ 에서 설정할 수 있습니다. 설정 옵션은 다음과 같습니다.

 

 

 

(3) Email Before Download 설정

 

Email Before Download에서는 앞서 설명한 contact form 7 과 Download Monitor를 연결하는 설정을 합니다. 설정은 ’워드프레스 관리자 > 설정 > Email Before Download’ 에서 할 수 있으며, 설정 화면은 다음과 같습니다.

 

 

만약 복수개 파일을 다운로드 할 경우 추가 설정이 필요할 수 있지만, 단일 파일 경우 위 화면의 Default Delivery Format 설정 외는 추가로 설정할 필요 없이 기본 설정을 사용해도 무방합니다.

 

 

(4) 적용

 

이제 다음 버튼 클릭 시 팝업 창이 뜨도록 설정을 해 보겠습니다.

 

 

 

위 화면의 코드는 다음과 같으며, 앞에서 설명되지 않은 easy fancybox 코드가 추가된 것을 볼 수 있습니다.

<p style=”text-align: center;”><a class=”btn_down2 fancybox” href=”#contact_form_pop”>제품소개 다운로드</a></p>

<div style=”display:none” class=”fancybox-hidden”>
   <div id=”contact_form_pop”>
      [email-download download_id=”2507″ contact_form_id=”2505″]
   </div>
</div>

이제 [제품소개 다운로드] 버튼 클릭 시 다음과 같이 팝업이 뜨고, 팝업창 내에 앞서 설정한 컨택 폼을 볼 수 있습니다.

 

 

사용자 정보 입력한 다음 다운로드 할 파일은 다음과 같이 볼 수 있습니다.

 

 

위 화면의 test1 을 클릭하면 등록된 파일을 다운로드 할 수 있습니다.

 

 

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

인기 글

Ubuntu 22.04 LTS에 Python 3.8 or 3.9 설치 방법
서버 : Vultr 클라우드OS: Ubuntu 22.04 LTS사용자 계정 생성하여 설치 진행함 1. Start with the system update sudo apt update...
Input error: k: Format of site key was invalid 에러 해결 방법
WP-Members 워드프레스 플러그인을 활용해서 회원가입 기능을 구현 하였는데, 다음과 같은 에러가 발생 하였습니다.         이는 WP-Members의...
AWS 인스턴스 유형 변경 방법
AWS 인스턴스 유형을 변경하기 위한 방법에는 다음 2가지가 있습니다.   1. 첫 번째 방법 AMI 이미지 생성 후 해당 이미지를 복원하여 신규 EC2 인스턴스를 생성하는...
사용자 작성 모듈 import 시 에러)(ModuleNotFoundError: No module named
파이썬 모듈을 만들고 테스트 할 때 ModuleNotFoundError: No module named 에러가 발생한 경우 원인 파이썬은 모듈을 불러올 때 모듈 설치 경로와 자신의...
오라클 클라우드 OCI 가입 드디어 성공 했습니다 (상세 후기)
2023년 2월 16일에 ‘오라클 클라우드 지급 검증 실패 글‘을 남긴 적이 있습니다. 그 때 검색을 통해 해결 방법을 찾아 보았고, 당시 성공했던 분들의...