본문 바로가기
디자인 이야기

워드프레스 웹 사이트에 구독 신청 폼 연동

by editor. clara 2017. 10. 11.


이전 글에서 이메일 자동화(Autoresponder) 시스템 중의 하나인 겟리스판스(Getresponse)에서 캠페인을 만들어보고 구독 이메일 리스트를 가져와서 등록해 보았습니다이번에는 겟리스판스(Getresponse)에서 구독 신청 폼을 만들고 폼을 워드프레스 사이드바에 추가해서 연동해 보겠습니다.

 

겟리스판스(Getresponse) 로그인하고 상단 내비게이션 목록 중에서 ' 양식' 메뉴의 '양식 작성'으로 들어갑니다.

 

이렇게 들어가면 템플릿들이 보이는데 번째 템플릿을 가지고 만들어 보겠습니다.

 

폼을 수정하기 위해서 "Type your headline here..." 클릭해서 원하는 타이틀을 입력합니다. 우측 스타일 탭에서 색상도 조정할 있는데 여기서는 색상 코드를 직접 입력해서 편집했습니다. 이렇게 색상도 스타일 탭에서 편집해줄 있습니다.

 

사이즈 조절은 상하좌우 꼭짓점을 잡아서 조절할 있습니다. 원하는 사이즈로 조절한 다음 우측 상단에 '저장' 버튼을 눌러줍니다.

 

상단 우측에 톱니바퀴 모양의 설정 아이콘을 눌러 보면 양식 이름과 옵션을 선택할 있는 팝업창이 아래에서 올라옵니다. 여기서는 기본으로 설정해 놓겠습니다.

 

다시 메인으로 가서 상단 내비게이션 목록 중에서 ' 양식' 메뉴의 '양식 관리' 들어갑니다.

 

여기에서 지금까지 만들었던 폼양식을 있습니다. '작업' 버튼을 클릭해서 '편집'으로 들어가면 다시 수정을 있습니다. 워드프레스랑 연동을 해야 하기 때문에 '게시(Publish)' ON으로 설정해야 합니다.

 

이제 워드프레스로 가서, '플러그인 <플러그인 추가하기' 들어갑니다.

 

키워드에서 'Getresponse Integration' 검색해서 플러그인을 설치하고 활성화시켜 줍니다.

 

'Getresponse Integration Plugin' Settings 클릭하고 들어갑니다.

 

여기에 GetResponse API 키를 입력해야 됩니다. 일단 워드프레스에서 페이지를 열어둡니다.

 

다시 겟리스판스(Getresponse) 사이트로 가서 '내 계정 < 계정 세부정보'로 들어갑니다.

 

좌측 목록 중에 'API & OAuth' 을 눌러서 보이는 페이지에서 '기본 API 키'에 나오는 키 번호를 복사합니다.

 

다시 워드프레스로 와서 '설정 < Getresponse'로 가서 'GetResponse Plugin Settings'에 있는 박스에 조금 전 복사한 GetResponse API Key 번호를 붙여 넣고 저장합니다.

 

이렇게 설정하고 나면 워드프레스와 겟리스판스(Getresponse)가 연동되는 것입니다. 이제 이것을 워드프레스 사이드바에 위젯으로 추가하겠습니다. 댓글에도 넣고 싶으면 옵션 설정에서 'Subscribe via Comment' 부분을 'On'으로 설정해주고 저장하면 됩니다.

 

워드프레스에서 '외모 < 위젯'으로 가면 'GetResponse Web Form' 위젯이 보일 것입니다. 이것을 끌어다가 오른쪽 Right Sidebar 박스 제일 상단에 위치시킵니다.

 

여기서 옵션은 기본 설정으로 놓고 저장하기 해줍니다.

 

워드프레스 사이트  보기에서 About 페이지의 우측 사이드바를 보면 구독신청 폼이 만들어진 것을 볼 수 있습니다. 이메일 주소와 이름을 입력하고 'Submit' 버튼을 클릭하면 승인 표시가 나타나는 것을 확인할 수 있습니다.

 

조금 전에 워드프레스에서 이메일 주소와 이름을 넣고 구독한 이메일을 GetResponse에서 확인해 보겠습니다.

 

GetResponse 사이트로 가서 상단 내비게이션 목록 중에서 '연락처' 메뉴의 '연락처 검색'으로 들어갑니다.

 

여기서 이메일이나 이름을 검색해서 찾아보거나, 그 아래 있는 '모든 연락처 보기' 링크를 클릭해 봅니다.

 

조금 전 워드프레스에서 등록한 이메일 이름이 연락처 리스트에 들어온 것을 확인할 수 있습니다.

 

지금까지 겟리스판스(Getresponse)에서 구독 신청 폼을 만들어서 그 폼을 워드프레스 사이드바에 플러그인으로 추가해서 연동해 보았습니다. 다음 시간에는 메시지 자동 회신 작성에서 자동 이메일을 작성해 보겠습니다.



당신에게 추천하는 콘텐츠