ecommerce-on-mobile-phone
how to guide, web development, Website, WordPress

How To Sell Downloadable Products Using The WooCommerce Plugin

Have you been wondering how to sell your products online without coding to mess up your website in one hot minute? There’s no need to recreate the wheel when there is a myriad of plugins to help you achieve this instantly.

Who knew that a humble free plugin could be so effective at changing any WordPress website into an online shop paradise? It’s possible, with WooCommerce!

Note that if you need more of a specific integration with WooCommerce then look no further than WooExperts. These companies are handpicked and verified by WooCommerce themselves to ensure that they know how to help you with design and development of a Woo site.

To demonstrate this I am going to use my fictitious Ada Design agency WordPress site that I created locally. Let’s get into this.

 

Fictitious Ada Design Agency
Fictitious Ada Design Agency website

 

Login and install that plugin

Login to your WordPress account and navigate to the sidebar menu –  Click Plugins > Add New.

Add new WordPress Plugin
Add a new WordPress plugin

Search for WooCommerce

Now enter ‘WooCoomerce‘ into the search box, it should come up as the first result. Click install > then Activate.

WooCommerce plugin
The WooCommerce plugin

 

WooCommerce Setup Wizard

WooCommerce makes the setup really easy for you to install so that you can’t get it wrong! It’s time to follow the easy steps on the wizard which will take you step by step through the process. Fill in your address and currency details as I have done here.

Store setup wizard
WooCommerce store setup wizard

In this example, I only want to sell digital products on my online store so I selected the plan to sell digital products option from the drop-down box. Select the best option for your store and click the button!

sell-digital-products
I plan to sell digital products

 

Payment Options – Stripe and PayPal

Select whichever payment option you like, the more the better I say :). I picked Stripe and Paypal for now, notice that you can pick additional payment options if you want to.

stripe-paypal-payment-options
Stripe and PayPal payment options

Click the Continue button.

continue-button
Continue with the process!

 

Time for the Extras

You’ll need to install Jetpack to for your store to function! I tried to do this as part of the wizard but it did not work for me. It might not work for you so go back to Plugins > Add New and search for ‘Jetpack’. You can find more about the benefits of Jetpack here.

Jetpack-WordPress
Jetpack for the win

 

After clicking the button I received…

Jetpack-failed
Jetpack setup failed but don’t worry

 

Go back to Plugins

Go back to plugins and you should find Jetpack waiting ready for you, it just takes one click – click Connect.

Connect-to-Jetpack
Connect to Jetpack

 

Jetpack in Dev mode

JetPack is smart enough to know I am not connected to the WordPress.com servers and some of the features are unavailable on my localhost.

activate-jetpack-in-dev-mode
Activate JetPack in Dev mode

However, the ones that are available can be activated by enabling Jetpack in Dev mode! Clicking on the Development mode link takes you to the Jetpack Dev mode page.

Jetpack-dev-support-page
Jetpack Dev support page

 

Editing your wp-config.php file

This does not have to be scary, luckily jetpack tells you exactly what to do. So open up that wp-config.php file using your text editor of choice and paste “define( ‘JETPACK_DEV_DEBUG’, true );” where I pasted it below.

wp-config-php-file
wp-config.php file

 

Check out the Storefront

I’m sure you’ve had a sneak peek already, go to your site and see what it looks like! Boring right? You can easily style it up using the customiser but first, we need to add products.

storefront
Basic storefront theme

 

Design your store

Head back to the Plugins Menu where you should see (taking up half of the page) WooCommerce’s design your store overlay.

WooCommerce-design-your-store
WooCommerce design your store

If you accidentally cross this out you can access it via Plugins. Click on Plugins > WooCommerce > Settings then click the in the customiser link.

WooCommerce-storefront-customizer
WooCommerce storefront customiser

 

The customiser allows you to edit the appearance of the storefront and even customise it with CSS.

storefront-customizer
Storefront customiser

Notice the blue circle I put in the picture.  it’s not immediately obvious but if you click the arrow it reveals more options for you to customise the theme!

Storefront-customizer-more-options-displayed
Storefront customiser more options displayed

 

Adding Products

I have no downloadable products showing on my storefront which will be resolved soon. To add products go back to your admin. Locate WooCommerce > All Products.

WooCommerce-all-products
All products

 

Create your first product

This looks suspiciously like another wizard that will guide you through the setup if you don’t know how! Click on Create your first product.

Create-your-first-product
Create your first product – how exciting

 

Follow the pop-up instructions :). I added information pertaining to my freelancer guide.

product-details
Fill in the product details

Choose a product type, I chose the default simple product.

choose-a-product-type
Choose a product type

Since my product is a digital non-tangible product I selected virtual and downloadable.

 

Pricing Product & images

For my freelancer guide, I want to charge £20, so I just entered that in.

pricing
Fill in your price

Go ahead and enter a short product description, I stuck to one line.

short-description
My one line short description

Add a product image and add tags.

add a-product-image-and-tags
Add a product image and tags

 

You can also add a category – I added ‘freelancer’.

product-category
Add a category

 

Add the downloadable file

For demonstrable purposes, the file I added was my featured image. You can add a pdf file, word document – anything really.

downloadable-product
Add your downloadable product

 

Click the Publish button

At this point I was confused as to why my product was not showing when I went to visit my site – I had not clicked Publish! Take a look at your site now.

product is online
My product is available in the shop!

 

Basket

You can add the product to basket and proceed to checkout now! Woohoo you did it.

wooCommerce-basket
WooCommerce basket

Checkout

checkout-page
Checkout page

 

Naturally, there will be some payment setup issues given that I’m on my local WordPress. But doing this on your actual site would be a breeze since you really only need to link your payment services like Paypal and Stripe to WordPress.

The default free theme that comes with WooCommerce is the Storefront theme. If this does not meet your requirements (free themes generally are very limited) then you can pay for a theme. Go to your Admin > Appearance Storefront

Storefront-extensions-and-designs
Storefront extensions and designs

Explore the themes and extensions at your leisure or just stick with the free theme and customise it as best you can!

 

2 thoughts on “How To Sell Downloadable Products Using The WooCommerce Plugin”

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s