# 📺 Rapyd Bytes: Hosted Checkout Page with Custom Elements

**URL:** <https://community.rapyd.net/t/rapyd-bytes-hosted-checkout-page-with-custom-elements/58558>\
**Category:** 📺 Videos\
**Tags:** hosted-checkout, video\
**Created:** [April 12, 2023, 7:12pm UTC](https://community.rapyd.net/t/rapyd-bytes-hosted-checkout-page-with-custom-elements/58558 "2023-04-12T19:12:33Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Community\_Team](https://avatars.discourse-cdn.com/v4/letter/c/46a35a/32.png) [@Community\_Team](https://community.rapyd.net/u/Community_Team)\
**Post date:** [April 12, 2023, 7:12pm UTC](https://community.rapyd.net/t/rapyd-bytes-hosted-checkout-page-with-custom-elements/58558/1 "2023-04-12T19:12:33Z")

</div>

[![](https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/a/0/a0daa093969491afffb7da90b34327c85656fd18.jpeg "Rapyd Bytes: Hosted Checkout Page with Custom Elements") ](https://www.youtube.com/watch?v=JaL26f03vhM)

This video teaches you how to create a Hosted Checkout Page with custom elements. Follow along in generating a request in Postman, troubleshooting webhook responses, getting a successful response, and simulating a payment error.

## Presenter

Kyle Pollock - Technical Writer at Rapyd

## Resources

Developer Community [https://community.rapyd.net/](https://community.rapyd.net/)  
Rapyd Bytes: Make your First API Call [https://www.youtube.com/watch?v=JmH7PmFlsyI](https://www.youtube.com/watch?v=JmH7PmFlsyI)  
Payment Checkout Page with FX [https://www.youtube.com/watch?v=4O2Gk0L31PI](https://www.youtube.com/watch?v=4O2Gk0L31PI)  
Create Payment with FX and Fees [https://www.youtube.com/watch?v=KuYLi0xipZU](https://www.youtube.com/watch?v=KuYLi0xipZU)  
Checkout Page [Rapyd Docs | Error](https://docs.rapyd.net/build-with-rapyd/reference/checkout-page)  
Create Checkout Page [Rapyd Docs | Error](https://docs.rapyd.net/build-with-rapyd/reference/checkout-page#create-checkout-page)  
Custom Elements [Rapyd Docs | Error](https://docs.rapyd.net/build-with-rapyd/reference/checkout-page#custom-elements-object)

## Support

If you have a question, please feel free to reach out on our community [https://community.rapyd.net](https://community.rapyd.net), or our support team at [https://support.rapyd.net](https://support.rapyd.net).

## Feedback - short survey to help improve developer content

​​[Online Survey | Built with Qualtrics Experience Management™](https://rapyd.sjc1.qualtrics.com/jfe/form/SV_81yGd8ZtFL0YOSW)

## Updates

Sign up to stay updated with developer news: [Sign Up for the Rapyd Developers Monthly Newsletter | Fintech Insights & API Tips](https://go.rapyd.net/dev-newsletter)

## Table of contents

00:00 Overview  
00:16 Hosted Solutions - New Checkout Page  
01:05 Documentation - Create Checkout Page  
01:40 Documentation - Custom Elements Object  
01:58 Client Portal - Webhooks Setup  
02:21 Postman - Create Checkout Page with Custom Elements  
04:42 Hosted Checkout Page - Customer View  
05:11 Webhooks - Troubleshooting  
06:17 Postman - Retrieve Checkout Page  
07:09 Client Portal - Create Checkout Page  
08:04 Postman - Create Checkout Page with Custom Elements & 3DS  
08:24 Hosted Checkout Page - Customer View  
09:07 Webhooks - Success  
10:23 Postman - Create Checkout Page with Custom Description  
10:58 Hosted Checkout Page - Error  
11:51 Webhooks - Error  
12:24 Postman - Retrieve Payment  
12:50 Recap & Outro
