Skip to content

Latest commit

 

History

History
executable file
·
97 lines (77 loc) · 5.5 KB

README.md

File metadata and controls

executable file
·
97 lines (77 loc) · 5.5 KB
Raw

Sublime Stripe

Build Status License: MIT

A simple plugin that provides a checkout button and simple backend integration with the the awesome Stripe service for payment handling on any OctoberCMS site.

Some Screenshots

Checkout Buttons in a Product Listing Stripe Checkout Form Backend Page - Users Backend Page - Single Charges Backend Settings - API Keys Backend Settings - Model Mapping Backend Settings - Site Integration Backend Settings - Styling

Setup part 1 - Stripe.com

  1. Create a free account on Stripe.
  2. Login to Stripe once you have confirmed your email address.
  3. Visit https://dashboard.stripe.com/account/apikeys and make a copy of both your Secret and Publishable keys. Make sure to use the pair relevant to what you are doing, aka, testing or working on your live server.
  4. Visit https://dashboard.stripe.com/account/webhooks and create a URI where you wish to recieve webhooks from Stripe. This is basically where Stripe would send various events for you to handle. Make a note of this URI as it will be needed later on during setting preferences for the plugin in your site's backend.
  5. Visit your own site's backend panel and keep reading.

Setup part 2 - Your OctoberCMS website backend

  1. For now, this plugin has a dependency on the RainLab.User plugin. Hopefully we will be able to change that in the near future.
  2. Create a folder called "sublimearts" in your project's "plugins" directory.
  3. Clone or download this repo inside the directory you created above. Make sure this new cloned/downloaded directory is renamed to "sublimestripe". Your directory structure should look something like OctoberSite\plugins\sublimearts\sublimestripe.
  4. Login to the Backend and visit Settings. Look for Sublime Stripe under MISC or just search for "Stripe" in the left sidebar on the Settings page.
  5. Set your API keys in the fields provided. Move on to other tabs.
  6. Visit every tab in Sublime Stripe Settings, pay attention to comments under each field and make sure you do not miss anything.
  7. Visit your project root in the terminal and run php artisan plugin:refresh SublimeArts.SublimeStripe.

Setup part 3 - Components

Sublime Stripe provides 2 components, both of which are required.

  1. Include the "stripeJS" component and the {% scripts %} tag in any layout that needs to host a page where the checkout button might need to appear. Make sure the component is included BEFORE the {% scripts %} tag. Your setup should look something like this:
description = "Master layout"

[stripeJS]
==
<!DOCTYPE html>
<html>
    <head>
        <title>Demo site for SublimeStripe Plugin</title>
        <link rel="stylesheet" href="{{ 'assets/css/vendor.css'|theme }}">
        <link rel="stylesheet" href="{{ 'assets/css/theme.css'|theme }}">
    </head>
    <body>


        <!-- Content -->
        <section id="layout-content" class="container-fluid">
            {% page %}
        </section>


        <!-- Scripts -->
        <script src="{{ 'assets/vendor/jquery.js'|theme }}"></script>
        <script src="{{ 'assets/vendor/bootstrap.js'|theme }}"></script>
        
        {% component "stripeJS" %}
        {% framework extras %}
        {% scripts %}

    </body>
</html>
  1. Hunt down the plugin/component that provides your product listing. In that component add "stripeCheckoutButton" component as a dependency by adding the following line in your component's init() method like so:
public function init()
{
    $this->addComponent('SublimeArts\SublimeStripe\Components\CheckoutButton', 'checkoutButton', []);
}
  1. Now when you need to display a button to kick off the Stripe Payment handling process, just include the "stripeCheckoutButton" component and pass your products' id to the productId component property. Example:
{% component "checkoutButton" productId=product.id %}

TODO

  • Too much to list here. This is still very much a work in progress. I will keep updating this list in the coming days.
  • Write tests!!!
  • Clean up CheckoutRequest. Very hacky right now.
  • Account for Subscriptions.
  • Setup more useful backend pages.
  • Figure out integration with User models. Either add a dependency on RainLab.User or allow for any custom User model to be used which might end up being tricky.
  • Stripe webhooks integration.
  • Add transactional email and some mail templates.

Developer Info

SublimeArts