Skip to main content

Accounts

Render Connector​

Once a Payee has their account connected, you can display a button that will give them access to a simplified Stripe dashboard:

{% set exampleOrg = craft.entries().section('organizations').one() %}

{{ craft.marketplace.renderConnector(exampleOrg) }}

This makes it possible for your Payees to see their payout timing, and a few other Stripe-specific details.

Customize connector​

You can apply your own classes and attributes to the default connector, to style it like your site. This is especially relevant if you are using a utility class library like Tailwind.

{% set exampleOrg = craft.entries().section('organizations').one() %}

{{ craft.marketplace.renderConnector(exampleOrg, {
  form: {
    attributes: {
      'data-my-custom-attribute': 'my-value',
    },
  },
  errorMessage: {
    attributes: {
      class: 'text-red-500',
    }
  },
  submitButton: {
    attributes: {
      class: 'bg-blue-500 text-white',
    },
  },
}) }}

Completely custom connector form​

If you need to customize the form beyond attributes and CSS classes, you can entirely re-write the form. The renderConnector function renders the following snippet, which you can customize from this point:

<form method="POST" accept-charset="UTF-8" target="_blank" {{- attr(themeConfig.form.attributes) -}}>
  {{ csrfInput() }}
  {{ actionInput('marketplace/accounts/create') }}

  {% if elementUid %}
    {{ hiddenInput('elementUid', elementUid, { type: 'hidden' }) }}
  {% endif %}

  {# Customize the redirect, when applicable. Otherwise, defaults to the same page. #}
  {% if params.redirect %}
    {{ redirectInput(params.redirect, { type: 'hidden' }) }}
  {% endif %}

  <button type="submit" data-test="connect" {{- attr(themeConfig.submitButton.attributes) -}}>
    {{ 'Connect'|t('marketplace') }}
  </button>

  {# A single error message, same as the default Craft CMS login form. #}
  <div {{- attr(themeConfig.errors.attributes) -}}>
    {% if errorMessage is defined %}
      <p>{{ errorMessage }}</p>
    {% endif %}
  </div>
</form>

Error Messages​

An error could occur on the connector if:

  • The account ID doesn’t actually exist on your Stripe account—ex. you are using Live Stripe keys, but now you are trying to access an account connected in Test mode
  • There’s an issue reaching the Stripe API
  • A user is trying to access an account you’ve revoked from Stripe, but still exists in Craft
  • A user is trying to access an account that doesn’t match their own account ID

In any of thse cases, a more detailed error message is logged to the marketplace.log file.

If you are customizing your form, the errorMessage variable holds the error message. This is the same convention used by Craft CMS’ front-end login form. If you are using renderConnector(), this is already handled for you.