How to Display Table of PayPal/Stripe Transaction Details

Overview

Would you like to display a table of PayPal or Stripe transaction details from your entries? Having a central place for all entries by form can make it easier to find your transactions. In this tutorial, we’ll show you the basics of how to use PHP and a shortcode to create a table of your PayPal and Stripe transactions.

By default, PayPal and Stripe transaction details can be viewed in the sidebar for individual entries.

Each individual entry screen will give you details on your PayPal or Stripe transactions

Setup

To view this transaction information in a single table, you can use the code, and the corresponding shortcode shared below. This table will be visible only to users with an Administrator role.

1) Creating the shortcode

First, you’ll need to create the shortcode so that it can be used on any page, post or widget area on your site.

Simply add the following code to your site.

/**
 * Display table of payments from Stripe/PayPal shortcode.
 *
 * @link https://wpforms.com/developers/display-table-of-paypal-stripe-transaction-details/
 *
 */
function wpf_dev_transactions_table( $atts ) {

	$atts = shortcode_atts( array(
		'fields' => false,
		'id'     => '',
	), $atts, 'wpf_transactions' );

	if (
		! is_super_admin() ||
		empty( $atts['id'] )
	) {
		return;
	}

	$form_data = wpforms()->form->get(
		$atts['id'],
		array( 'content_only' => true )
	);

	$payments = wpforms_has_payment( 'form', $form_data );

	if ( ! $payments ) {
		return;
	}

	$entries = wpforms()->entry->get_entries(
		array(
			'form_id' => $atts['id'],
		)
	);

	if ( empty( $entries ) ) {
		return;
	}

	if ( $atts['fields'] ) {
		$ids = explode( ',', $atts['fields'] );
	} else {
		$ids = false;
	}

	ob_start();

	echo '<table width="100%" style="font-size:11px !important;">';

	foreach ( $entries as $entry ) {

		if ( 'payment' !== $entry->type ) {
			continue;
		}

		$fields = json_decode( $entry->fields, true );
		$meta   = json_decode( $entry->meta, true );

		echo '<tr>';
			if ( ! empty( $ids ) ) {
				foreach ( $ids as $id ) {
					echo '<td>' . sanitize_text_field( $fields[ $id] [ 'value' ] ) . '</td>';
				}
			}
			echo '<td><a href="' . admin_url( 'admin.php?page=wpforms-entries&view=details&entry_id=' . $entry->entry_id ) . '">' . sanitize_text_field( $meta['payment_total'] ) . '</a></td>';
			echo '<td>' . sanitize_text_field( ucfirst( $entry->status ) ) . '</td>';
			echo '<td>' . sanitize_text_field( $meta['payment_transaction'] ) . '</td>';
			if ( 'stripe' === $meta['payment_type'] ) {
				echo '<td>Stripe</td>';
			} elseif ( 'paypal_standard' === $meta['payment_type'] ) {
				echo '<td>PayPal</td>';
			}
			echo '<td>' . sanitize_text_field( $entry->date ) . '</td>';
		echo '</tr>';
	}

	echo '</table>';

	return ob_get_clean();
}
add_shortcode( 'wpforms_transactions', 'wpf_dev_transactions_table' );

2) Using the shortcode

After this code has been added, the following shortcode can be used to display transaction details for a specific form (only visible to admin users).

[wpforms_transactions id="FORMID"]

Display a table of PayPal or Stripe transaction details

This shortcode can also be modified to include columns with additional field values. To add these, you’d need to add id="FIELDID" within the shortcode.

  • Example with a single field: [wpforms_transactions id="55" fields="1"]
  • Example with multiple fields: [wpforms_transactions id="55" fields="1,2,5"]

For details on how to locate the Form ID or Field IDs, please see this tutorial.

And that’s it! You’ve now created a shortcode that will display your PayPal and Stripe transactions on your site. Would you like to also create a shortcode to display your form entries? Try out our article on How to Display Form Entries.

FAQ

Q: Can I also style this table?

A: By default, the styling will come from your theme. You can add some additional CSS if you’d like to make the form look a little nicer.

table {
    border-collapse: collapse;
}

thead tr {
    height: 60px;
}

table, th, td {
    border: 1px solid #000000;
}

td {
    white-space: normal;
    max-width: 33%;
    width: 33%;
    word-break: break-all;
    height: 60px;
    padding: 10px;
}
tr:nth-child(even) {
    background: #ccc
}

tr:nth-child(odd) {
    background: #fff
}