Hiding NS1 and NS2 Fields in WHMCS for Server/VPS Signups

By averagejoe
May 25, 2024

When setting up a Server or VPS in WHMCS, clients are often presented with fields for entering NS1 and NS2 prefixes during the signup process. However, there are scenarios where you might want to hide these fields to streamline the user experience. This can be achieved using a custom WHMCS hook. Below, we delve into the technical details of a PHP script designed to accomplish this task.

Understanding the Hook Code

The following hook script, ns_hook.php, hides the NS1 and NS2 input fields from the client area when configuring a Server/VPS product in WHMCS.

				
					<?php

add_hook('ShoppingCartConfigureProductAddonsOutput', 1, function($vars) {
    add_hook('ClientAreaFooterOutput', 1, function($vars) {
        return "
            <script>
                jQuery(document).ready(function() {
                    jQuery.each([ 'inputNs1prefix', 'inputNs2prefix' ], function(index, value) {
                        jQuery('#' + value).val('ns' + (index + 1)).parent().hide();
                    });
                });
            </script>
        ";
    });
});

add_hook('ClientAreaPageCart', 1, function($vars) {
    if ($_GET['a'] === 'confproduct' AND (!empty($_GET['i']) || $_GET['i'] === '0')) {
        return array (
            'server' => array (
                'ns1prefix' => 'ns1',
                'ns2prefix' => 'ns2'
            )
        );
    }
});
?>

Breakdown of the Code

Hook 1: `ShoppingCartConfigureProductAddonsOutput`

				
					add_hook('ShoppingCartConfigureProductAddonsOutput', 1, function($vars) {
    add_hook('ClientAreaFooterOutput', 1, function($vars) {
        return "
            <script>
                jQuery(document).ready(function() {
                    jQuery.each([ 'inputNs1prefix', 'inputNs2prefix' ], function(index, value) {
                        jQuery('#' + value).val('ns' + (index + 1)).parent().hide();
                    });
                });
            </script>
        ";
    });
});

This portion of the code performs the following actions:

Adding a Nested Hook: The ShoppingCartConfigureProductAddonsOutput hook adds another hook, ClientAreaFooterOutput, to the client area footer.
Injecting JavaScript: The ClientAreaFooterOutput hook returns a script that:
- Waits for the document to be fully loaded using jQuery(document).ready.
- Iterates over the NS1 and NS2 input fields (inputNs1prefix, inputNs2prefix).
- Sets the value of these fields to ns1 and ns2 respectively and hides their parent elements using parent().hide().

Hook 2: `ClientAreaPageCart`

				
					add_hook('ClientAreaPageCart', 1, function($vars) {
    if ($_GET['a'] === 'confproduct' AND (!empty($_GET['i']) || $_GET['i'] === '0')) {
        return array (
            'server' => array (
                'ns1prefix' => 'ns1',
                'ns2prefix' => 'ns2'
            )
        );
    }
});

To replace the NS1 and NS2 fields with empty values in WHMCS, follow these steps to customize your order form:

Editing the Template File

Locate the Template File
Navigate to your WHMCS installation directory and find your active template. Open the following file for editing:
```
/templates/orderforms/your_active_template/configureproduct.tpl
```
Modify the Fields
You'll need to adjust the order form fields for NS1 and NS2 prefixes. Here's how to do it:
- Find the Existing Code
  Look for the parts of the code related to {$LANG.serverns1prefix} and {$LANG.serverns2prefix}. These typically define where the NS fields are located on the form.
- Replace with Empty Values
  Change these fields to hidden types with no displayed value. This will effectively remove any pre-filled content from the form.
Code Example:
Before:
```
1 `{$LANG.serverns1prefix}` 1 `{$LANG.serverns2prefix}` ```

After:
```html
1 `` 1 `` ```
```

Verifying the Changes

Check Your Order Form
After saving your modifications, test your order form to ensure that the NS1 and NS2 fields no longer display any pre-filled prefixes or input boxes. They should now appear as empty fields, effectively hiding the prefixes from view.

By editing the template in this manner, you control the appearance of NS1 and NS2 fields in your WHMCS order form without affecting other functionalities.

This hook focuses on ensuring that when a user configures a product, the NS1 and NS2 prefixes are set correctly:

Checking the URL Parameters: It verifies if the a parameter is confproduct and if the i parameter is either not empty or equal to 0.
Setting NS1 and NS2 Prefixes: If the conditions are met, it returns an array setting the ns1prefix and ns2prefix values to ns1 and ns2, respectively.

Implementation Steps

Create the Hook File: Save the provided PHP code as ns_hook.php.
Upload the Hook File: Place the ns_hook.php file in the includes/hooks directory of your WHMCS installation.
Clear Template Cache: Ensure to clear the template cache in WHMCS to apply the changes.

By implementing this hook, you can seamlessly hide the NS1 and NS2 input fields during the Server/VPS signup process in WHMCS. This customization helps to simplify the client experience by automatically handling the NS prefix values in the background.

For further customization or more advanced use cases, you can expand this script to fit your specific needs. Understanding and leveraging WHMCS hooks can significantly enhance the flexibility and functionality of your WHMCS setup.

How to Install Auto Login Invoice in WHMCS

Installing the Auto Login Invoice module in your WHMCS system is a straightforward process. Follow these steps to ensure a smooth setup:

Download the Module:
- Obtain the complete package of the Auto Login Invoice module from a trusted source. Ensure the file is compatible with your current version of WHMCS.
Prepare Your WHMCS Directory:
- Navigate to your WHMCS installation directory using an FTP client or file manager provided by your hosting service.
Upload the Files:
- Locate the modules/addons directory within your WHMCS folder.
- Upload the entire folder of the Auto Login Invoice module to the modules/addons directory. Make sure the files retain their structure during the transfer.
Activate the Module:
- Log in to your WHMCS admin panel.
- Go to the “Setup” menu and select “Addon Modules.”
- Find the Auto Login Invoice module in the list and click on “Activate.”
Configure Settings:
- Once activated, you'll be prompted to configure the module's settings. Customize the options according to your needs.
- Ensure to save any changes to apply the configurations.
Check Functionality:
- Perform a test to verify that the module operates correctly. Check to see if the auto-login feature on invoices works as expected.

By following these instructions, you can efficiently install and configure the Auto Login Invoice module in your WHMCS setup, enhancing your platform’s usability and customer experience.

Connect with Us

For more tips, tutorials, and hosting solutions, visit our website at Average Joe's Hosting. Follow us on social media for the latest updates:

#WHMCS #WebHosting #ServerSetup #VPSHosting #TechTips #WebDevelopment #HostingSolutions #AverageJoesHosting #PHP #WebHostingTips #ServerManagement #WebHostingCompany

Hiding NS1 and NS2 Fields in WHMCS for Server/VPS Signups