우리의 명확한 단계별 가이드를 통해 Bubble.io와 HubSpot 마케팅 허브를 통합하는 방법을 배우세요. 오늘 당신의 비즈니스의 효율성을 향상시키세요!
HubSpot 마케팅 허브는 이메일 마케팅, 소셜 미디어 마케팅, 콘텐츠 관리, 웹 분석, 그리고 검색 엔진 최적화를 포함하는 일체형 인바운드 마케팅 엔진입니다. 이것은 기업에게 방문자를 유치하고, 리드로 변환시키고, 고객으로 확보하는데 도움을 줍니다. 이 도구는 단일 플랫폼을 사용하여 캠페인을 생성하고 관리하는데 도움을 줍니다. 또한 이 도구는 마케팅 자동화, 리드 관리, 마케팅 분석과 같은 기능을 제공함으로써 기업들이 자신의 마케팅 운영을 간소화할 수 있게 합니다.
Book a call with an Expert
Starting a new venture? Need to upgrade your web or mobile app? RapidDev builds Bubble apps with your growth in mind.
1 단계: Bubble.io 계정 생성
아직 계정을 만들지 않았다면 Bubble.io에서 무료 계정을 만들어야 합니다. 홈페이지(www.bubble.io)를 방문하여 가입하세요.
2 단계: Bubble.io에서 앱 생성
로그인 한 후, 대시보드로 이동하여 "New App" 버튼을 클릭합니다. 애플리케이션에 이름을 지정하고 "Create"를 클릭하세요.
3 단계: HubSpot 계정 만들기
Bubble.io와 마찬가지로, HubSpot에서도 무료 계정을 만들어야 합니다. HubSpot 홈페이지(www.hubspot.com)를 방문하여 무료 계정을 가입하세요.
4 단계: HubSpot API 키 이해하기
HubSpot의 API 키는 접속을 인증하는데 사용되는 고유 식별자로, Bubble.io와 HubSpot을 연결하는데 사용할 것입니다. 이 키를 찾기 위해서는 HubSpot 계정에 로그인한 후, 상단 오른쪽에 있는 "설정" 아이콘(톱니바퀴 모양)을 클릭합니다. 그 후, 왼쪽 사이드바 메뉴에서 "Integrations" > "API key"로 이동하세요. API키가 아직 생성되지 않았다면 "Create Key"를 클릭하세요.
5 단계: HubSpot의 API를 Bubble.io에 통합시키기
Bubble.io 애플리케이션으로 돌아가세요. "Data" 탭으로 전환한 후 "App Data"를 클릭합니다. 그리고 드롭다운 메뉴에서 "APIs"를 선택하세요. "+ Add another API"를 클릭하세요. 팝업 인터페이스에 "API Name"과 "Key"란을 HubSpot 계정 정보로 채워넣습니다.
6 단계: API 설정
이제 새 API를 설정해야 합니다. "shared headers"의 드롭다운 메뉴에서 "JSON"을 선택하세요. 이것은 HubSpot가 사용하는 형식입니다. "shared headers" 필드에 Content-Type:application/json 입력하세요. 요청을 인증하도록 HubSpot 사용 Api-key 기반 방법이므로, "shared parameter"로 hapikey를 Bearer {YourHubSpotApi}로 설정해야 합니다.
7 단계: API 호출 설정
이 시점에서 필요한 모든 API 호출을 정의해야 합니다. 이것은 통합을 통해 얻고자 하는 것에 크게 달려 있습니다. 예를 들어, 가입 양식을 만들고 있다면 "Create contact" 호출이 필요할 것입니다. 블로그 게시물을 표시하는 시스템을 만들고 있다면 "Get all posts" 호출이 필요할 것입니다.
"API Calls" 섹션에서 "+ Add another API Call" 버튼을 누르세요. API 호출에 이름을 지정하세요. 예를 들어, "Create Contact". "Data Type"을 JSON으로 설정하세요. 마지막으로, API 호출에 대한 올바른 URL 및 기타 정보를 복사하려면 HubSpot API 문서를 참조하세요.
8 단계: API 호출 사용
모든 설정이 완료되면, 워크플로에서 API 호출을 사용할 수 있습니다. Design 탭으로 이동하고 API 호출을 사용하여 원하는 기능을 구축하세요.
9 단계: 통합 테스트
마지막으로, 모든 것이 예상대로 작동하는지 확인하기 위해 방금 만든 통합을 테스트해야 합니다. Bubble.io의 미리보기 기능 또는 API 커넥터의 테스트 기능을 이용할 수 있습니다.
축하합니다, Bubble.io를 HubSpot의 마케팅 허브와 성공적으로 통합했습니다! 기억하세요, 워크플로는 당신이 만들고 있는 특정 통합에 따라 달라질 것이므로, Bubble.io와 HubSpot의 문서를 참조하는 것이 중요합니다.
시나리오: 전자상거래 사업자가 새로운 제품 라인을 출시하고 개인화된 이메일 마케팅을 통해 소비자 참여 및 판매 증대를 원합니다. 그들은 Bubble.io를 사용하여 고객이 새로운 제품 라인을 탐색하고 자신의 관심사를 등록할 수 있는 동적 제품 랜딩 페이지를 구축합니다. 소비자 데이터를 수집하고 맞춤형 이메일 내용을 디자인하는 과정을 간소화하기 위해, 이 사업자는 이 랜딩 페이지를 HubSpot Marketing Hub와 통합하길 원합니다.
솔루션: Bubble.io와 HubSpot 통합
랜딩 페이지 생성: 이 전자상거래 사업자는 Bubble.io를 사용하여 고객이 연락처 세부 정보 및 제품 선호도를 제공할 수 있는 관심 등록 양식이 포함된 제품 랜딩 페이지를 생성합니다.
통합 환경 설정: 이 사업자는 Bubble.io에 HubSpot 플러그인을 설치하고, HubSpot API 키를 이용하여 두 플랫폼을 연결합니다. 고객이 제품 랜딩 페이지에서 양식을 작성하고 제출할 때 작동하는 워크플로우를 Bubble.io에서 설립합니다.
데이터 동기화 워크플로우: 고객이 양식에 참여하면 워크플로우가 활성화되고, 제공된 세부 사항(예: 이름, 이메일, 제품 관심사)이 HubSpot 플러그인 액션을 통해 실시간으로 HubSpot에 전송됩니다. HubSpot 내에 개별적인 소비자 프로필이 생성되어 제출된 데이터와 연결되며, 포괄적인 추적을 위해 특정 소비자 세그먼트에 할당됩니다.
HubSpot에서의 이메일 캠페인: 이 전자상거래 사업자는 HubSpot의 마케팅 도구를 사용하여 새 제품 랜딩 페이지에서 얻은 데이터를 기반으로 개인화된 이메일 캠페인을 디자인하고 론칭합니다. 이 캠페인에는 각 고객의 선호도에 맞춘 제품 추천, 알림, 특별 제안이 포함될 수 있습니다.
성과 모니터링 및 분석: HubSpot의 Bubble.io 통합은 이메일 캠페인에 대한 고객 행동 및 반응의 원활한 모니터링을 제공합니다. 이 전자상거래 사업자는 제품 출시의 성공률을 평가하고 고객 참여 및 판매 증대를 최대화하기 위해 전략을 조정할 수 있습니다.
혜택:
효율성: 통합은 데이터 수집 과정을 자동화하여 수동 작업과 잠재적 오류를 줄입니다.
중앙집중화된 데이터: 모든 소비자 데이터는 하나의 장소인 HubSpot에서 수집, 저장, 관리되어 사업체에 대한 통합된 고객 뷰를 제공합니다.
개인화된 마케팅: 소비자 데이터의 풍부함은 맞춤형 이메일 컨텐츠의 개발을 가능하게 하며, 고객 참여 및 판매 가능성을 증가시킵니다.
데이터 인사이트: HubSpot에서 고객 데이터, 캠페인 성능, 판매 분석을 통해 사업체는 전자상거래 전략을 미세 조정하고 제품 출시 및 참여 노력을 최적화할 수 있습니다.
결론적으로, Bubble.io를 HubSpot와 통합하면 전자상거래 사업체의 마케팅 노력을 간소화하고, 개인화를 강화하며, 새로 출시된 제품 라인의 판매를 촉진합니다.
.svg)
Delve into comprehensive reviews of top no-code tools to find the perfect platform for your development needs. Explore expert insights, user feedback, and detailed comparisons to make informed decisions and accelerate your no-code project development.
.svg)
Discover our comprehensive WeWeb tutorial directory tailored for all skill levels. Unlock the potential of no-code development with our detailed guides, walkthroughs, and practical tips designed to elevate your WeWeb projects.
.svg)
Discover the best no-code tools for your projects with our detailed comparisons and side-by-side reviews. Evaluate features, usability, and performance across leading platforms to choose the tool that fits your development needs and enhances your productivity.
Then all you have to do is schedule your free consultation. During our first discussion, we’ll sketch out a high-level plan, provide you with a timeline, and give you an estimate.
.png)
.png)
