Learn in this tutorial how to simplify the Easy Digital Downloads (EDD) checkout page using code.
One of the advantages of being an OsomCode subscriber is that you can propose tutorials.
The other day, one of them, following the tutorial on how to simplify the Restrict Content Pro registration page, asked me how she could do the same in Easy Digital Downloads.
By default the EDD checkout page is quite complex. If you have a payment gateway set up, a section called “Billing Details” appears in addition to the card and information sections.
It looks something like this:
So, the checkout page has 3 sections:
- Personal information
- Billing details
- Credit card information
But you know that the fewer elements on the page, the higher the conversion rate.
Do you also want to simplify the EDD checkout as much as possible?
The end result would look something like this:
Cleaner, right? 😉
Here we go:
Steps to simplify the page to finalize the purchase at Easy Digital Downloads.
1. Remove the billing information
Add the following code at the end of functions.php or in your functionality plugin:
To see this and another 1097 code snippets of this website, login or subscribe here.
Also, go to Downloads > Settings > Payment > Stripe > Billing Address Display and select “No address fields”.
Thanks to this snippet and the change in the settings you reduce the checkout to two fields:
- Personal information
- Credit card information
You thus save the 6 billing fields.
But you can still go a little further.
2. Eliminate the last name field and the descriptions.
Add the following to the end of your theme’s style.css file:
To see this and another 1097 code snippets of this website, login or subscribe here.
With this you can hide the last name field and the descriptions that appear below the fields.
3. Reposition credit cards icons (optional)
If you prefer to display the credit card icons just before the corresponding fields, instead of at the top of the page, add the following just below the snippet from step 1.
To see this and another 1097 code snippets of this website, login or subscribe here.
You got it.
From now on a simplified version of the checkout will be displayed on the Easy Digital Downloads checkout page.
Do you want to request billing information later? Then you can create a customer profile page with the [edd_profile_editor]
shortcode that adds them.
Conclusions
Do you want to simplify the Easy Digital Downloads checkout as much as possible? Now you know how to achieve this in a simple way using code.
If you have any question, please leave it in the comments. And if you want to give me a suggestion for future snippets, please send it through the contact form.
Benefits of being a subscriber. 🙂