logo
This section states the purpose of each page.

✏️ Introduction

In this summary, we will describe each page and its content. The Page Element is the fundamental one that contains all the other elements.
πŸ’‘
Tip: See Bubble Reference for more information about Pages element https://bubble.io/reference#Elements.Page πŸ™‚

Pages

index

This is the main page typically encountered first on the web app that usually contains links to the other pages of the site. A homepage includes a variety of menus that make it easy for users to find the information they need.
The page describes what are the template features and what it offers.
Image without caption
The design for this page consists of 2 main Group containers, one destined for Hero section "Group Hero" and the second "Row_2_index" for holding all of the other elements on-page.
"Row_2_index" is the main container for the second row in the design, which holds the "Group Content Container" used for holding different parts of the second row like groups, texts, repeating groups, etc. Check their respective element properties to see how they're arranged.
Image without caption
The workflow actions on this page are only for navigating to other pages within the template using Go to page action.

cards

This is the page where users can see a list of cards with the option to add or remove a card from the list. Here users can as well make a card default to use it for future purchases.
Image without caption
The design for this page consists of a main "Group container", which holds all of the important elements on page, including group containers for repeating groups, text elements, images, buttons etc.
There are two reusable elements on page as well Header and Steps Direction are part of the page.
Image without caption
The workflow actions on this page are showing and hiding different elements on-page. Some of the actions are working with data, by saving, modifying, and deleting values inside Customer, User database types.

coupons

This is the page made to demonstrate how coupons work. Here, users can preview the actions to create a coupon, to use it during the checkout, as well as see the list of all the coupons created. The coupon discount can be seen on the Stripe checkout side.
Image without caption
The design for this page consists of a main group "Group Retrieve all coupon (Stripe Marketplace)" which holds all of the content on the page. The page structure is divided into more containers designed for respective elements, like texts, dropdown elements, repeating groups, etc.
There is a pop-up "Pop-up create coupon" used as a form during coupon creation which comes with elements on top of page layout.
There are two reusable elements on page as well Header and Steps Direction are part of the page.
Image without caption
The workflow actions on this page are showing and hiding different elements on-page. Some of the actions are working with data, by saving, modifying, and deleting values inside Customer, User database types.

custom_account

This page is used for the creation of Stripe accounts. As a user, you can select what type of account you want to create (Standard, Express or Custom). Both Standard and Express types of accounts will redirect the user to Stripe side to connect via Oauth and create the account there. The custom type of Stripe account lets the user fill out the form for account creation inside the platform without leaving it.
Image without caption
The design for this page consists of two main groups "Group Account Type" and "Group Demo Custom Account" which hold all of the content on the page. The page structure is divided into more containers designed for elements, like groups, texts, images, repeating groups, etc.
There are a couple of pop-ups: Popup "Stripe error", "Update Stripe", "success" and Popup "loading" used for UI/UX to show alerts, or loading screen information during account creation.
There is the reusable element - Header on page as well.
Image without caption
The workflow actions on this page are showing and hiding different elements on-page. Some of the actions are working with data, by saving, modifying inside, User database type, also using set state to set a value to an element.
Since this page is used for account creation, here will be present Stripe Marketplace plugin actions and/or calls.

orders

This page was created to show how refunds through Stripe work. There is a list of generated orders for these purposes. There is a possibility to refund any eligible order directly via platform action. After the refund process was approved there is an option to delete the order from the list.
Image without caption
The design for this page consists of the main group container "Group Container" which holds all of the content on the page. This container is divided into two more containers designed for elements, like groups, texts, images, repeating groups, etc.
There are five pop-up elements on-page used for actions to confirm/deny them, or as notification message elements.
There are two reusable elements on-page as well Header and Steps Direction are part of the page.
Image without caption
The workflow actions on this page are showing and hiding different elements on-page. Some of the actions are working with data, by saving, modifying and deleting Orderdatabase type, also using set state to set a value to an element.
Since this page is used for orders management, here will be present Stripe Marketplace plugin actions and/or calls.

split-payments

This is the page to see how the split payments work: we show how the customer payment (100" button. You when will be redirected to Stripe side and complete the process. Please fill in test Stripe card credentials.
Image without caption
The design for this page consists of a main group container "Group Container" which holds all of the content on the page. This container is divided into couple more containers: "RG Standart Subscriptions" , "Group Standard Subscriptions" , "Group Title" , "RG Subscriptions" and "Group Form (useCollapse)", the last one being invisible which are designed for elements, like groups, texts, images, etc. Also there are a couple of popups for preloader and subscription manipulation.
There are two reusable elements on-page as well Header and Steps Direction are part of the page.
Image without caption
The workflow actions on this page are: working with data by saving, making changes inside the User database type, also using showing and hiding different elements on-page. As well as resetting values for group/pop-ups and relevant inputs.
Since this page is used for showcasing split payments, here will be present Stripe Marketplace plugin actions and/or calls.

reset_pw

This page is for resetting the password.
Image without caption
The workflow actions are simple and straightforward which consist of reset password and set focus of input.

404

This is a custom-designed page for 404 redirect errors, informing a user that the requested web page cannot be found, or doesn't exist.
Image without caption
The design of the page is simple and consists of the main group container "Group Main Container" which holds other elements on-page.
Image without caption
The only workflow action which can be found on this page is navigation to index page.

Helpful?