WP Stripe
How to add title and amount into the short code (5 posts)

  1. totomobile
    Posted 3 years ago #

    First of all, great plugin. The source code is so neat I felt terrible for mucking it up with my hacks. I know as soon as I saw this plugin I thought great, but how do I set custom amounts and change the title of the button (on a per button basis?).

    To do this I just added support for a couple of extra shortcode attributes:
    [wp-stripe title="My Button Title" amount="20"]

    There are just a few edits to get this to work:

    1. in includes/stripe-functions.php replace the function wp_stripe_shortcode with

    function wp_stripe_shortcode( $atts ){
        $options = get_option('wp_stripe_options');
            'cards' => 'true',
    		'title' => $options['stripe_header'],
    		'amount' => ''
        ), $atts));
        $settings = '?amount='.$amount.'&keepThis=true&TB_iframe=true&height=580&width=400';
        $path = WP_STRIPE_PATH . '/includes/stripe-iframe.php'. $settings;
        $count = 1;
        if ( $options['stripe_modal_ssl'] == 'Yes' ) {
            $path = str_replace("http", "https", $path, $count);
        if ( $cards == 'true' )  {
            $payments = '<div id="wp-stripe-types"></div>';
        return '<a class="thickbox" id="wp-stripe-modal-button" title="' . $title . '" href="' . $path . '">' . $title . '</a>' . $payments;

    2. in includes/stripe-display.php add

    $amount = isset( $_GET['amount'] ) ? $_GET['amount']: '';

    at the top of the wp_stripe_form function

    3. in includes/stripe-display.php again replace the amount input with:

    <input type="text" name="wp_stripe_amount" autocomplete="off" class="wp-stripe-card-amount" id="wp-stripe-card-amount" placeholder="<?php _e('Amount (CAD)', 'wp-stripe'); ?> *" value="<?php echo $amount; ?>" <?php echo $amount ? 'disabled="disabled"' : ''; ?> required />

    That should do it. The amount in the box will be pre-set but it will not be editable if you add it to your shortcode. I can't make any guarantees about this code working, so test it yourself. Good luck and thanks author for the great plugin.


  2. totomobile
    Posted 3 years ago #

    The 'disabled="disabled"' attribute should be changed to the readonly attribute, or else the submission fails!

  3. corvusconceptions
    Posted 3 years ago #

    Good call. This works perfect.

    If you'd like to give the visual appearance of a "disabled" state, add the following to the end of the wp-stripe-display.css

    form#wp-stripe-payment-form .wp-stripe-card input[readonly="readonly"] {
        background-color: #f3f3f3;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
    form#wp-stripe-payment-form input[readonly="readonly"]:focus,
    form#wp-stripe-payment-form textarea[readonly="readonly"]:focus {
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        border-color: #ccc;
  4. fachtopia
    Posted 2 years ago #

    What this means?

    The 'disabled="disabled"' attribute should be changed to the readonly attribute, or else the submission fails!

    What should I do on the code? Can you make an example


  5. jcvangent
    Posted 2 years ago #

    Is this functionality which is by now incorporated into the main plugin or do I still need to update the code myself to get this one working inside the plugin?

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WP Stripe
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic


No tags yet.