Easy-digital-downloads: Improve "Purchase Confirmation" page layout

[chriscct7]

_notes from @cklosowski_
I’ve updated this issue to be more about the design aspects of this. I’ve created #7603 to handle the actual splitting of the templates, so we can focus this issue specifically about improving the display and layout of them.

_original issue_

We need to look at renaming the Purchase Confirmation to Receipt or maybe Purchase Receipt.

We also need to build a way that viewing the receipt immediately after purchase has a different URL than viewing order details from the Purchase History.

This allows things like google analytics conversion tracking to only fire on the actual conversion, not reviewed receipts.

This would also solve #3391
Original issue:

As begun in #1956 we should look at making the purchase confirmation page more intuitive.

One of the ways suggested way splitting out some of the data, and rearranging some other data. Right now, the purchase confirmation page needs alot of work.

One of it's biggest weaknesses is that its original title "Purchase Confirmation" is a wording that by itself could either mean this is the confirmation of your purchase, or you need to click a button to finalize your purchase. This becomes even more confusing when translating that string to other languages.

While we can't change the name, we can look at ways of making the page's data better organized and enhance the "you're done" feeling (maybe change the "thanks for your purchase" to have a green background from the .edd_success CSS class).

See https://github.com/easydigitaldownloads/Easy-Digital-Downloads/issues/1956#issuecomment-43524608

[pippinsplugins]

No feedback here from anyone. Punting to 2.3.

[cklosowski]

I'd be a little reluctant to style it too much. That's one of the things that drives me nuts about platforms like WooCommerce. Styling can really throw off the look in some themes. I agree that we need to maybe make the organization a bit more 'receipt' like? That would signify that it's a finalized purchase. Let me look at this and see if I can come up with something.

[cklosowski]

Could we add a couple lines for 'amount paid' that would show a negative amount like -$3.00 and then a final balance row? This would give it a 'receipt' type feeling that might signify the end of the purchase path?

[sunnyratilal]

If rewording of the page title is an issue, we could always suggest changing it to 'Purchase Successful' or just 'Success!', just like Amazon does it.

I agree with @cklosowski I'm not too keen with the styling - it can really ruin the look of some themes.

[pippinsplugins]

I rather like the ida of changing the page title to Receipt instead of Purchase Confirmation. That makes it work better for viewing past order details.

[sunnyratilal]

That would work just as well :+1:

[chriscct7]

The original proposed order of items for this ticket: https://github.com/easydigitaldownloads/Easy-Digital-Downloads/issues/1956#issuecomment-43524608

[pippinsplugins]

Punting to 2.4

[pippinsplugins]

Any objections to slimming this issue down to just renaming the title from Purchase Confirmation to Receipt?

[cklosowski]

I'm good with that, but can we address #3391 along with it? It's nothing too major, just a different URL that loads the same template and is a much smaller scope.

[pippinsplugins]

Yeah let's do it, both for 2.5.

[cklosowski]

Related #3529

[sunnyratilal]

@pippinsplugins Is the goal here, for now, just to rename Purchase Confirmation to Receipt?

[cklosowski]

No this needs so much more. I'll outline it:
1) We need to build two different URLs, not just a single endpoint for both the purchase confirmation AND the view receipt link.
2) We need to rethink the phrasing on them

I believe that's what we're going for. The reason we need the two different url templates, is so we can allow things like conversion tracking and re-marketing pixels to only fire on the initial purchase confirmation, and not a follow up view of the purchase receipt.

[pippinsplugins]

We're too far into 2.7 to get this in. Moving to 2.8.

[maximejobin]

I'd like that feature to be completed. I think the "Purchase confirmation" page and the "Receipt" page are confusing as they are the same. @cklosowski 's suggestion seems really logical.

[cklosowski]

This is a long standing thing I want to fix, but I think there are two different scopes here we have to recognize.

• Improving the design/layout of the Purchase Confirmation
• Splitting the purchase confirmation and view receipt templates into two separate screens/URLs

I’m going to open a separate issue for the splitting of the two screens. Even if these do nothing but retain the same layouts, setting up the ground work for there to be two separate pages loaded will then let us complete ‘improving’ the layout.