TransWikia.com

Move custom code out of theme's functions.php file

WordPress Development Asked on December 15, 2021

I have written code to use on a single page, but I’ve placed it in the theme’s functions.php and created a javascript file and placed it in the theme’s JS directory.

Recently, the theme was updated and functions.php was overwritten and JS file disappeared.

Where do I need to put this code so when the theme is updated, my code will not be lost?

functions.php:


add_action('wp_ajax_zip_search', 'zip_search');
add_action('wp_ajax_nopriv_zip_search', 'zip_search' );
function zip_search()
{
    global $wpdb;

    $zip = $_REQUEST["zip_code"];   


/**/

    $query = 'SELECT zone FROM Counties WHERE zip = %s';
    $zone = $wpdb->get_var( $wpdb->prepare($query, $zip) );

    $output = "<h1>".$zone."</h1>";
    $t_zone = $zone;
    $trimmed_zone = trim($t_zone);

    $query = 'SELECT * FROM Managers WHERE zone = %s;';
    $manager_info = $wpdb->get_row(  $wpdb->prepare($query, $trimmed_zone) );

    $output .= "<table style="width:100%">" . 
                    "<tr>".
                        "<th>Zone Manager</th>".
                        "<th>Phone</th>".
                        "<th>Email Address</th>".
                    "</tr>" .
                    "<tr>" . 
                        "<td>" . $manager_info->first_name . " " . $manager_info->last_name  . "</td>" . 
                        "<td>" . $manager_info->phone_number . "</td>" . 
                        "<td>" . $manager_info->email_address .  "</td>" . 
                    "</tr>" .
                "</table>";

    $query = 'SELECT Region_Number FROM Zones WHERE Zone = %s';
    $region = $wpdb->get_var( $wpdb->prepare($query, $zone) );

    $query = 'SELECT * FROM Agblist WHERE Region_Number = %s';
    $results = $wpdb->get_results( $wpdb->prepare($query, $region) );
    
    $output .= "<table style="width:100%">";
    
    $output .= "<tr>".
                "<th>Company Name</th>".
                "<th>Contact Info</th>".
                "<th>Channel</th>".
                "<th>Territory</th>".
               "</tr>";

    foreach( $results as $result ) 
    {
        $output .= "<tr>".
                        "<td>".$result->Company_Name."</td>".
                        "<td>".$result->Corp_Address_Line_1."</br>".$result->Corp_Address_Line_2."</br>".$result->Corp_City.", ".$result->Corp_State." ".$result->Corp_Zip_Code."</br>".$result->Office_Phone_1."</td>".
                        "<td>".$result->Channel."</td>".
                        "<td>".$result->Agent_Territory."</td>".
                    "</tr>";
    }
    //$output .= "<li>Result: ".$results."</li>";
    $output .= "</table>";
/**/
    //$output = "<p>here</p>";
    $response = array(
        'data' => $output,
    );

    wp_send_json_success($response);
}

add_action( 'wp_enqueue_scripts', 'my_load_scripts' );
function my_load_scripts() {

    // Enqueue javascript on the frontend.
    wp_enqueue_script(
        'zip_js',
        get_template_directory_uri() . '/js/zip_search.js',
        array('jquery')
    );

    // The wp_localize_script allows us to output the ajax_url path for our script to use.
    wp_localize_script(
        'zip_js',
        'myAjax',
        array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) )
    );

}

/js/zip_search.js:

jQuery(document).ready( function() {
   console.log("Document loaded!");
   jQuery("#AgentSearchButton").click( function(e) {
      console.log("Search button clicked");
      e.preventDefault(); 
      var zipCode = document.getElementById("AgentInputField").value;
      console.log("Zip code entered: " + zipCode);
      jQuery.ajax({
         type : "post",
         dataType : "json",
         url : myAjax.ajaxurl,
         data : {
             'action': "zip_search",
             'zip_code' : zipCode
         },
         success: function(response) {
            console.log(response.data);
            if(response.success) {
                console.log("response.type == success");
                jQuery("#results").html(response.data.data);
            }
            else {
                console.log("response.type == else");
                console.log(response.data);
            }
         },
        error: function(errorThrown){
            console.log("In error, error thrown!");
            console.log(errorThrown);
        }
      })
   })
});

One Answer

In previous questions you mentioned that you created a child theme and installed the multiple themes plugin so that you could put code on a specific page on your site. So you've been using child themes in a way that they weren't intended to be used.

Instead, think of a child theme as a transparency, a layer over the top of your theme. You create a child theme, and place custom code in it, then activate that child theme instead of the theme you were using. WP will load both themes, preferring the template files in the child theme.

This way, because all your changes are in the child theme, when the parent theme is updated no loss occurs.

Answered by Tom J Nowell on December 15, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP