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 Code Snippets Plugin

Using a specific free plugin that is designed specifically for adding snippets to your site is by the far the easiest solution. As long as the plugin remains active, your custom functions and scripts will remain active on your site.

For this part of the tutorial, we’re going to install and activate the Code Snippets plugin.

Once you’ve installed and activated the plugin, you can add any snippets through their interface. Just click Add New to create a new snippet.

once you add the code snippets plugin you can click Add New to create a new snippet

You can then copy and paste any of the WPForms snippets to your site.

add you custom PHP or JavaScript using this Code Snippets plugin

Creating a Site-Specific Plugin

Using this particular method is only recommended if you are comfortable with editing PHP files and uploading directly to your server or through your favorite FTP program.

Creating a custom plugin is very easy and you only need a text editor such as Word or NotePad in order 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.
    you can add your custom PHP or JavaScript using a custom created plugin

WordPress never recommends making any live changes to any of your files, including plugin and theme files.

Using functions.php inside a child theme

Using this particular method is only recommended if you are comfortable with editing PHP files and uploading directly to your server or through your favorite FTP program.

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.

We never recommend editing any of your theme files directly. If the theme author were to release an update to the theme, any and all edits that you would’ve made would be lost. Using a child theme will reduce this chance of keeping your theme up-to-date without losing any customizations you may make along the way.

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. child theme with style.css and functions.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.

you can now add custom PHP or JavaScript using a 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.