| This article covers the following: |
Overview
Installing the VWO plugin for your WordPress sites enables you to create and run VWO campaigns without writing a single line of code. After integrating the plugin, you can create unlimited tests from VWO without any page tagging. The plugin also automatically tracks WooCommerce events, such as product views, add-to-cart actions, and purchases, which you can analyze using VWO Data360.
Configuration and Setup
Install the VWO Plugin (via Plugin Directory)
- Log in to your WordPress dashboard.
- Navigate to Plugins > Add New.
- Search for VWO in the search bar.
- Click Install Now next to the Visual Website Optimizer.
- Click Activate after installation.
Install the VWO Plugin with ZIP (Optional)
As an alternate method, you can also download the plugin from a ZIP file. To do so:
- Download the plugin here.
- Log in to your WordPress dashboard.
- Navigate to Plugins > Add New.
- Click on Upload Plugin > Choose ZIP file
- Click Install Now, then Activate.
Configure General Settings
- Go to Settings > VWO in the WordPress sidebar.
- Enter your VWO Account ID. You can find it on the top right of your dashboard.
- Choose the Code Type:
- Asynchronous (Recommended): Loads faster without blocking elements.
- Synchronous: Not recommended due to performance concerns.
- Click Save Changes.
Configure WooCommerce Settings
- In the VWO Configuration page, navigate to the WooCommerce tab.
- Turn on the Enable WooCommerce Event Tracking toggle.
- Enable the events you wish to track:
- Product Viewed: Tracks product detail page views.
- Add To Cart: Tracks when a product is added to the cart.
- Product Removed From Cart: Tracks when an item is removed from the cart.
- Purchase Order: Tracks completed purchases (Thank You page).
- Click Save Changes.
Configure Server-Side Tracking (Optional)
Server-side tracking allows event data to be sent directly from your server to VWO, ensuring better accuracy by bypassing browser-based blockers.
- From the WooCommerce tab, turn on the Enable Server-Side Tracking toggle.
- Click Save Changes.
Verifying Event Tracking in VWO
- Log in to your VWO account.
- Navigate to Data360 > Events.
- Perform relevant actions on your WooCommerce store.
- After performing actions on your store, go to VWO Data360 > Events. If the events appear under Unregistered Events, click to register them for consistent tracking.
If you are using the WordPress Rocket Loader plugin, ensure to exclude the VWO SmartCode from the Rocket Loader plugin to avoid any flicker. To do so, on the WordPress Rocket dashboard, go to FILE OPTIMIZATION > JavaScript Files and add dev.visualwebsiteoptimizer.com under the Excluded JavaScript Files section present under Load JavaScript deferred and Delay JavaScript Execution as shown in the following image.
To check if you have correctly installed the SmartCode on your webpage, enter the URL in the SmartCode Checker in the Configurations> Websites and Apps section of your VWO Account. See SmartCode Checker in VWO to know what different results mean.
If you are using the Cloudflare Rocket Loader plugin, ensure you enable the Skip Deferred Execution setting in the VWO plugin as shown in the following image to avoid any flicker on the site.
WooCommerce Events Imported Into VWO
The following are WooCommerce events that will be imported into VWO, along with their properties:
Product Viewed
VWO Event API Name: woocommerce.productViewed
Payload:
| Property API Name | Description |
|---|---|
| price | Price of the product |
| currency | Currency of the product price |
| productId | Product ID |
| productTitle | Product Title |
| productUrl | Product URL |
| productCategory | Product Category |
| productSku | Product SKU |
| quantity | Quantity viewed |
| variantId | Variant ID of the viewed product |
Add To Cart
VWO Event API Name: woocommerce.addToCart
Payload:
| Property API Name | Description |
|---|---|
| price | Price of the product |
| currency | Currency of the product price |
| productId | Product ID |
| productTitle | Product Title |
| productUrl | Product URL |
| productCategory | Product Category |
| productSku | Product SKU |
| quantity | Quantity added to cart |
| variantId | Variant ID of the added product |
Remove from Cart
VWO Event API Name: woocommerce.removeFromCart
Payload:
| Property API Name | Description |
|---|---|
| price | Price of the product |
| currency | Currency of the product price |
| productId | Product ID |
| productTitle | Product Title |
| productUrl | Product URL |
| productSku | Product SKU |
| quantity | Quantity removed from cart |
| variantId | Variant ID of the removed product |
Purchase
VWO Event API Name: woocommerce.purchase
Payload:
| Property API Name | Description |
|---|---|
| orderId | ID of the order |
| productId | CSV of line item product IDs |
| productSku | CSV of line item product SKUs |
| productPrice | CSV of line item prices in store currency |
| productQuantity | CSV of line item quantity |
| discount | Discount applied to the order |
| shippingPrice | Shipping price for the transaction in local currency |
| totalTax | Total amount of tax on the order in local currency |
| totalPrice | Total Cart value, including tax in local currency |
| currencyCode | Local currency of the transaction |
Best Practices
- Ensure WooCommerce is installed and active before enabling WooCommerce settings.
- Use incognito mode to test if tracking works correctly (to avoid caching or cookie conflicts).
- Disable any conflicting optimization or caching plugins temporarily if SmartCode doesn’t load.
- If SmartCode is not available after activation, clear the cache after activating the plugin.
Need more help?
For further assistance or more information, contact VWO Support.