How to Add Custom PHP or JavaScript for WPForms

Introduction

Adding custom code snippets to your site with PHP or JavaScript can extend the functionality of your site for your specific needs. Whether that be to extend your WordPress theme functionality or extend any plugin functionality.

Implementation Options

There are a number of approaches available for adding PHP or Javascript to customize your specific needs, not just for WPForms but for any custom code you wish to add.

Using a specific plugin for adding snippets

Using a specific plugin created solely for this purpose is an extremely easy way to add custom snippets to your site.

We’re going to be using the Insert Headers and Footers – Code Snippets by WPCode plugin.

To find out more about this plugin, please check out the site for further information including dedicated documentation.

To create a new snippet, click Add Snippet and select the Add Your Custom Code.

Next, give your custom snippet a name that makes sense to you, and from the Code Type dropdown you can select the Code Type you want to add.

For this particular example, we’re going to select the PHP Snippet for our Code Type. We’re going to select the Insert Method of Auto Insert and the Location for this script will be to run on the Frontend Only since we don’t need this snippet to run in the backend.

Copy and paste your snippet under the opening php tag and when you’re ready, click the Save Snippet button and then toggle the switch from Inactive to Active and click the Update button to make the changes to your site live.

Creating a Site-Specific Plugin

Creating a custom plugin is very easy; you only need a text editor such as Word or NotePad to do this.

If you’d like more information on how to create a site-specific plugin, please see this tutorial.

In order to create a plugin, you’ll need to follow these steps.

1. Using your favorite text editor, create a new file.
2. Add these lines to the top of the file
   <?php
/*
Plugin Name: WPForms Custom Code Snippets
Plugin URI: https://wpforms.com/
Description: Plugin for adding custom code snippets
Author: WPForms Team
Version: 1.0
Author URI: https://wpforms.com/
*/
3. Save the file as wpforms-custom-snippets.php.
4. Compress or zip the file.
5. Log into your WordPress admin and under Plugins, click Add New. Follow the on screen instructions to upload and activate the .zip file you just created.
6. Once you’ve activated the plugin, you can now see the file from the Plugins » Editor.
   

Using functions.php inside a child theme

Creating a child theme is an easy and efficient way to make changes to your theme files, your stylesheet included with the theme, but also for any custom functions that you may want to use such as the ones described in WPForms developer tutorials and snippets.

Our friends at WPBeginner has put together a most excellent article on how to create a child theme. This tutorial even includes a video for you to follow along with.

For this example, we’re going to create a child theme from the WordPress theme Twenty Twenty. In order to do this, please follow the steps below.

1. Create a new folder on your desktop called twentytwenty-child
2. Create a text document and add these lines:
   /*
Theme Name: Twenty Twenty Child
Theme URI: http://yoursite.com/twenty-twenty-child/
Description: Twenty Twenty Child Theme
Author: Your name
Author URI: http://yoursite.com
Template: twentytwenty
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentychild
*/
3. Save this file inside your twentytwenty-child folder and name it style.css.
4. Inside this same folder, create a new doc and name it functions.php. The only thing this file will have to being is the open PHP tag: <?php.
5. Compress or zip the twentytwenty-child folder.
6. Log into your WordPress admin and under Appearances » Themes, click the Add New to upload the twentytwenty-child.zip file you just created. When prompted, activate this theme as well.
7. Now you’ll see in your WordPress admin you’ve activated the Twenty Twenty Child theme.

When those steps are completed, you’ll now see you have a working child theme of Twenty Twenty and a blank functions.php file to add snippets to as well as a blank stylesheet that you can add your own custom CSS to.

Your theme will still function as before, loading all the necessary files and styles first. However, any custom snippets you use from the WPForms developer documentation would be added to the child theme functions.php and would customize the forms based on the snippets you add.

And that’s just a few different ways you can easily add custom PHP or JavaScript to your site.

Notes

When adding any kind of custom code to your site, it’s important to preserve your code from unexpected events. So no matter what approach you choose, it’s a good idea to always back up your site. That way, you’ll have access to older versions of code files if needed.

FAQ

Q: How does this help me with adding custom code to WPForms?

A: This tutorial isn’t specificly for WPForms code snippets but for any code snippets. Simply find which option above is easier for you to add any code snippets, including the WPForms code snippets mentioned in the Tutorials and Snippets section.