I’m trying to override the output HTML from the Woocommerce Stripe plugin. How would I go about doing that? I’ve read some articles and the docs about action hooks and filters but I believe those are only for the Woocommerce plugin alone and not the Woo/Stripe extension plugin. If a hook or filter is the solution what would that look like? I could modify core files or use JS but those aren’t real viable solutions at all…
The file I’m trying to modify is located in:
plugins/woocommerce-gateway-stripe/includes/class-wc-gateway-stripe.php
This is the block of markup I’m looking to modify within that file:
/**
* Payment form on checkout page
*/
public function payment_fields() {
$checked = 1;
?>
<fieldset>
<?php
if ( $this->description ) {
echo wpautop( esc_html( $this->description ) );
}
if ( $this->saved_cards && is_user_logged_in() && ( $customer_id = get_user_meta( get_current_user_id(), '_stripe_customer_id', true ) ) && is_string( $customer_id ) && ( $cards = $this->get_saved_cards( $customer_id ) ) ) {
?>
<p class="form-row form-row-wide">
<a class="button" style="float:right;" href="<?php echo apply_filters( 'wc_stripe_manage_saved_cards_url', get_permalink( get_option( 'woocommerce_myaccount_page_id' ) ) ); ?>#saved-cards"><?php _e( 'Manage cards', 'woocommerce-gateway-stripe' ); ?></a>
<?php if ( $cards ) : ?>
<?php foreach ( (array) $cards as $card ) : ?>
<label for="stripe_card_<?php echo $card->id; ?>">
<input type="radio" id="stripe_card_<?php echo $card->id; ?>" name="stripe_card_id" value="<?php echo $card->id; ?>" <?php checked( $checked, 1 ) ?> />
<?php printf( __( '%s card ending in %s (Expires %s/%s)', 'woocommerce-gateway-stripe' ), (isset( $card->type ) ? $card->type : $card->brand ), $card->last4, $card->exp_month, $card->exp_year ); ?>
</label>
<?php $checked = 0; endforeach; ?>
<?php endif; ?>
<label for="new">
<input type="radio" id="new" name="stripe_card_id" <?php checked( $checked, 1 ) ?> value="new" />
<?php _e( 'Use a new credit card', 'woocommerce-gateway-stripe' ); ?>
</label>
</p>
<?php
}
?>
<div class="stripe_new_card" <?php if ( $checked === 0 ) : ?>style="display:none;"<?php endif; ?>
data-description=""
data-amount="<?php echo $this->get_stripe_amount( WC()->cart->total ); ?>"
data-name="<?php echo sprintf( __( '%s', 'woocommerce-gateway-stripe' ), get_bloginfo( 'name' ) ); ?>"
data-label="<?php _e( 'Confirm and Pay', 'woocommerce-gateway-stripe' ); ?>"
data-currency="<?php echo strtolower( get_woocommerce_currency() ); ?>"
data-image="<?php echo $this->stripe_checkout_image; ?>"
>
<?php if ( ! $this->stripe_checkout ) : ?>
<?php $this->credit_card_form( array( 'fields_have_names' => false ) ); ?>
<?php endif; ?>
</div>
</fieldset>
<?php
}
You are correct that in this case you cannot modify the output due to the lack of action/filter hooks. This is not necessarily the case for all add-ons to WooCommerce (or other plugins for that matter), it just happens to be the case here.
What I would recommend is writing a plugin that extends the class provided by the Stripe gateway plugin. Override just the
payment_fields()
function to provide your own output – keep in mind you will still need to make sure everything that the base plugin needs is still there. Enable your plugin and select it as the payment type in the WooCommerce configuration.Plugin,
my-stripe-gateway.php
Custom Payment Gateway,
my-stripe-gateway-class.php