Best Practices for eCommerce Sites
Building and hosting a successful eCommerce site is not always an easy feat. In an ideal world, a website has large customer base and high traffic. But security and scalability to support that traffic can be costly. WP Engine has built a platform focused to succeed online – that means including out-of-the-box performance features like multi-tiered caching, CDN, and the most reliable, cutting-edge server technology from our partners at Google and AWS.
When getting started, there are some best practices developers should consider when building eCommerce sites. Following these best practices will help provide the best user experience, performance, and scalability.
Development Best Practices
When developing an eCommerce site, there’s a good chance it’ll need to be customizes. Modifying the core code of plugins or themes is not a good idea because the next time that plugin or theme releases an update it will overwrite any changes. With that in mind, eCommerce leaders like WooCommerce highly recommend adding custom code to a plugin that supports it (such as Jetpack), or creating a “child theme” instead. Child themes inherit the looks and functions of the original theme, but allow custom styles and functions that override default code. Using a plugin for custom CSS or a child theme helps ensure the site is built to last.
When using the WooCommerce plugin, be sure to use WooCommerce hooks and filters in the theme or plugin code. These hooks and filters have been developed and tested by the widest community of WordPress eCommerce developers, so they’re a perfect way to hook in to WooCommerce functionality.
Also, keep on top of new releases from the WooCommerce team. Their developers are constantly working to increase performance and create new features for their users. Follow their developer blog to keep informed of these releases.
Protect User Information with SSL
Security is a rising concern for the internet as a whole. The eCommerce plugins for WordPress typically offer secure payment “gateways” to systems like Paypal, Authorize.net, and many more. This means user payment information isn’t stored in the site’s own database. However, users do enter personal information in the cart, checkout, and account pages. It’s extremely important that these pages at a minimum are secured with SSL. That means when users go to these pages, they should display a padlock in the URL bar, and the URL should start with https://. Using SSL on these pages (or ideally the entire site) helps by encrypting the data that users enter on the site.
Learn more about HTTPS and SSL on WP Engine
Keep it Cacheable
Cacheability is the most important factor in a site’s scalability. The act of caching a page is storing a copy of that page in memory for faster access later or for other users, so the web server doesn’t have to go through the work of generating it all over again. A cached page can be served in a few milliseconds, compared to 1+ full seconds for a page that has to be generated “as new” for a visitor. With that in mind, it’s important to ensure the site can cache as many pages as possible. Increasing cacheability means increasing the amount of concurrent users the site can support.
By default, WP Engine excludes the following pages from cache:
- The wp-login.php page
- The wp-admin area
- Pages named cart, store, checkout, or check-out
- Pages using a set cookie with “wordpress_” in the name
When the WP Engine system detects a website is using the WooCommerce plugin, some additional cache exclusions are added. Learn more here.
For other pages though, use Tips for Improving Cacheability to increase the site’s ability to scale. If any conflicts occur with page caching, please do not hesitate to reach out to Support via 24/7 chat in the User Portal.
Optimize Images
A common area for performance improvement is image optimization. If images are resized with HTML and CSS instead of uploading them in the correct size in the first place, additional and unnecessary load is being added to the page. Serving pre-scaled images will help pages load faster for users and improve their experience on the site.
There are many ways to optimize images, ranging from the use of a plugin, to web services, to resizing on a local machine. To learn more about these options, check out this image optimize guide.
Minimize Database Bloat
One of the common performance conflicts on eCommerce sites stems from the use of too many Advanced Custom Fields or product options. Keeping the product metadata fields minimal is key to a faster eCommerce site. The more product options each page has to load, the slower the queries to gather data from those database tables will be. Ideal performance will be seen with about 15,000 products or less, with limited metadata options for each.
If the site will host significantly more than 15,000 products, or a large number of customization options for each product, or even if there’s a few hundred products but need a highly customized search and filter function, it’s time to consider widening the site’s infrastructure. Think about upgrading the WP Engine plan for heavier database usage, and using a high-powered search solution like ElasticPress. This plugin takes all heavy WooCommerce queries and runs them off site on an external ElasticSearch server. It’s ideal for sites with large quantities of products, events, or posts.
Alternatively, check out these advanced search options:
NOTE
When using WooCommerce, we recommend enabling High Performance Order Storage, which separates orders into dedicated tables. This can improve performance and simplify deployments. Learn more here.
Stagger Email Campaigns
Another key factor in a site’s ability to ride out waves of traffic is controlling how large those waves are. Better protect the site from a tsunami of traffic by sending out email campaigns in small batches. This way, the drive of traffic is more slow and steady instead of a huge influx. Make sure the email newsletter plugin being used has an option to schedule emails or send in batches.
Use the REST API
WooCommerce extends the WordPress REST API with their own custom endpoints for Settings, Products, Payment Gateways, Coupons, and many others. Check out their technical documentation for the WooCommerce REST API for more specifics.
Using the REST API can help eCommerce sites diversify by separating the back-end from the front-end (also known as “headless” CMS) to allow any number of apps and services to safely hook in to the site’s products and features. Developers can use a “headless” approach to WordPress to take their site’s content and host it in a number of settings: mobile apps, web APIs, JavaScript frameworks, and many more. It can also help maintain a single product base across multiple sites. Developers find the REST API very freeing, since they are no longer restricted to using the native WordPress front-end and back-end structure alone.
eCommerce Sites and Staging
If using a Staging or Development environment to draft code changes or perform testing for an eCommerce website, there are some general best practices to follow when copying between them. Remember: The eCommerce site could receive orders and have new added products between the most recent copy and now, so it’s important to ensure important data isn’t overwritten.
- Don’t copy database tables containing orders to production. If you are using WooCommerce, these tables include: wp_posts, wp_postmeta, wp_woocommerce_order_items, wp_woocommerce_order_itemmeta
- Don’t copy database tables containing users or user metadata to production. These tables include wp_users and wp_usermeta
- Regularly export order data from production. Use WordPress’ Tools > Export option to export data as needed, or use the WooCommerce CSV export extension for more advanced features.
WooCommerce and Geolocation
When using WooCommerce’s built-in Geolocation feature on a WP Engine website, redirect loops can occur, as detailed in this WooCommerce post. Not to worry though – when enabling WP Engine’s own GeoTargeting add-on, the Geolocation feature built in to WooCommerce will work seamlessly.
NEXT STEP: Get Smart Plugin Manager to automatically keep plugins up-to-date
