Setup and install WooCommerce in Avada
By Jithin on January 5th, 2020
Avada is a multi-purpose WordPress theme, and it is incorporated with different demos and plugins to make the website creation an easy process. The plugins in Avada can be categorized as the required, bundled, and recommended plugins. Some of the recommended plugins are PWA, The Event Calendar, Yoast SEO, WooCommerce, and more.
Avada is fully compatible with WooCommerce and can be used to create an online shop. This plugin includes the full design and also the custom elements of WooCommerce. In Avada, you can download the WooCommerce plugin for free. For creating websites in Avada, you can also import the pre-designed demos.
If you have already imported any WooCommerce demos in Avada, such as the Modern Shop or Classic Shop, then there is no need to set up the WooCommerce plugin again. You can skip this step because the above demos will set up the WooCommerce for you. To skip the WooCommerce Wizard Process, you can click the ‘Not Right Now’ button.
Install WooCommerce in Avada
To install the WooCommerce plugin in Avada, you can follow the below steps:
- Go to Avada and select the ‘Plugins’ option.
- Select the ‘WooCommerce’ plugin from the listed plugins.
- Click the ‘Install’ button. Once the installation completes, the plugin is auto-activated.
- After installation, the ‘WooCommerce Setup Wizard’ appears. In the ‘Setup Wizard’, click the ‘Let’s Go!’ button to proceed with the setup. As mentioned earlier, if you have imported any WooCommerce demos, then you can skip this step.
- Setup the process and store information in the next pages and click the ‘Finish’ button. If you want to know how to setup WooCommerce in WordPress, you can follow the InterServer KB by clicking here.
- Once the setup completes, you can add your first product to the store by clicking the ‘Create Your First Product’ button. If you don’t want to add the products now, then you can return to the WordPress Dashboard by clicking the link below the setup window.
Assign Your Shop Pages
The following pages are created during the WooCommerce installation and setup process.
- Shop Page without any content.
- My Account
If you have skipped the WooCommerce Setup Wizard, then you can do the following to create the required or missing WooCommerce pages.
- Go to WooCommerce and select the ‘Status’ option.
- Click the ‘Tools’ button.
- Select the page installer tool to create the pages.
If you want to create the shop page manually, then you can follow these steps:
- Go to WooCommerce and navigate to the ‘Settings’ option.
- Click the ‘Products’ tab.
- Select the page to run the main shop page, and after that, this page will display all your WooCommerce products.
If you want to set up the remaining pages manually, then you can follow these steps:
- Go to WooCommerce and select the ‘Advanced’ tab.
- Under the Advanced tab, select the pages to run the pages such as Cart page, Checkout page, My Account page, and more.
Create Your Products in WooCommerce
- Log in to WordPress as an admin user and navigate to the ‘Products’ tab on the sidebar.
- Select the ‘Add Product’ tab.
- Enter the product name at the top of the page.
- Enter the description of the product into the post content field.
- In the ‘Product Data’ box, you can enter all the product details such as price, shipping details, Stock details, size, and more.
- In the ‘Product Short Description’ box, you can enter a short description of the product that displays next to the main product images.
- Under the ‘Product Image’ box, you can add the main featured image. To insert more images related to the product, you can use the ‘Product Gallery’ box.
- You can add the appropriate tags and product categories from the ‘Product Tags’ and ‘Product Categories’ box, respectively.
- Click the ‘Publish’ button after filling all the necessary details. This product appears on your main shop page.
Adjust WooCommerce Product Image Size Settings
In WooCommerce, you can set the product image size for both the catalog and single product images. The Avada settings coincide with WooCommerce image sizes. While editing the WooCommerce image size, it is essential to keep in mind about the Avada theme settings. The image inserted in WooCommerce should be equal to or larger than the image size settings. Make a note that if you made any changes in the image size, then you need to regenerate your thumbnails for it to affect images already uploaded to your site. You can use the ‘Regenerate Thumbnails’ plugin to do the same.
You can follow these steps to change the WooCommerce image sizes.
- In the admin sidebar, click the ‘Appearance’ tab.
- Select the ‘Customize’ tab and select the ‘WooCommerce’ tab from the list.
- Go to the ‘Product Images’ tab and select the ‘Images Setting’ option for single product images.
- You can use the ‘Main Image Width’ option to edit the images on the single product pages. If you want to edit the products in the catalog, then you can use the ‘Thumbnail width’ option.
- Enter the desired image width value and click the ‘Save’ button.
To Regenerate Thumbnails after editing the size of the image, you can follow the below steps:
- Download the ‘Regenerate Thumbnails’ plugin.
- After download, go to the WordPress Admin Dashboard and select the ‘Tools’ tab.
- Choose the regenerate the thumbnails of your images option to change the image sizes to the newly set value.
This is how you can install WooCommerce in Avada. If you need any further help, please do reach our support department.