One of the most common questions asked by new Easy Digital Downloads (EDD) users is whether or not the plugin will work with their chosen themes. The same is true for our extensions and if certain themes must be used in order for them to work properly.
The goal here is to not only answer your questions, but also give tips to those who want to make adjustments on their own.
Will EDD work with my theme?
Yes. EDD is designed to work with any theme.
Absolutely. However, there are things that can be done to help your theme get more out of EDD and its extensions, though they are not required.
For details on theme-specific enhancements, view the Related Articles section at the bottom of this doc. For now, let’s cover the basics.
How does EDD work with any theme?
The first thing we have to do is define “work.” It is important to separate the differences between functionality and style.
Functionality, in this context, is what gives you a full eCommerce platform. Everything from creating product pages to sending customers to a purchase confirmation page after a transaction is how EDD functions.
That functionality, for the most part, is behind the scenes. However, certain functionality requires input from site visitors through button clicks, text input, and more. In order facilitate that interaction, front-end elements (things you see on the site) are displayed on the screen. How those elements look leads us to style.
Style is less about how EDD functions and more about how its front-end elements are presented. Just like with all sites, presentation is the responsibility of CSS. Typically, WordPress holds its CSS in themes because they are responsible for styling WordPress sites. CSS can work from different locations, though. We’ll cover that later.
The important thing to note here is that how EDD front-end elements are styled on your site is not an indication of whether or not EDD works. Functionality is the first priority and the simple answer is “yes,” EDD was developed to function properly with any theme.
Of course, style is important. With that understanding of importance, though, we can move forward.
How will EDD look in my theme?
For many users, what they really want to know is how EDD will look, not how it will function. It turns out this question is a little more difficult to answer.
The easiest way to see how EDD will look in your theme is to test it. Assuming you already have your theme, and considering EDD itself is free, setting up a staging site is by far the best way to get a feel for how things will look once they are set up.
Sometimes EDD looks like it blends right into a theme. Other times certain elements will not display how one would expect them to. Let’s talk about the latter.
Styles from EDD Core
EDD itself includes a CSS file that attempts to standardize certain front-end elements so they do not lose their structure or design in any theme. Components like the checkout form absolutely need to be intuitive right out of the box. So CSS styles are included in the plugin to attempt to secure that structure and design regardless of the theme.
The nature of CSS is to work based on strength and specificity. In this context, that means while EDD core can include its own styles, there is always a chance that any given theme can have CSS with stronger or more specific “rules” than what EDD includes. For those who do have style issues with EDD, this is usually why.
Styles from Your Theme
EDD makes use of a lot of HTML elements that are used all over the web. Keeping with the checkout form example, collecting the names and email addresses of your customers at checkout requires that EDD uses text and email input elements.
Of course, an EDD checkout form is not the only place you will find these types of HTML elements. They are also used in things like contact forms and email newsletter sign-up forms, as well as several other places. Because of that, most theme developers see the value in writing CSS into their themes that will automatically style those generic elements for you.
In some cases, this presents a problem. Perhaps your theme has a heavy design focus on email marketing. For that reason, the theme developer may choose to style text and email input elements to be very large and bold with big text. That makes sense because the email newsletter sign up form needs to grab the visitor’s attention.
What your theme developer did not suspect is that you would be using EDD to distribute your free ebook, for example. Now, your EDD checkout form uses big, bold input elements just to request a name and email address to complete a transaction. In some cases, this is okay. In other cases, the styles applied to checkout form elements work against the flow of the checkout process.
Because of this unpredictability factor, it is always possible that a theme will have a visual effect on EDD elements. Whether or not the effect will be desired can only be determined on a case by case basis (theme by theme).
Page builders can sometimes cause issues, since some of them have their own method of displaying content. This is only a problem with a few page builders though and many will work with Easy Digital Downloads just fine. If you encounter any issues with your page builder or have any questions about one you’re using, please contact support and we’ll be happy to assist you.
Style from the Browser
Lastly, all modern web browsers have their own default styles. If no CSS is written by a designer or developer to force HTML elements to look a certain way, browsers will apply a default style to them. As you would probably guess, not every browser has the same default styles.
It is always possible that a theme will not include styles for certain elements, and those same elements may not be styled in EDD core. When that happens, the browser takes over.
Your Custom Styles
The wonderful thing about web development is that nothing is final. All three style sources mentioned above are what you will start with. However, you are free to change anything you would like. It’s just a matter of knowing how to do it yourself or hiring someone to do it for you.
From your own child theme style.css file, or perhaps a custom CSS plugin like Reaktiv CSS Builder, CSS rules can be written to override any styles that are already applied. This doesn’t always have to be done out of necessity. It can also be done out of preference.
So even though EDD’s styles will be determined by a few different sources, none of those styles have to be final.
EDD Theme Compatibility In Summation
The takeaway is understanding that whether or not EDD will work with your theme is a matter of functionality. How EDD will look in your theme is more of a variable, but steps have been taken to create a base level of consistency across themes.
While some themes are designed for use with EDD, like all of the EDD themes listed here, no theme has to specify EDD support in order for EDD to work with it. You are free to choose your theme based on your own visual preferences.
Please view the list below for more articles on EDD theming.