Recommended
More Related Content
Similar to VWO SmartCode KB Article (Ankur Gupta).docx
Similar to VWO SmartCode KB Article (Ankur Gupta).docx (20)
More from Ankur Gupta
Recently uploaded
Recently uploaded (20)
VWO SmartCode KB Article (Ankur Gupta).docx
- 1. Operationalize Your Experience Optimization Strategy with VWO SmartCode Overview VWO SmartCode is a JavaScript code snippet that enables you to leverage the features of the VWO experience optimization platform on your website. VWO is a cloud-native solution which allows you to put your ideas to work quickly and build enriching experience for your users. VWO SmartCode establishes a secure communication channel between the VWO servers and your website. VWO SmartCode enables you to run automated campaigns on your webpages for better user engagement or create customized web experiences to study user behavior and gather meaningful insights. Types of SmartCodes VWO supports two types of SmartCodes: Asynchronous SmartCode and Synchronous SmartCode. These two SmartCodes differ by loading pattern and execution, and each presents a seamless experience for different types of business usecases. Asynchronous SmartCode Loads parallelly with your webpage to foster improved website performance Provides timer configuration options for loading of page settings and VWO library Synchronous SmartCode Executes each line of code in the script sequentially Accelerates response to subsequent requests by storing page settings and VWO library in the browser cache Accessing VWO SmartCode A SmartCode is generated automatically for each account ID. To access your VWO SmartCode: 1. Log in to your VWO account. 2. Click the Settings icon ( ).
- 2. 3. On the SETTINGS screen, click the SMARTCODE tab to display the SmartCode for your account. You can choose Synchronous or Asynchronous SmartCode based on your business requirement. VWO SmartCode Execution Workflow The following workflow provides visibility into each step of SmartCode execution. The workflow describes how SmartCode executes to enable VWO implement variations and orchestrate a new working environment for your visitors. The workflow is illustrated with the help of a flow diagram.
- 3. Figure 1: SmartCode Execution Workflow
- 4. Configuring SmartCode for Your Website You must add the SmartCode to all webpages where you require running tests and campaigns. The VWO SmartCode can be installed either automatically or manually. For automatic installation, download the VWO plug-ins for specific third-party platforms. The information in this section describes the manual installation of the VWO SmartCode. Key Points to Remember You must place the SmartCode before the closing </Head> tag of your website. If the webpage contains Iframe URLs, you must install the VWO SmartCode on the Iframe URL. If template-based headers and footers are used across the website, you must add the VWO SmartCode in the header. Installing VWO SmartCode Manually 1. Access your VWO SmartCode. For more information, refer to Accessing VWO SmartCode. 2. Copy the SmartCode. 3. Sign in to your website admin panel and paste the copied SmartCode before the closing </Head> tag in the page source code. NOTE: If you need assistance in installing the SmartCode manually, you can click Send to Developer to email to SmartCode to a developer. FAQS 1. What is the difference between synchronous and asynchronous smartcodes? An Asynchronous SmartCode loads along with your webpage,while a Synchronous SmartCode executes every line of code snippet sequentially to load. 2. What is the advantage of Asynchronous SmartCodes? Asynchronous SmartCodes provide the following advantages: Achieve faster page loads and improved website performance. Allow timer configurations for loading of page settings and VWO library. 3. How to check if the SmartCode is installed correctly?
- 5. You can use SmartCode Checker in VWO to verify if the SmartCode is installed correctly for a webpage. The VWO SmartCode Checker allows verifying one URL at once. 4. How to add SmartCode for the React-helmet case? In a React-helmet implementation, the <helmet> tag abstracts the <head> tag. You must add the SmartCode before the closing </helmet> tag in the webpage source code.