Required forms to pass data to Stripe in Custom Sign-up Page

I am having a problem, i developed a custom sign up page because portal is not so customizable but i don’t know how to manage the user sign up. If i click on subscribe a plan and finish the process (with testing card) no member is created in my local instance of Ghost (also i am using Dashi theme). My goal is to mimic the portal sign-up function: Requires name and email and that info is passed to Stripe checkout and then to the new created account/membership. If it’s too complicated at least i would like that an account/membership is created after i finish the checkout.

This is my custom page: `{{!< default}}

{{#if @member.paid}}
{{!-- Logged in, paying member: Redirect home --}}
<script>window.location = '{{@site.url}}';</script>

{{else if @member}}

{{!-- Logged in, paying member: Redirect to account page --}}
<script>window.location = '/account/';</script>


  {{#if feature_image}}
    <div class="site__cover">
      <img class="lazyload"
        data-srcset="{{img_url feature_image size="s"}} 300w,
                    {{img_url feature_image size="m"}} 600w,
                    {{img_url feature_image size="l"}} 1000w,
                    {{img_url feature_image size="xl"}} 2000w"
        data-src="{{img_url feature_image size="m"}}"
        src="{{img_url feature_image size="xxs"}}"
<div class="site__inner">
  <a href="/" class="site__brand">
    {{!-- Add logo or title --}}
    {{#if @site.logo}}
      {{!-- Site logo --}}
      <img class="site__logo"
        src="{{img_url @site.logo size="s"}}"
      {{!-- Site Title --}}

  <div class="site__content shadow">
    <h1 class="site__title">{{#page}}{{title}}{{else}}{{t "Sign up"}}{{/page}}</h1>
    <p id="form-input-label">{{t "Sign up to {sitetitle} to get access to more content ommgggg." sitetitle=@site.title}}</p>
    {{> subscribe-form form_type="signup" button_text=(t 'Continue') name=true}}
    <p class="m-t-lg m-0 text-center">
      <small>{{t "Already have an account?"}} <a href="/signin/">{{t "Sign in"}}</a></small>


.checkout-plan { display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding-bottom: 10%; } .aux-fixed-h{ min-height: 420px; /* Fixed height for the dynamic content */ overflow: auto; /* In case the content is more, it will become scrollable */ height: 730px; padding: 10%; } .checkout-plan__content ul { text-align: left; list-style-type: disc; padding-left: 20px; } .checkout-plan__content { flex: 1 0 auto; /* This makes the content take up all available space, pushing the button down */ } .btn-custom{ background-color: transparent; padding-left: 10%; padding-right: 10%; font-weight: 300; } #price-year{ margin-top: 4%; } #currencySelect{ padding: 10px 20px; border-radius:36px; margin-bottom: 0; font-weight: 600; } #choose-a-plan{ } #choose-and-currency{ width: 100%; display: flex; /* Set this element to flex */ justify-content: space-between; /* Space out the child elements */ padding: 0 2%; } .to-right{ align-items: flex-end; }
    <div class="hero__content flex flex-col flex-cc m-b-lg">

        <div id="choose-and-currency" class="flex checkout grid m-b-lg">

            <div class="flex-col">
                <div id="choose-a-plan" class="flex-col page__excerpt m-t text-acc-3 text-center text-lg"><h2>Choose a plan</h2></div>

            <div class="flex-col to-right">
                <select id="currencySelect" class="m-t text-center text-lg">
                    <option value="USD"><strong>USD</strong></option>
                    <option value="EUR"><strong>EUR</strong></option>
                    <option value="MXN"><strong>MXN</strong></option>




{{! Show the dynamic part }}
<div class="checkout grid pricing js-membership m-b-lg">
    {{! Get all tiers with yearly price and benefits data }}
    {{#get "tiers" include="yearly_price,benefits" limit="all" as |tiers|}}
    {{! Loop through our tiers collection }}
        {{#foreach tiers}}
            <div class="card checkout-plan tier-{{slug}}" data-tier="{{id}}" data-currency="{{currency}}">

                <div class="aux-fixed-h">

                    <header class="checkout-plan__hdr flex flex-col flex-cc text-acc m-b-lg p-l p-r">

                        <h3 class="checkout-plan__title m-0">{{name}}</h3>

                        <div class="checkout-plan__price">
                            <strong>{{price yearly_price currency=currency}}</strong>

                        <div class="checkout-plan__description text-center m-t-sm text-11 text-acc">{{description}}</div>


                    <div class="checkout-plan__content text-acc m-b">
                        <ul class="m-b-0 text-acc-3">
                            {{#if benefits}}
                                {{#foreach benefits as |benefit|}}


                <div class="gh-portal-btn-product center" style="text-align: center">
                    <p id="price-year"><b>price per year:</b></p>
                    <a href="javascript:" data-portal="signup/{{id}}/yearly" class="btn btn--brand btn--sm btn--rounded btn-custom">{{price yearly_price currency=currency}}&nbsp;<b>{{currency}}</b></a>



It’s been a while since you asked this. Were you able to get it resolved?