# Using the sign-in banner flow

***

title: Using the sign-in banner flow
slug: using-the-sign-in-banner-flow
order: 0
hidden: false
-------------

The sign-in flow adds Prime delivery to your website, embedded within your existing checkout pages. Shoppers can sign in and choose to pay with any preferred payment method that you offer on your website. Feedback suggests this flow resonated the most clearly with shoppers.

# Steps on the shopper's journey

* <a href="#category-page">Category page</a>
* <a href="#product-detail-page"> Product detail page</a>
* <a href="#mini-cart">Mini-cart</a>
* <a href="#cart">Cart</a>
* <a href="#checkout---shipping-details">Checkout - Shipping details</a>
* <a href="#consent-screen">Consent screen</a>
* <a href="#checkout---review-order">Checkout - Review order</a>
* <a href="#order-confirmation">Order confirmation</a>

# Shopper's journey

## Category page

<table>
	<tr>
		<td style="vertical-align:top;width: 344px;"><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-category-page.png" alt="Category page" /></td>
        <td style="vertical-align:top;">The <a href="doc:prime-check-logo">Prime Check logo</a> highlights products with Prime eligibility. It signals that Prime delivery is an option, but that a Prime membership isn't required to use a different delivery option.<br><br><b>Components</b><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-category-page-component.png" alt="Prime check logo component" /></td>
	</tr>
</table>

## Product detail page

<table>
    <tr>
		<td style="vertical-align:top;width: 344px;"><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-pdp-v2.jpg" alt="Product detail page" /></td>
        <td style="vertical-align:top;">The <a href="doc:prime-check-logo">Prime Check logo</a> highlights products with Prime eligibility. It signals that Prime delivery is an option, but that a Prime membership isn't required to use a different delivery option. Place the Prime Check logo near the top of the product detail page to ensure visibility.<br><br>The <a href="doc:sign-in-card">sign-in card</a> is used to indicate Prime eligibility, delivery information, and benefits of fast, free delivery and easy returns.<br><br><b>Components</b><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-pdp-component-0.png"><br><br><p style="text-align: center;"><i>AND</i></p><br><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-pdp-component.png" alt="Sign-in card" /></td>
	</tr>
</table>

## Mini-cart

<table>
    <tr>
		<td style="vertical-align:top;width: 344px;"><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-mini-cart.png" alt="Mini-cart" /></td>
        <td style="vertical-align:top;">The <a href="doc:prime-check-logo">Prime Check logo</a> appears on eligible products and excludes the "options available" text when space is limited.<br><br><b>Components</b><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-mini-cart-component.png" alt="Prime Check logo" /></td>
	</tr>
</table>

## Cart

<table>>
    <tr>
		<td style="vertical-align:top;width: 344px;"><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-cart.png" alt="Cart" /></td>
        <td style="vertical-align:top;">The <a href="doc:delivery-estimate-card">Prime Check logo + delivery estimate</a> indicate which products in the shoppers cart are eligible for Prime and includes the delivery estimate.<br><br>The <a href="doc:sign-in-card">sign-in card</a> shows personalized delivery information. For unauthenticated users, the card prompts sign-in for more accurate delivery details; authenticated users see their specific delivery date and benefits directly.<br><br><b>Components</b><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-cart-component-1.png" alt="Cart components"><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-cart-component-2.png" alt="Cart components"><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-cart-component-3.png" alt="Cart components"></td>
	</tr>
</table>

## Checkout - Shipping details

<table>
    <tr>
		<td style="vertical-align:top;width: 344px;"><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-checkout-shipping-details.png" alt="Checkout - Shipping details" /></td>
        <td style="vertical-align:top;"> The <a href="doc:delivery-estimate-card">Prime Check logo + delivery promise</a> indicate the shipping methods for the products that offer Prime.<br><br>The <a href="doc:sign-in-card">sign-in card</a> shows personalized delivery information. For unauthenticated users, the card prompts sign-in for faster delivery details; authenticated users see their specific delivery date and benefits directly.<br><br><b>Components</b><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-checkout-shipping-details-components-v2.png" alt="Checkout - Shipping details components" /></td>
	</tr>
</table>

## Consent screen

<table>
    <tr>
		<td style="vertical-align:top;width: 344px;"><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-consent-screen.png" alt="Consent screen" /></td>
        <td style="vertical-align:top;"> The consent screen allows users to review and grant permissions, ensuring data control and simplifying sign-in by using Amazon’s trusted authentication.</td>
	</tr>
</table>

## Checkout - Review order

<table>
    <tr>
		<td style="vertical-align:top;width: 344px;"><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-checkout-review-order.png" alt="Checkout - Shipping details" /></td>
        <td style="vertical-align:top;"> The <a href="doc:prime-check-logo">Prime Check logo</a> identifies which items in the order are Prime eligible, including the delivery date.<br><br><b>Components</b><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-checkout-review-order-component-v2.png" alt="Checkout - Review order" /></td>
	</tr>
</table>

## Order confirmation

<table>
    <tr>
		<td style="vertical-align:top;width: 344px;"><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-order-confirmation-v2.png" alt="Checkout - Shipping details" /></td>
        <td style="vertical-align:top;">The <a href="doc:prime-check-logo">Prime Check logo</a> identifies which items in the order are Prime eligible, and may include the estimated delivery date.<br><br>The Manage Prime item link allows customers to track, manage returns, and get support for their Prime orders directly through their Amazon account.<br><br><b>Components</b><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-order-confirmation-component-1-v2.png" alt="Prime Check logo + delivery estimate" /><br><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-order-confirmation-component-2.png" alt="Prime Check logo" /><br><br><img src="https://d1t6aow54ifh7o.cloudfront.net/bwp_api_assets/sign-in-banner-flow-order-confirmation-component-3-v2.png" alt="Order management link" /></td>
	</tr>
</table>