How to install WebAbility Widget's on Wordpress ?

1. On the WebAbility homepage, click Login in the top right corner, and log in to your account.
2. Go to Installation in the Side Menu Bar.

3. Quick Installation - Install WebAbility Widget with our default settings and design to provide the best customer experience.

4. Click Copy to Clipboard to copy the installation script.
5. Now that you have your installation script you can Add this script to Wordpress.

Three Ways you can add your install script to Wordpress

1. Use a JavaScript WordPress Plugin (Best for Most People)
   • The best and simplest option for most people is to use a JavaScript WordPress plugin, which you might also see called a code snippet manager plugin, or something similar. While the exact features will depend on the plugin, the basic idea is that these plugins give you an easy-to-use interface to add and manage JavaScript snippets directly from your WP Admin.
   • Here’s an example:
   • This approach has several advantages:
     • Snippet management – if you’re adding multiple snippets to your site, these plugins make it easy to manage each snippet. You can give each snippet a title and use categories/tags to organize them. You can also easily enable and disable individual snippets as needed.
     • Theme-independent – by storing your snippets in a plugin, they’ll still be active even if you change themes. This can be important if you’re adding theme-agnostic functionality, such as using JavaScript to add Google Analytics to WordPress.
     • Conditional rules – if you don’t want to add your JavaScript snippets sitewide, you can easily add conditional rules to only load the JavaScript on certain content, for certain users, for users browsing on certain devices (smartphone vs desktop), and so on.
   • Here are some of the best WordPress plugins for JavaScript management:
     • WPCode – previously known as Insert Headers and Footers
     • Simple Custom CSS and JS
     • Header Footer Code Management
2. Use WordPress Hooks and the functions.php File of Child Theme (A Little More Complex)
   • If you don’t want to install a WordPress JavaScript snippet plugin, you can also manually add JavaScript to WordPress using your WordPress theme’s functions.php file and the WordPress hook system. This method is a little more complex, but it lets you achieve a similar end result as the plugins above. Essentially, the WordPress hook system lets you inject any content in your site’s header or footer, including JavaScript. When combining some PHP code for the hook with your JavaScript, you can automatically inject it in your site. Here’s an example of the code that you would use to add JavaScript to your site’s header:
   • Here’s an example:

     function wpcom_javascript() {
         ?>
         <script>
             Replace with your JavaScript
         </script>
         <?php
     }
     add_action('wp_head', 'wpcom_javascript');

     You can also use more complex PHP to add conditional IF statements, such as only adding the JavaScript to a certain post or page on your site. Here’s an example of only adding JavaScript to a single page by targeting the page’s ID:

     function wpcom_javascript() {
     if (is_page ('42')) { 
         ?>
         <script>
             Replace with your JavaScript
         </script>
         <?php
        }
     }
     add_action('wp_head', 'wpcom_javascript');

   • If you do use your theme’s functions.php file, it’s important to use a WordPress child theme so that your JavaScript snippets don’t get overwritten when you update your theme. As an alternative to using your child theme’s functions.php file, you can also create your own custom plugin to house these snippets. The main advantage of using a custom plugin instead of your child theme’s functions.php file is that it makes your code snippets theme-agnostic. That is, you can change themes, and all of your JavaScript snippets will still be active. You can still use the same code examples from above when creating a custom WordPress plugin.
3. Enqueue the JavaScript Using wp_enqueue_script (Mainly Just for Developers)
   • This last method is a little more complex and won’t apply to most use cases where you’re adding JavaScript to your site. However, you might have more complex situations where you need to upload your own JavaScript file to your site and use it, rather than embedding a JavaScript snippet from a third-party service such as Google Analytics or Facebook. This usually only applies to developers who are working on custom themes or plugins, but it could happen in other situations. In this case, you would want to use the wp_enqueue_script function to register that JavaScript file with your WordPress site and tell WordPress where to load the file.

Note: Whichever installation method you use, make sure to read ourWebsite Onboarding Guideand follow the instructions carefully to get WebAbility Widget set up right and running smoothly.