EDITS.WS

Tag: WPMU DEV Products

  • Prevent Accidental File Deletion and Site Downtime With New Defender Safe Repair

    All new Safe Repair feature makes repairing and quarantining malicious files with Defender Pro smoother and safer than ever before for WordPress users!

    The Hub: Defender - Quarantine Widget
    View quarantined files using Defender’s Safe Repair feature from The Hub.

    Defender, WPMU DEV’s powerful WordPress security plugin, recently launched its all new version 4.1, which ensures maximum compatibility with the latest version of WordPress, and — more importantly for Pro users — is designed to streamline the process of repairing and quarantining modified files, suspicious files, and offer users a safer alternative to deleting files.

    In this post, we’ll focus on this new feature and cover the following areas:

    Let’s jump right in…

    What is Defender’s Safe Repair Feature?

    As a user-driven company, we listen to what our members and users want. Especially when it comes to addressing issues, as outlined in the comments below from our Defender plugin users:

    • “I was running a malware scan with Defender Pro, and I think I accidentally deleted a file which I shouldn’t have. Now the website is down with a critical error.”
    • “Our website is currently down after removing two attached files that Defender Pro recommended removing.”
    • “It would be wonderful if Defender Pro allowed us to quarantine a file in addition to the options of deleting a file or ignoring it.
      That way if the suspicious file breaks the site, it can be restored easily instead of having to restore the entire site from a backup.”

    Using the above feedback, our developers decided to improve our security plugin and add the following options to avoid serious issues and errors on users’ WordPress sites:

    1. Repair and Quarantine/backup suspicious files so these can be restored if necessary.
    2. Repair and Quarantine/backup modified files so these can be restored if necessary.

    Defender Malware Scanning scans your entire site for suspicious code or modified files and published vulnerabilities in plugins, themes, and WordPress core.

    The new Safe Repair feature applies to reported suspicious and modified files, allowing these to be quarantined, deleted, or replaced with the latest file copies from their official plugin repository.

    Defender Pro - Plugin vulnerability message
    Defender detects and warns users of plugin, theme, and core vulnerabilities. Note: the plugin shown in the above screenshot was modified for illustrative purposes.

    How Does Safe Repair Work?

    As explained earlier, Defender Pro’s Safe Repair feature within the Malware scanning section is designed to streamline the process of quarantining files before repairing or deleting them, offering a safer alternative to outright suspicious or modified file deletion.

    Here’s how Defender Pro handles these requests from version 4.1 onward:

    Suspicious Files

    Defender flags PHP functions, code, and files when they vary from what is expected or when they match known issues.

    Defender- Suspicious file
    Defender detects and flags files with suspicious code.

    Once a flagged function or suspicious code has been verified as suspicious, Defender presents you with three actions: Ignore, Delete, or Safe Repair (note: you may need to deactivate the plugin for the ‘Delete’ option to become active).

    Prior to v4.0, deleting suspicious files would occasionally cause a plugin, theme, or even the entire website to break. Often, this is caused by code from the plugin or theme itself being flagged by Defender as being suspicious.

    The problem, however, appears when it’s a false positive, meaning that the flagged file isn’t malicious per se, but part of the plugin’s (or theme’s) core files and contains risky code added by the theme or plugin developer. Hence, deleting this file could cause errors on the site, break functionality, or even break the entire site.

    From Defender Pro v4.1 onward, users can now opt to repair and quarantine/back up suspicious files for 30 days or more, instead of deleting the file right away. Files are stored under the new quarantine tab, allowing you to restore these if needed, including restoring files manually. This provides a fail-safe method to handle suspicious files and offers a restoration option if things go wrong or return false-positives.

    Note: The Safe Repair option becomes available only if the suspicious code found differs from the plugin’s original code. Also, Safe Repair only works with WordPress.org plugins currently.

    Modified Files

    If code in a plugin, theme, or WordPress core file doesn’t match what is found in the official WordPress repository. Defender will flag the file as a Modified file. Restoring the original file fixes this issue.

    Earlier versions of Defender (and Defender Free plugin) feature a “Restore” button in the plugin’s Malware Scanning section, which fetches a fresh file from the WordPress repository and replaces the existing file in the server directory.

    Defender Pre v4 - Restore files
    Earlier versions of Defender offer only the option to restore modified files with a fresh version of the file.

    However, when a file has been modified by an admin or site developer (e.g. by adding a custom code for a certain functionality), deleting or replacing the file with its original can result in the loss of custom code or functionality, and in some cases, lead to sites breaking.

    In Defender Pro, Restore is now Safe Repair. This new feature not only replaces the modified file with the original file from the WordPress repository, it also adds an option to quarantine the modified file before replacing it, allowing users to restore the file if required.

    Defender v4.0 - Safe Repair button
    The new Safe Repair feature of Defender Pro allows users to restore replaced files.

    Repairing Files

    Repair is a handy feature to have when a file in the server directory gets modified for any reason. It smartly fetches a fresh file from the WordPress repository and swaps it with the current file in the server directory. (See below for more details on how to use this feature.)

    Quarantined Files

    Modified and/or suspicious files on your server are quarantined and moved to a remote directory (/wp-content/.defender-security-quarantine), allowing you to restore the files if needed (explained in more detail further below).

    How to Use Defender’s Safe Repair Feature

    To use the new Safe Repair feature, make sure you have installed Defender Pro and that the plugin is running the latest version. If you are currently using our free Defender WordPress Security plugin, consider upgrading to Pro by becoming a WPMU DEV member.

    Also, make sure that you have enabled the plugin’s settings as shown below for the Safe Repair feature to work.

    Defender Settings
    The above settings must be enabled for Safe Repair to work.

    With Defender Pro v4.1 (minimum) installed and the above settings configured, run a fresh Malware Scan by going to Defender > Malware Scanning > New Scan…

    Defender - Malware scan
    Run a malware scan in Defender.

    Once the scan is completed, check for modified or suspicious files.

    Defender Malware Scan results
    A malware scan showing modified files and suspicious code detected.

    Next, click on the Malware Scanning > Issues tab.

    Defender - Malware Scan Safe Repair

    Select a file and click on the Safe Repair button.

    You will be given the option to repair and/or quarantine the selected file.

    Defender Repair File feature
    We recommend quarantining files before repairing them.

    Note that by default, quarantined files will remain isolated for 30 days before being automatically deleted. You can configure quarantine duration in the Malware scanning settings if you want to change this default period.

    Defender Quarantine settings
    You can change the quarantine period in the Malware Scanning settings section.

    Restoring Quarantined Files

    You can restore quarantined files in one of two ways:

    1. Via WordPress Admin: Go to Defender > Malware scanning > Quarantined section.
    2. Via The Hub: Use the Quarantined Hub widget under the Security tab.

    Restoring Quarantined Files Via The WordPress Admin

    Quarantined files are listed under the new quarantine tab.

    Defender Quarantined section
    Defender stores all of your quarantined files in the Quarantined section.

    To restore quarantined files from your WordPress admin, log into your WordPress site, and go to Defender Pro > Malware Scanning > Quarantined.

    Defender Pro - Malware Scanning - Quarantined section
    View all of your quarantined files in the Malware Scanning section.

    This section lets you go through your quarantined files and choose to either restore or permanently delete these.

    Defender Quarantined Fles - Options
    Restore or delete your quarantined files.

    Files can also be restored manually by downloading them from /wp-content/.defender-security-quarantine.

    Restoring Quarantined Files Via The Hub

    The Hub’s Security tab lists your most recent quarantined files (up to a maximum of 5 files) and provides the following options, depending on whether the website is running or not.

    • If the website is up – files can be restored from the Hub.
    • If the website is down – instructions will display on how to restore the quarantined file(s) manually using FTP/SSH
    The Hub - Quarantined Files widgets
    Monitor quarantined files in The Hub’s Security section.

    Repair Files Safely Using Defender

    Defender 4.1 now lets you apply a powerful combination of quarantining and repairing modified or suspicious file threats and isolating files instead of deleting these entirely, lessening the risk of breaking your site, as quarantined files can be restored if required.

    For full details on using the new Safe Repair feature and all of its options, see the Defender plugin documentation section.

  • Prevent Accidental File Deletion and Site Downtime With New Defender Safe Repair

    All new Safe Repair feature makes repairing and quarantining malicious files with Defender Pro smoother and safer than ever before for WordPress users!

    The Hub: Defender - Quarantine Widget
    View quarantined files using Defender’s Safe Repair feature from The Hub.

    Defender, WPMU DEV’s powerful WordPress security plugin, recently launched its all new version 4.1, which ensures maximum compatibility with the latest version of WordPress, and — more importantly for Pro users — is designed to streamline the process of repairing and quarantining modified files, suspicious files, and offer users a safer alternative to deleting files.

    In this post, we’ll focus on this new feature and cover the following areas:

    Let’s jump right in…

    What is Defender’s Safe Repair Feature?

    As a user-driven company, we listen to what our members and users want. Especially when it comes to addressing issues, as outlined in the comments below from our Defender plugin users:

    • “I was running a malware scan with Defender Pro, and I think I accidentally deleted a file which I shouldn’t have. Now the website is down with a critical error.”
    • “Our website is currently down after removing two attached files that Defender Pro recommended removing.”
    • “It would be wonderful if Defender Pro allowed us to quarantine a file in addition to the options of deleting a file or ignoring it.
      That way if the suspicious file breaks the site, it can be restored easily instead of having to restore the entire site from a backup.”

    Using the above feedback, our developers decided to improve our security plugin and add the following options to avoid serious issues and errors on users’ WordPress sites:

    1. Repair and Quarantine/backup suspicious files so these can be restored if necessary.
    2. Repair and Quarantine/backup modified files so these can be restored if necessary.

    Defender Malware Scanning scans your entire site for suspicious code or modified files and published vulnerabilities in plugins, themes, and WordPress core.

    The new Safe Repair feature applies to reported suspicious and modified files, allowing these to be quarantined, deleted, or replaced with the latest file copies from their official plugin repository.

    Defender Pro - Plugin vulnerability message
    Defender detects and warns users of plugin, theme, and core vulnerabilities. Note: the plugin shown in the above screenshot was modified for illustrative purposes.

    How Does Safe Repair Work?

    As explained earlier, Defender Pro’s Safe Repair feature within the Malware scanning section is designed to streamline the process of quarantining files before repairing or deleting them, offering a safer alternative to outright suspicious or modified file deletion.

    Here’s how Defender Pro handles these requests from version 4.1 onward:

    Suspicious Files

    Defender flags PHP functions, code, and files when they vary from what is expected or when they match known issues.

    Defender- Suspicious file
    Defender detects and flags files with suspicious code.

    Once a flagged function or suspicious code has been verified as suspicious, Defender presents you with three actions: Ignore, Delete, or Safe Repair (note: you may need to deactivate the plugin for the ‘Delete’ option to become active).

    Prior to v4.0, deleting suspicious files would occasionally cause a plugin, theme, or even the entire website to break. Often, this is caused by code from the plugin or theme itself being flagged by Defender as being suspicious.

    The problem, however, appears when it’s a false positive, meaning that the flagged file isn’t malicious per se, but part of the plugin’s (or theme’s) core files and contains risky code added by the theme or plugin developer. Hence, deleting this file could cause errors on the site, break functionality, or even break the entire site.

    From Defender Pro v4.1 onward, users can now opt to repair and quarantine/back up suspicious files for 30 days or more, instead of deleting the file right away. Files are stored under the new quarantine tab, allowing you to restore these if needed, including restoring files manually. This provides a fail-safe method to handle suspicious files and offers a restoration option if things go wrong or return false-positives.

    Note: The Safe Repair option becomes available only if the suspicious code found differs from the plugin’s original code. Also, Safe Repair only works with WordPress.org plugins currently.

    Modified Files

    If code in a plugin, theme, or WordPress core file doesn’t match what is found in the official WordPress repository. Defender will flag the file as a Modified file. Restoring the original file fixes this issue.

    Earlier versions of Defender (and Defender Free plugin) feature a “Restore” button in the plugin’s Malware Scanning section, which fetches a fresh file from the WordPress repository and replaces the existing file in the server directory.

    Defender Pre v4 - Restore files
    Earlier versions of Defender offer only the option to restore modified files with a fresh version of the file.

    However, when a file has been modified by an admin or site developer (e.g. by adding a custom code for a certain functionality), deleting or replacing the file with its original can result in the loss of custom code or functionality, and in some cases, lead to sites breaking.

    In Defender Pro, Restore is now Safe Repair. This new feature not only replaces the modified file with the original file from the WordPress repository, it also adds an option to quarantine the modified file before replacing it, allowing users to restore the file if required.

    Defender v4.0 - Safe Repair button
    The new Safe Repair feature of Defender Pro allows users to restore replaced files.

    Repairing Files

    Repair is a handy feature to have when a file in the server directory gets modified for any reason. It smartly fetches a fresh file from the WordPress repository and swaps it with the current file in the server directory. (See below for more details on how to use this feature.)

    Quarantined Files

    Modified and/or suspicious files on your server are quarantined and moved to a remote directory (/wp-content/.defender-security-quarantine), allowing you to restore the files if needed (explained in more detail further below).

    How to Use Defender’s Safe Repair Feature

    To use the new Safe Repair feature, make sure you have installed Defender Pro and that the plugin is running the latest version. If you are currently using our free Defender WordPress Security plugin, consider upgrading to Pro by becoming a WPMU DEV member.

    Also, make sure that you have enabled the plugin’s settings as shown below for the Safe Repair feature to work.

    Defender Settings
    The above settings must be enabled for Safe Repair to work.

    With Defender Pro v4.1 (minimum) installed and the above settings configured, run a fresh Malware Scan by going to Defender > Malware Scanning > New Scan…

    Defender - Malware scan
    Run a malware scan in Defender.

    Once the scan is completed, check for modified or suspicious files.

    Defender Malware Scan results
    A malware scan showing modified files and suspicious code detected.

    Next, click on the Malware Scanning > Issues tab.

    Defender - Malware Scan Safe Repair

    Select a file and click on the Safe Repair button.

    You will be given the option to repair and/or quarantine the selected file.

    Defender Repair File feature
    We recommend quarantining files before repairing them.

    Note that by default, quarantined files will remain isolated for 30 days before being automatically deleted. You can configure quarantine duration in the Malware scanning settings if you want to change this default period.

    Defender Quarantine settings
    You can change the quarantine period in the Malware Scanning settings section.

    Restoring Quarantined Files

    You can restore quarantined files in one of two ways:

    1. Via WordPress Admin: Go to Defender > Malware scanning > Quarantined section.
    2. Via The Hub: Use the Quarantined Hub widget under the Security tab.

    Restoring Quarantined Files Via The WordPress Admin

    Quarantined files are listed under the new quarantine tab.

    Defender Quarantined section
    Defender stores all of your quarantined files in the Quarantined section.

    To restore quarantined files from your WordPress admin, log into your WordPress site, and go to Defender Pro > Malware Scanning > Quarantined.

    Defender Pro - Malware Scanning - Quarantined section
    View all of your quarantined files in the Malware Scanning section.

    This section lets you go through your quarantined files and choose to either restore or permanently delete these.

    Defender Quarantined Fles - Options
    Restore or delete your quarantined files.

    Files can also be restored manually by downloading them from /wp-content/.defender-security-quarantine.

    Restoring Quarantined Files Via The Hub

    The Hub’s Security tab lists your most recent quarantined files (up to a maximum of 5 files) and provides the following options, depending on whether the website is running or not.

    • If the website is up – files can be restored from the Hub.
    • If the website is down – instructions will display on how to restore the quarantined file(s) manually using FTP/SSH
    The Hub - Quarantined Files widgets
    Monitor quarantined files in The Hub’s Security section.

    Repair Files Safely Using Defender

    Defender 4.1 now lets you apply a powerful combination of quarantining and repairing modified or suspicious file threats and isolating files instead of deleting these entirely, lessening the risk of breaking your site, as quarantined files can be restored if required.

    For full details on using the new Safe Repair feature and all of its options, see the Defender plugin documentation section.

  • Put Your Forms On The Map with New Forminator Geolocation Add-On

    Our formtastic team’s done it again! Forminator’s new Geolocation Add-on with Google Maps API integration lets you effortlessly gather geolocation data from your form submissions and provide address auto-completion for a smoother user experience.

    After releasing the highly anticipated PDF Generator Add-on, we’re proud to announce another powerful addition to our form-building plugin…Geolocation add-on!

    If your business needs to collect location information from users, Forminator Pro with Geolocation Add-on is the only form-building plugin you’ll need.

    In this post, we’ll look at:

    Key Benefits of Using Forminator’s Geolocation Add-on

    With Forminator’s Geolocation Add-on enabled, you can enhance forms on your site in the following ways:

    Accurate Location Detection

    Forminator can precisely pinpoint the user’s location by harnessing the device’s GPS or IP address.

    This information is seamlessly integrated into your forms, giving you real-time access to where your users are located.

    Moreover, the Geolocation feature includes a convenient address lookup function, allowing users to search for and select their location using postal addresses, city names, or zip codes.

    Forminator form submission
    See the user’s location in your form submissions.

    Interactive Map View

    One of the standout aspects of the Geolocation feature is its map view. Not only can users see their location on a map but also interact with it.

    Users have the option to manually input their location or select it directly from a map marker. This dynamic map view enhances user engagement and makes it easy for users to provide accurate location details.

    Customization Options

    Forminator’s Geolocation offers a range of customization options to suit your needs. You can configure the display of Google Maps next to your address field, choose whether to position the map above or below the address field, and even adjust the map’s size, ensuring a responsive or custom fit for various devices.

    Additionally, you have the flexibility to set a default map location based on specific latitude and longitude coordinates.

    Geolocation Map Customization
    You can easily customize your map’s geolocation options.

    Seamless Integration

    To utilize the Geolocation feature, simply enter your Google Maps API key in the Geolocation settings, ensuring a seamless and reliable experience for your users.

    Global Settings

    For ease of use across all your forms, you can enable Geolocation as a default setting on all address fields throughout your site. This simplifies the process of collecting location information from your users.

    Forminator Geolocation Settings
    Enable Geolocation as a default setting on all new forms.

    User-Friendly Configuration

    If you require users to provide location access before submitting a form, the “Require access to users’ location” option can be enabled. Additionally, you can customize the error message displayed if users choose not to provide location access.

    How To Use Forminator’s Geolocation Add-on

    To install and use the Geolocation Add-on, you’ll need to have Forminator Pro installed and activated on your site.

    Forminator Pro is included in all paid memberships, so if you’re not a WPMU DEV member yet, consider becoming one by choosing one of our risk-free membership plans.

    With Forminator Pro installed, go to the Add-Ons section of the plugin’s menu and click Install.

    Forminator Add-Ons screen: Geolocation Addon highlighted.
    Install Geolocation in the plugin’s Add-Ons screen.

    Once the plugin has been installed, click Configure.

    Formoinator Add-Ons - Geolocation - Configure button highlighted.
    You’ll need to configure the Add-On before you can use it.

    You’ll need to add a valid Google Maps API key to enable and set up geolocation on your forms. Refer to our Forminator Docs for instructions on obtaining this key if you need help with this step.

    Enter your key into the Google Maps API field, switch the toggle on to enable geolocation as the default option for all your new forms (optional), and click the Save button to continue.

    Configure Geolocation
    Enter your Google Maps API key.

    Once the API key has been validated and the configuration has been successfully saved, a confirmation message will display briefly on your screen letting you know that you’re all good to go.

    Note: You can access additional Geolocation configuration settings for individual forms (e.g. disabling geolocation or making it mandatory for users to provide their location details in order to submit a form) in the Forms > Edit Form > Settings section.

    Forminator Form Settings screen
    Configure additional Geolocation settings in the Form Settings section.

    With the addon configured, let’s go through an example of adding Geolocation field to a form.

    Adding Geolocation Fields To Forms

    In the Forms section, select a form or create a new form and select Edit > Fields.

    Forminator: Edit Form - Insert fields button.
    Click on the Insert fields button to add Geolocation to a form.

    Select the Address field and click the Insert Fields button.

    Forminator form fields selector
    Add an address field to your form.

    The Address field is highly customizable and includes a Geolocation tab with advanced options for configuring maps, such as:

    • Autocomplete: Provides real-time suggestions as users enter an address into the field.
    • Display address in Map: Displays a map next to the address fields
    • Map Position: Choose whether to display the map above or below (default) the address field.
    • Map Size: Set a responsive or custom size for your map.
    • Default Map Location: Set a default of custom location for your map.
    Forminator Address field settings - Geolocation options.
    Forminator Address field settings include advanced Geolocation options.

    Configure the above settings to suit your needs and to facilitate user interaction with your form maps and a great user experience.

    For example, enable autocomplete to display matching locations as users start typing and to fill in the address fields automatically when an address is selected from the options displayed.

    Forminator geolocation - autocomplete fields
    Enable autocomplete for a smoother and more interactive user experience with form maps.

    Once the browser loads the form page, it will prompt users to give access to their location. Allowing this access will then show the user’s current location on the map and auto complete the address fields.

    Forminator form with map
    Enabling autocomplete also prefills all address details on the form.

    By simply clicking on different points on the map, users can also change their location and update address fields.

    Clicking on different points on the map changes the address on the form fields.

    All form information including the user’s geolocation details and a map will also display on Forminator’s submission page.

    Forminator submission page with example of form submission.
    An example of a Forminator form submission showing a map with the user’s location and coordinates.

    It’s All About Geolocation, Geolocation, Geolocation

    Forminator’s new Geolocation feature empowers you to collect and leverage location information from your form users, gain valuable insights into your audience, whether they are customers, employees, or suppliers, and make more informed business decisions.

    Check out this feature in Forminator Pro and if you need any help, see our documentation or contact our expert 24/7 support team.

  • Put Your Forms On The Map with New Forminator Geolocation Add-On

    Our formtastic team’s done it again! Forminator’s new Geolocation Add-on with Google Maps API integration lets you effortlessly gather geolocation data from your form submissions and provide address auto-completion for a smoother user experience.

    Forminator map with geolocation feature.
    See where form users are located with Forminator’s new geolocation feature.

    After releasing the highly anticipated PDF Generator Add-on, we’re proud to announce another powerful addition to our form-building plugin…Geolocation add-on!

    If your business needs to collect location information from users, Forminator Pro with Geolocation Add-on is the only form-building plugin you’ll need.

    In this post, we’ll look at:

    Key Benefits of Using Forminator’s Geolocation Add-on

    With Forminator’s Geolocation Add-on enabled, you can enhance forms on your site in the following ways:

    Accurate Location Detection

    Forminator can precisely pinpoint the user’s location by harnessing the device’s GPS or IP address.

    This information is seamlessly integrated into your forms, giving you real-time access to where your users are located.

    Moreover, the Geolocation feature includes a convenient address lookup function, allowing users to search for and select their location using postal addresses, city names, or zip codes.

    Forminator form submission
    See the user’s location in your form submissions.

    Interactive Map View

    One of the standout aspects of the Geolocation feature is its map view. Not only can users see their location on a map but also interact with it.

    Users have the option to manually input their location or select it directly from a map marker. This dynamic map view enhances user engagement and makes it easy for users to provide accurate location details.

    Customization Options

    Forminator’s Geolocation offers a range of customization options to suit your needs. You can configure the display of Google Maps next to your address field, choose whether to position the map above or below the address field, and even adjust the map’s size, ensuring a responsive or custom fit for various devices.

    Additionally, you have the flexibility to set a default map location based on specific latitude and longitude coordinates.

    Geolocation Map Customization
    You can easily customize your map’s geolocation options.

    Seamless Integration

    To utilize the Geolocation feature, simply enter your Google Maps API key in the Geolocation settings, ensuring a seamless and reliable experience for your users.

    Global Settings

    For ease of use across all your forms, you can enable Geolocation as a default setting on all address fields throughout your site. This simplifies the process of collecting location information from your users.

    Forminator Geolocation Settings
    Enable Geolocation as a default setting on all new forms.

    User-Friendly Configuration

    If you require users to provide location access before submitting a form, the “Require access to users’ location” option can be enabled. Additionally, you can customize the error message displayed if users choose not to provide location access.

    How To Use Forminator’s Geolocation Add-on

    To install and use the Geolocation Add-on, you’ll need to have Forminator Pro installed and activated on your site.

    Forminator Pro is included in all paid memberships, so if you’re not a WPMU DEV member yet, consider becoming one by choosing one of our risk-free membership plans.

    With Forminator Pro installed, go to the Add-Ons section of the plugin’s menu and click Install.

    Forminator Add-Ons screen: Geolocation Addon highlighted.
    Install Geolocation in the plugin’s Add-Ons screen.

    Once the plugin has been installed, click Configure.

    Formoinator Add-Ons - Geolocation - Configure button highlighted.
    You’ll need to configure the Add-On before you can use it.

    You’ll need to add a valid Google Maps API key to enable and set up geolocation on your forms. Refer to our Forminator Docs for instructions on obtaining this key if you need help with this step.

    Enter your key into the Google Maps API field, switch the toggle on to enable geolocation as the default option for all your new forms (optional), and click the Save button to continue.

    Configure Geolocation
    Enter your Google Maps API key.

    Once the API key has been validated and the configuration has been successfully saved, a confirmation message will display briefly on your screen letting you know that you’re all good to go.

    Note: You can access additional Geolocation configuration settings for individual forms (e.g. disabling geolocation or making it mandatory for users to provide their location details in order to submit a form) in the Forms > Edit Form > Settings section.

    Forminator Form Settings screen
    Configure additional Geolocation settings in the Form Settings section.

    With the addon configured, let’s go through an example of adding Geolocation field to a form.

    Adding Geolocation Fields To Forms

    In the Forms section, select a form or create a new form and select Edit > Fields.

    Forminator: Edit Form - Insert fields button.
    Click on the Insert fields button to add Geolocation to a form.

    Select the Address field and click the Insert Fields button.

    Forminator form fields selector
    Add an address field to your form.

    The Address field is highly customizable and includes a Geolocation tab with advanced options for configuring maps, such as:

    • Autocomplete: Provides real-time suggestions as users enter an address into the field.
    • Display address in Map: Displays a map next to the address fields
    • Map Position: Choose whether to display the map above or below (default) the address field.
    • Map Size: Set a responsive or custom size for your map.
    • Default Map Location: Set a default of custom location for your map.
    Forminator Address field settings - Geolocation options.
    Forminator Address field settings include advanced Geolocation options.

    Configure the above settings to suit your needs and to facilitate user interaction with your form maps and a great user experience.

    For example, enable autocomplete to display matching locations as users start typing and to fill in the address fields automatically when an address is selected from the options displayed.

    Forminator geolocation - autocomplete fields
    Enable autocomplete for a smoother and more interactive user experience with form maps.

    Once the browser loads the form page, it will prompt users to give access to their location. Allowing this access will then show the user’s current location on the map and auto complete the address fields.

    Forminator form with map
    Enabling autocomplete also prefills all address details on the form.

    By simply clicking on different points on the map, users can also change their location and update address fields.

    Clicking on different points on the map changes the address on the form fields.

    All form information including the user’s geolocation details and a map will also display on Forminator’s submission page.

    Forminator submission page with example of form submission.
    An example of a Forminator form submission showing a map with the user’s location and coordinates.

    It’s All About Geolocation, Geolocation, Geolocation

    Forminator’s new Geolocation feature empowers you to collect and leverage location information from your form users, gain valuable insights into your audience, whether they are customers, employees, or suppliers, and make more informed business decisions.

    Check out this feature in Forminator Pro and if you need any help, see our documentation or contact our expert 24/7 support team.

  • Troubleshooting WordPress: 502 Bad Gateway Error

    As a web developer working with WordPress, troubleshooting errors is part and parcel of your journey. One common error you might come across is the dreaded “502 Bad Gateway” error.

    In this tutorial, we’ll dive into the meaning of a 502 Bad Gateway error, provide examples to help you identify it, and offer step-by-step instructions on how to troubleshoot and resolve this issue efficiently.

    We’ll cover the following areas:

    Understanding the Error

    The 502 Bad Gateway error is an HTTP status code that indicates communication failure between two servers, often a web server (like Nginx or Apache) and an upstream server (like PHP-FPM or a database server).

    In the context of WordPress, this error typically arises when your web server cannot receive a valid response from an upstream server. Basically, a 502 bad gateway message indicates that something went wrong while connecting with a device that should fetch all the elements your web page needs to load.

    502 Error message - nginx
    The dreaded 502 Bad Gateway error message.

    Common Causes of 502 Errors

    Server Overload

    When a server is overloaded with too many requests, it can struggle to process them all, leading to delayed or failed responses. This overload could be due to sudden spikes in website traffic, misconfiguration, or inadequate server resources.

    DNS Issues

    Domain Name System (DNS) issues can lead to a “Bad Gateway 502” error. If the DNS server fails to resolve the domain name, the communication between servers breaks down, triggering the error.

    Network Connectivity Problems

    Disruptions in network connectivity, such as broken connections or high latency, can also contribute to the occurrence of the “Bad Gateway 502” error.

    PHP-FPM or Backend Server Issues

    PHP-FPM (PHP FastCGI Process Manager) is a highly efficient and configurable alternative to the traditional way of running PHP scripts on a web server. Instead of having the web server handle PHP scripts directly, PHP-FPM manages a pool of worker processes to handle PHP requests and works as an intermediary between the web server (e.g., Nginx, Apache) and the PHP interpreter.

    Handling PHP requests and processing these separately from the web server improves resource management and contributes to better performance and stability in serving dynamic content, such as what’s commonly found in WordPress websites.

    If your web server relies on PHP-FPM or any other backend service, issues with these servers can lead to 502 errors.

    Database Server Problems

    If your WordPress site is connected to a database server (like MySQL), database connection problems can result in a 502 error.

    Proxy or CDN Configuration

    Incorrect settings or misconfigurations within your content delivery network (CDN) or proxy server can also trigger this error.

    Plugins or Themes

    Faulty plugins or themes that overload or improperly interact with your server can lead to 502 errors.

    Recognizing a Bad Gateway Error

    When a 502 Bad Gateway error occurs, users visiting your website might see a message like:

    • “502 Bad Gateway”
    • “502 Bad Gateway – nginx”
    • “502 Proxy Error”
    • “Bad Gateway: The proxy server received an invalid response from an upstream server.”

    Troubleshooting and Resolving Errors

    It goes without saying that the best way to prevent most server-related issues is to host your sites with a reliable hosting company.

    WPMU DEV not only offers award-winning managed WordPress hosting as voted by users, but all of our hosting plans are also built on a self-healing architecture that proactively attempts to restart hosting services during high server loads to prevent issues and minimize disruptions.

    If you are a WPMU DEV member, we also recommend activating Uptime from The Hub. Uptime will alert you if your site goes down for any reason, including issues that can lead to a 502 error.

    Uptime email alert - website down - 502 error
    Uptime alerts you when issues like a 502 error cause your site to go down.

    Here’s a list of all the downtime issues Uptime monitors and their error status codes.

    Now, let’s delve into the steps you can take to diagnose and resolve the 502 Bad Gateway error on your WordPress site.

    Step 1: Refresh the Page

    Sometimes, the 502 error might be transient and can be resolved by simply refreshing the page. This could indicate a temporary server glitch.

    Step 2: Check Other Sites

    Visit other websites to determine if the issue is isolated to your site or affecting multiple websites. This can help you differentiate between a problem on your end or a more widespread issue.

    Step 3: Clear Browser Cache and Cookies

    Cached data in your browser might be causing the error. Consider clearing server-side caches (e.g. object cache, static cache etc.), then try accessing your website again.

    Step 4: Flush DNS Cache

    Flushing your computer’s DNS cache can help resolve DNS-related issues that might contribute to the error. See this guide if you need help.

    Step 5: Monitor Server Status

    Check the status of your web server, backend servers, and database servers. Look for server load issues or errors in server logs.

    Step 6: Review PHP and Backend Configuration

    Inspect your PHP-FPM or backend server configuration files. Make sure they are properly configured and functioning as expected.

    Step 7: Examine CDN and Proxy Settings

    If you’re using a CDN or proxy server, review their settings for any misconfigurations. Ensure that requests are being properly forwarded to your web server. Clearing the CDN cache may also be helpful.

    Step 8: Disable Problematic Plugins/Themes

    Temporarily deactivate all plugins and switch to a default WordPress theme. Gradually reactivate plugins one by one to identify if any are causing the 502 error.

    Step 9: Increase Server Resources

    If your server is running out of resources, consider upgrading your hosting plan or optimizing your server settings.

    Step 10: Consult Hosting Support

    If the error persists and you’re unable to identify the cause, reach out to your hosting provider’s support team. They can provide valuable insights and assistance in resolving the issue.

    Preventing and Minimizing 502 Errors

    Additional measures to help prevent or minimize potential 502 errors include the following:

    1. Optimize Server Performance

    Invest in robust server infrastructure and optimize server performance to significantly reduce the likelihood of encountering “Bad Gateway 502” errors.

    2. Implement Redundancy

    Having backup servers ready to take over in case of failure will help to maintain uninterrupted service and prevent errors.

    3. Load Balancers

    Implement load balancers to distribute incoming traffic across multiple servers. This reduces the risk of overloading a single server and triggering the error.

    4. Content Delivery Networks (CDNs)

    CDNs store cached copies of websites on servers located globally. This can enhance website performance and reduce the chances of a “Bad Gateway 502” error. If you’re not using a CDN, consider implementing one in your setup.

    5. Regular Server Maintenance

    Perform routine server maintenance, including software updates and security checks to prevent unforeseen errors.

    6. Monitoring and Alert Systems

    Implement monitoring tools and alert systems (e.g. Uptime) to notify administrators of server issues in real-time, allowing for swift intervention and error resolution.

    7. Distributed Denial of Service (DDoS) Protection

    DDoS protection services can safeguard servers from malicious traffic surges, preventing server overload and potential 502 errors.

    8. Implement Graceful Error Handling

    Graceful error handling refers to the practice of designing a website or application to handle errors and unexpected situations in a smooth and user-friendly manner.

    Custom error pages and graceful error handling can enhance user experience by providing informative messages, clear, human-readable explanations of what went wrong and offering actionable steps to resolve the issue instead of presenting users with the standard error codes, confusing error messages, or technical jargon.

    Know What To Do When You Get a 502

    Facing a 502 Bad Gateway error in WordPress can be frustrating.

    If you experience a 502 error, refer to the above information to help you quickly identify possible causes and solutions. Make sure you’re familiar with WordPress troubleshooting tools and our WordPress troubleshooting guide and follow the steps outlined above to identify and address the root cause of the error to ensure your website remains up and running smoothly for your visitors.

    And of course, if you are a WPMU DEV member and need additional help troubleshooting errors, you can always access our 24/7 expert support team anytime for assistance with anything WordPress or hosting-related.

    Want more? Learn how to troubleshoot a 504.

  • Make WordPress PDFing Simple, Easy, Fast & Flexible With Forminator’s New PDF Generator Addon

    Meet Forminator’s powerful PDF Generator Addon…the simplest, easiest and most automated way to create, edit, and send out form-submitted PDFs without leaving your WordPress dashboard!

    Forminator plugin users spoke to us about the challenges they face creating and sending out form-generated PDFs on the fly that seamlessly integrate with their business processes.

    For example:

    • “I would like to send a PDF of our forms with email notifications using Forminator. But I don’t want to use the E2PDF method because it’s too limited for us.”
    • “We need to create a form for our user, and generate a PDF after they write on it, and give them the possibility to pay.”
    • “Does anyone know how I can generate a PDF from a form submission like Gravity PDF?”

    Forminator users, we heard you!

    Forminator Pro now gives you the ability to integrate, create, generate, and automate PDFs using our nifty new PDF generator addon!

    Install with just one click and say goodbye to limited free 3rd-party plugins, costly upgrades, and unnecessary integrations!

    In this post, we’ll cover the following areas:

    PDF Generator Addon – Key Features

    Built to make it easy for any user to create and customize a PDF file from form submission regardless of their technical level, here are some of the key features of Forminator’s PDF Generator Addon:

    Easier PDF Generation

    “I am working on a free course for artists who want to start their own websites. They fill out a form and then get a PDF download of their answers. This will serve as a ‘Scope of Work’ for their project.”

    Forminator’s PDF Builder uses the same intuitively easy-to-use drag and drop visual interface as the Form builder, providing a seamless user experience with no additional learning curve required.

    In fact, the PDF creation option is part of the Form Builder, so it only takes a couple of clicks to create a PDF file.

    Customizable PDFs

    Forminator gives users high flexibility by not only making it easy to customize the PDF form structure and layout using its form builder, but also customize PDF content using the Rich Text field, add additional form fields, and insert field tags (see “How to Use” section below).

    Autogenerated PDFs

    PDFs can be autogenerated from your existing form structure and form fields, so you don’t need to create your PDF from scratch.

    However, Forminator is flexible enough so that if you want to design your PDF fom scratch, you can.

    Attach Emails to PDFs

    “It would be great if PDFs could be created of the form submissions and could be attached and sent over emails.”

    You can send customized email notifications to admins and visitors with PDF attachments automatically. (see “How to Use” section below.)

    Downloadable PDFs

    Download the PDFs of the form submissions on the Submissions page.

    Unlimited PDFs

    No limits on usage of fields, number of pages, or number of PDFs.

    PDFs and More PDFs

    Create multiple PDFs on the same form.

    PDF Templates

    Generate PDF files for payment receipts, invoices, and quotations in seconds with easy-to-use pre-designed templates. (Coming soon!)

    We also have loads more features coming soon (e.g. payment and quotation fields, more settings to customize PDF form appearance with colors and fonts, allowing form submitters to download PDFs after submission, etc.), so watch this space!

    How to Use Forminator’s PDF Generator Addon

    As mentioned earlier, one of the key features of Forminator’s PDF Generation Addon is that it works just like the plugin’s Form builder, so once you’ve installed it, configuring your PDF forms is so easy.

    Note: This is a Pro feature, so make sure you have Forminator Pro installed, or consider becoming a WPMU DEV member if you are currently using our free Forminator plugin.

    Creating PDFs

    To create PDFs, first make sure to install the addon. You can do this from your WPMU DEV Dashboard plugin, or by going to Forminator Pro > Add-ons .

    Forminator PDF Add-on Screen
    Install the PDF Generator from Forminator Pro’s Add-Ons section.

    Note: to use the PDF Generator Addon, make sure that you have created at least one form on your site. Remember too, that you can generate multiple PDF files for the same form.

    Once the add-on has been installed and activated, edit the form you want to attach a PDF to, and in the Edit Form > PDF section, click on Create New PDF.

    Forminator PDF Generation Screen
    Create a new PDF in Forminator’s Edit Form > PDF section.

    Give your new PDF a filename and click the + Create button.

    Forminator - PDF Filename Modal
    Give your PDF a name for internal identification purposes.

    Next, choose a template for your PDF. Note: As we develop this feature further, we’ll be adding all kinds of new templates to this section for generating PDF receipts, quotations, etc.

    After selecting your template, click the Continue button.

    Forminator PDF Templates
    Forminator Pro users can choose from a range of professionally designed PDF templates.

    The Preload PDF Content modal gives you the choice of preloading form fields into your new PDF file, or creating your PDF from scratch.

    Choose an option and click the Continue button to proceed.

    Forminator - Preload PDF Content
    Forminator gives you the choice of preloading form fields or starting with a blank file.

    Once your PDF file is created, you can edit it or continue the setup process.

    Forminator PDF Modal
    Once your PDF file is created, you can edit it or continue building your form.

    If you selected the Preload Form Fields in PDF File option, the fields in your form will load in your PDF file.

    Editing PDFs

    While the Page Header and Page Footer elements are static and cannot be moved, you can edit the settings and style for all fields by clicking on the gear icon to the right of the fields.

    You can also rearrange non-static fields using drag and drop to fully customize the layout of your PDF.

    Forminator - Edit PDF Fields
    Insert, edit, and preview your form fields.

    As well as preloading form fields, you can insert additional fields to add custom text and labels, add page breaks to create multipage PDFs, insert payment and quotation fields, and more.

    Forminator - Add PDF Fields
    There are many PDF form field options to choose from.

    Note: To add custom text in your forms, use the Rich Text field. Use either a label for the field, or hide the label and add your own text with formatting options like bold, italics, bullet points, and hyperlinks.

    You can also insert form fields into the text area to create a customized PDF template that will autopopulate your form details when generated.

    Forminator - Rich Text PDF Field
    Use the Rich Text field to format and style your form field content.

    Additionally, you can adjust the appearance of your PDFs using appearance options, which allow you to control how your PDFs will look and their layout.

    Forminator - Edit PDF Appearance

    The Page settings section lets you set the page size from a dropdown menu, with the recommended default being A4. The default page margin is 30 pixels, and you can change this under the Custom tab.

    You can also enable the RTL (Right-to-Left) option to output your PDF in languages like Arabic, Hebrew, Farsi, Urdu, etc., and if you’re familiar with CSS, you can use the Custom CSS option to further customize your PDF. Many selectors are included to help you, and if you need further assistance, make sure to contact our 24/7 Live Support team.

    After creating or editing your PDF, you can save it as a Draft to continue working on it at a later time. You can also preview, edit, or delete it, and publish or unpublish it.

    Forminator - Edit Form screen.
    A Forminator Form with a Forminator generated PDF.

    Emailing PDFs

    With Forminator’s PDF Generator Addon, attaching PDFs to emails is really simple and easy.

    After creating your PDF form, go to Forminator > Edit Form > Email Notifications and select the PDF file(s) to attach to the email notification you have set up.

    Forminator - Edit Form - Email Notifications
    Select one or more PDFs to attach to the email.

    Note: You can also set up conditional email rules to automatically send specific PDFs to specific users.

    Forminator - Add Email Notification - Conditions.
    Use the power of conditional emails to send PDFs to specific users.

    Downloading PDFs

    You can download PDFs on form submissions from the Submissions page for forms with PDF templates. There are no restrictions on the number of PDFs you can download.

    If you have more than one PDF template available for a single form, you can download the form submission PDF for each template separately or the PDFs of all the templates as a zip file.

    Download PDFs
    Download PDFs for all submission forms.

    For full details on using the PDF generator addon and all of its features refer to our Forminator documentation.

    With Forminator Pro, You Can’t Go PDF’ing Wrong!

    Forminator Pro’s new PDF generator allows you to generate an unlimited number of PDFs with your forms and form submissions, customize, edit, and style PDF templates, and a whole lot more.

    If you are a WPMU DEV member, there is nothing else you need to purchase to start generating professional PDFs. Simply install the addon in Forminator, tweak the appearance and settings in your forms, and you’re all good to go.

    If you’re not a member yet, consider choosing one of our risk-free membership options (Pro or Agency). You’ll not only get all of our Pro plugins, you’ll also get access to everything else you need to use PDFs effectively, including site management, client report, and client billing tools, white label and reseller options, 24/7 expert support on all areas related to WordPress, CSS, hosting, etc, and so much more!

    Start using Forminator’s PDF Generator Addon today…it’s PDF’ing great!

  • Make WordPress PDFing Simple, Easy, Fast & Flexible With Forminator’s New PDF Generator Addon

    Meet Forminator’s powerful PDF Generator Addon…the simplest, easiest and most automated way to create, edit, and send out form-submitted PDFs without leaving your WordPress dashboard!

    Forminator plugin users spoke to us about the challenges they face creating and sending out form-generated PDFs on the fly that seamlessly integrate with their business processes.

    For example:

    • “I would like to send a PDF of our forms with email notifications using Forminator. But I don’t want to use the E2PDF method because it’s too limited for us.”
    • “We need to create a form for our user, and generate a PDF after they write on it, and give them the possibility to pay.”
    • “Does anyone know how I can generate a PDF from a form submission like Gravity PDF?”

    Forminator users, we heard you!

    Forminator Pro now gives you the ability to integrate, create, generate, and automate PDFs using our nifty new PDF generator addon!

    Install with just one click and say goodbye to limited free 3rd-party plugins, costly upgrades, and unnecessary integrations!

    In this post, we’ll cover the following areas:

    PDF Generator Addon – Key Features

    Built to make it easy for any user to create and customize a PDF file from form submission regardless of their technical level, here are some of the key features of Forminator’s PDF Generator Addon:

    Easier PDF Generation

    “I am working on a free course for artists who want to start their own websites. They fill out a form and then get a PDF download of their answers. This will serve as a ‘Scope of Work’ for their project.”

    Forminator’s PDF Builder uses the same intuitively easy-to-use drag and drop visual interface as the Form builder, providing a seamless user experience with no additional learning curve required.

    In fact, the PDF creation option is part of the Form Builder, so it only takes a couple of clicks to create a PDF file.

    Customizable PDFs

    Forminator gives users high flexibility by not only making it easy to customize the PDF form structure and layout using its form builder, but also customize PDF content using the Rich Text field, add additional form fields, and insert field tags (see “How to Use” section below).

    Autogenerated PDFs

    PDFs can be autogenerated from your existing form structure and form fields, so you don’t need to create your PDF from scratch.

    However, Forminator is flexible enough so that if you want to design your PDF fom scratch, you can.

    Attach PDFs to Emails

    “It would be great if PDFs could be created of the form submissions and could be attached and sent over emails.”

    You can send customized email notifications to admins and visitors with PDF attachments automatically. (see “How to Use” section below.)

    Downloadable PDFs

    Download the PDFs of the form submissions on the Submissions page.

    Unlimited PDFs

    No limits on usage of fields, number of pages, or number of PDFs.

    PDFs and More PDFs

    Create multiple PDFs on the same form.

    PDF Templates

    Generate PDF files for payment receipts, invoices, and quotations in seconds with easy-to-use pre-designed templates. (Coming soon!)

    We also have loads more features coming soon (e.g. payment and quotation fields, more settings to customize PDF form appearance with colors and fonts, allowing form submitters to download PDFs after submission, etc.), so watch this space!

    How to Use Forminator’s PDF Generator Addon

    As mentioned earlier, one of the key features of Forminator’s PDF Generation Addon is that it works just like the plugin’s Form builder, so once you’ve installed it, configuring your PDF forms is so easy.

    Note: This is a Pro feature, so make sure you have Forminator Pro installed, or consider becoming a WPMU DEV member if you are currently using our free Forminator plugin.

    Creating PDFs

    To create PDFs, first make sure to install the addon. You can do this from your WPMU DEV Dashboard plugin, or by going to Forminator Pro > Add-ons .

    Forminator PDF Add-on Screen
    Install the PDF Generator from Forminator Pro’s Add-Ons section.

    Note: to use the PDF Generator Addon, make sure that you have created at least one form on your site. Remember too, that you can generate multiple PDF files for the same form.

    Once the add-on has been installed and activated, edit the form you want to attach a PDF to, and in the Edit Form > PDF section, click on Create New PDF.

    Forminator PDF Generation Screen
    Create a new PDF in Forminator’s Edit Form > PDF section.

    Give your new PDF a filename and click the + Create button.

    Forminator - PDF Filename Modal
    Give your PDF a name for internal identification purposes.

    Next, choose a template for your PDF. Note: As we develop this feature further, we’ll be adding all kinds of new templates to this section for generating PDF receipts, quotations, etc.

    After selecting your template, click the Continue button.

    Forminator PDF Templates
    Forminator Pro users can choose from a range of professionally designed PDF templates.

    The Preload PDF Content modal gives you the choice of preloading form fields into your new PDF file, or creating your PDF from scratch.

    Choose an option and click the Continue button to proceed.

    Forminator - Preload PDF Content
    Forminator gives you the choice of preloading form fields or starting with a blank file.

    Once your PDF file is created, you can edit it or continue the setup process.

    Forminator PDF Modal
    Once your PDF file is created, you can edit it or continue building your form.

    If you selected the Preload Form Fields in PDF File option, the fields in your form will load in your PDF file.

    Editing PDFs

    While the Page Header and Page Footer elements are static and cannot be moved, you can edit the settings and style for all fields by clicking on the gear icon to the right of the fields.

    You can also rearrange non-static fields using drag and drop to fully customize the layout of your PDF.

    Forminator - Edit PDF Fields
    Insert, edit, and preview your form fields.

    As well as preloading form fields, you can insert additional fields to add custom text and labels, add page breaks to create multipage PDFs, insert payment and quotation fields, and more.

    Forminator - Add PDF Fields
    There are many PDF form field options to choose from.

    Note: To add custom text in your forms, use the Rich Text field. Use either a label for the field, or hide the label and add your own text with formatting options like bold, italics, bullet points, and hyperlinks.

    You can also insert form fields into the text area to create a customized PDF template that will autopopulate your form details when generated.

    Forminator - Rich Text PDF Field
    Use the Rich Text field to format and style your form field content.

    Additionally, you can adjust the appearance of your PDFs using appearance options, which allow you to control how your PDFs will look and their layout.

    Forminator - Edit PDF Appearance

    The Page settings section lets you set the page size from a dropdown menu, with the recommended default being A4. The default page margin is 30 pixels, and you can change this under the Custom tab.

    You can also enable the RTL (Right-to-Left) option to output your PDF in languages like Arabic, Hebrew, Farsi, Urdu, etc., and if you’re familiar with CSS, you can use the Custom CSS option to further customize your PDF. Many selectors are included to help you, and if you need further assistance, make sure to contact our 24/7 Live Support team.

    After creating or editing your PDF, you can save it as a Draft to continue working on it at a later time. You can also preview, edit, or delete it, and publish or unpublish it.

    Forminator - Edit Form screen.
    A Forminator Form with a Forminator generated PDF.

    Emailing PDFs

    With Forminator’s PDF Generator Addon, attaching PDFs to emails is really simple and easy.

    After creating your PDF form, go to Forminator > Edit Form > Email Notifications and select the PDF file(s) to attach to the email notification you have set up.

    Forminator - Edit Form - Email Notifications
    Select one or more PDFs to attach to the email.

    Note: You can also set up conditional email rules to automatically send specific PDFs to specific users.

    Forminator - Add Email Notification - Conditions.
    Use the power of conditional emails to send PDFs to specific users.

    Downloading PDFs

    You can download PDFs on form submissions from the Submissions page for forms with PDF templates. There are no restrictions on the number of PDFs you can download.

    If you have more than one PDF template available for a single form, you can download the form submission PDF for each template separately or the PDFs of all the templates as a zip file.

    Download PDFs
    Download PDFs for all submission forms.

    For full details on using the PDF generator addon and all of its features refer to our Forminator documentation.

    With Forminator Pro, You Can’t Go PDF’ing Wrong!

    Forminator Pro’s new PDF generator allows you to generate an unlimited number of PDFs with your forms and form submissions, customize, edit, and style PDF templates, and a whole lot more.

    If you are a WPMU DEV member, there is nothing else you need to purchase to start generating professional PDFs. Simply install the addon in Forminator, tweak the appearance and settings in your forms, and you’re all good to go.

    If you’re not a member yet, consider choosing one of our risk-free membership options (Pro or Agency). You’ll not only get all of our Pro plugins, you’ll also get access to everything else you need to use PDFs effectively, including site management, client report, and client billing tools, white label and reseller options, 24/7 expert support on all areas related to WordPress, CSS, hosting, etc, and so much more!

    Start using Forminator’s PDF Generator Addon today…it’s PDF’ing great!

  • Introducing New Ultra Smush: 5x Image Compression Boost With Minimal Quality Loss

    WPMU DEV’s award-winning image optimization plugin’s new Ultra Smush unlocks unprecedented image compression levels up to 5x greater than Super Smush, while retaining impressive image quality!

    Is your WordPress site filled with images? Do you want those images to load on your pages faster than a lamborghini speeding on the Autobahn and compress them tighter than a full stack developer’s schedule? And do all this with almost no discernible loss of image quality?

    Then it’s time to activate Ultra Smush.

    In this article:

    Let’s get straight into what really matters…

    5x More Savings? Here Are The Results

    Before we get into how to activate and use the new Ultra Smush image compression level and why it can deliver even more impressive results than our already impressive Super Smush feature, let’s share some of the results of using Ultra Smush.

    First, here are the results of performing a bulk smush on a test site with 1,000+ large-ish images with only Super Smush activated (CDN, Local WebP, and Lazy Load are inactive)…

    Image compression savings using Super Smush.
    Before Ultra Smush: Image compression savings using Super Smush only.

    After activating Ultra Smush, we then ran the test again to see if we could squeeze anything more out of an already image-optimized site.

    And it did! Ultra Smush squeezed out more than 5x times savings…

    Bulk Smush test results using Smush's Ultra mode
    After Ultra Smush: More than 5x times savings on an already optimized site!

    Early testers reported getting similar results.

    Super Smush vs Ultra Smush
    Results: Super Smush (Before) vs Ultra Smush (After)

    And here are just some of the comments we received from early testers about Ultra Smush’s impact on image quality:

    • “Ultra is awesome. It was hard to find the difference between qualities. Quality loss is negligible. I am impressed!”
    • “It looks pretty good, only if I look really close I can see that some of the colors are not as vibrant, and that some edges are not as sharp as on the original.”
    • “On a medium size image with lots of details, you gotta look very close to see slight color saturation differences. On a big image with a solid but gradient background, transitions between gradients are more visible and the main object seems lees sharp. You really need to look very close and expect it. Though it’s not for a photo site that requires superb quality. All in all: pretty impressive.”

    Our plugin development team also did extensive testing, comparing Ultra Smush’s results with Ewww image optimizer and TinyPNG by running DSSIM tests (a quality comparison metric that shows variation from the original image – the lower the score, the better).

    Ultra Smush outperformed the competition in most tests and came out the overall winner for both compression savings…

    Ultra Smush tests - Average File Size Reduction
    File Size Reduction testing shows that Ultra Smush is the clear winner!

    …and image quality (lower DSSIM values = better image quality).

    Ultra Smush tests - Average DSSIM Value
    DSSIM testing shows Ultra Smush delivers superior image savings and better quality over the competition.

    To be clear, using Ultra Smush will result in Lossy compression, so while you should not expect the original quality, the results will still be ultra-impressive.

    How To Enable Smush’s Ultra Mode

    Ultra Smush is not just a new feature, it’s an entirely  new compression level for Bulk Smushing images.

    Ultra mode is a feature of Smush Pro that replaces the Super Smush toggle on the free version of the plugin with additional “Smush Mode” options.

    Switching to Ultra mode is ultra easy. If you have Smush Pro installed on your site, simply navigate to the Bulk Smush Settings screen and select Ultra (Higher Compression)by clicking on the button, then save your settings.

    Choose the level of compression for bulk smushing images that best suits your needs.

    Smush Mode offers three compression levels for Bulk Smush settings:

    • Basic – Choose this option for minimal file size reduction (low savings),  pixel-perfect lossless compression of original image quality, and negligible impact on speed.
    • Super – For faster page loads, select this setting for substantial file size reduction with excellent image clarity. Super Smush provides up to 2x compression savings for your images (lossy compression).
    • Ultra – Select this compression option for professional-grade performance compression. Ultra Smush provides compression levels up to 5x greater than Super, while preserving impressive image quality.

    After enabling Ultra Smush in your plugin settings, you can monitor results from The Hub’s Performance tab.

    The Hub: Performance Tab - Ultra Smush
    View Ultra Smush optimization results inside The Hub.

    Notes:

    • If you would rather continue optimizing images using the Basic (lossless) or Super Smush settings, just select those Compression Level options instead.
    • If you enable Ultra Smush on a site where Smush is already running, remember to re-check all images and perform a new Bulk Smush to benefit from further optimization savings.
    Bulk Smush - Recheck Images
    After enabling Ultra Smush, rerun Bulk Smush to optimize your site even further.

    How Does Ultra Smush Compare To Super Smush?

    While Super Smush provides up to 2x faster image optimization with virtually no visible loss in quality, Ultra Smush’s new compression engine offers up to 5 times file size reduction to achieve exceptional compression results.

    Note: Currently, Ultra Smush improves JPEG images only. Features to improve PNG images will be added in future versions of the plugin.

    To learn more about Ultra Smush, refer to the Smush plugin documentation.

    Why Image Compression Is A Big Deal

    If you are just getting started with WordPress optimization, then it’s important to know that using image compression on websites offers several significant benefits that enhance overall user experience and site performance, such as:

    Faster Loading Speeds

    Compressed images are smaller in size, which means they take less time to load when someone visits your WordPress website. Faster loading speeds improve user satisfaction and reduce bounce rates. Additionally, page loading speed is a crucial factor for SEO, as search engines tend to prioritize faster-loading websites in their search results.

    Improved User Experience

    When images load quickly, users are more likely to stay engaged with your content. High-quality, compressed images ensure that visitors can access the visual elements of your website without waiting for prolonged load times. This positive experience can lead to increased user retention and higher conversion rates.

    Bandwidth Savings

    Compressed images consume less bandwidth, making your website more efficient, especially for users with limited data plans or slower internet connections. This can be particularly important for mobile users, as they often have restricted data allowances.

    Reduced Server Load

    Smaller image sizes translate to reduced server load, as the server needs to process and transmit less data for each image request. This can help prevent performance issues during peak traffic times and reduce hosting costs.

    Higher SEO Rankings

    Google and other search engines consider page loading speed as one of the ranking factors. Faster loading times, achieved through image compression, can positively impact your website’s SEO and potentially lead to higher search engine rankings.

    Ease of Backup and Restoration

    Smaller image files are quicker to backup and restore, making it easier to manage your website’s backups efficiently.

    Accessibility Considerations

    Faster loading times benefit all users, including those with disabilities who may rely on screen readers or have limited bandwidth access.

    The easiest way to implement image compression on WordPress websites is to use a plugin like Smush, which can be easily installed and configured to handle image compression and optimization automatically as you upload media to your WordPress site (both internally to the Media Library and external media directories) without compromising visual quality.

    Choose Ultra Smush For Superior Image Optimization

    As mentioned earlier, Ultra Smush is a Smush Pro feature. If you’re currently using the free Smush plugin, consider becoming a WPMU DEV member and start enjoying the benefit of extra savings and performance improvements, plus access to the most robust “all-in-one” WordPress management platform available anywhere.

    So, if your aim is to significantly reduce image file sizes and automate the entire process, the solution is ultra simple…enable Ultra Smush on all your WordPress sites and experience an optimization boost of up to 5x in image compression savings and impressive image quality.

  • Finding Enabled PHP Functions In Your WordPress Hosting Using phpinfo()

    WordPress runs on PHP, so as a WordPress developer, it’s important to understand the PHP functions enabled on the server that hosts your site(s).

    Do you need to set up a plugin or configure an application on a WordPress site and are wondering if a certain PHP function or library is enabled on your server (e.g. cURL)?

    In this tutorial, we’ll show you a quick and easy way to find enabled PHP functions on your server using the phpinfo() function in WordPress. We also provide a comprehensive glossary of these PHP functions for reference, and to help you better understand the backend of your WordPress sites.

    This quick tutorial covers the following:

    What is phpinfo()?

    The phpinfo() function is a built-in PHP function that provides a long list of detailed information about the PHP installation and configuration settings on your server, including all the loaded extensions.

    When phpinfo() is called and executed, it generates a comprehensive HTML page that displays various aspects of the PHP environment, including PHP version, extensions, directives, environment variables, and more.

    The phpinfo() function outputs information in a tabular format, making it easy to navigate and understand the PHP configuration. This knowledge allows you to leverage the available functions on your hosting environment and optimize your WordPress development process.

    The information displayed by phpinfo() can be categorized into different sections that provide specific details about a particular aspect of the PHP environment.

    Some common information you can find using phpinfo() includes:

    1. PHP version: The version of PHP running on the server.
    2. Configuration settings: Various settings and directives defined in the PHP configuration file (php.ini).
    3. Extensions: A list of loaded PHP extensions and their configurations.
    4. Environment variables: Server environment variables and their values.
    5. PHP variables: Information about predefined PHP variables, such as `$_SERVER`, `$_GET`, `$_POST`, etc.
    6. HTTP headers: HTTP request and response headers.

    For a list of all PHP functions enabled on your server, see the tutorial below.

    Notes:

    • Use phpinfo() with caution. While it provides valuable information for development and troubleshooting purposes, it should not be left accessible on a production server. After obtaining the necessary information, we recommend removing or commenting out the phpinfo() function call for security purposes.
    • If you only need to know which version of PHP your server is currently running, you can skip the tutorial below and simply go to the Hosting > Overview tab in The Hub.
    The Hub - Hosting Overview screen - PHP version information.
    Check which version of PHP your server is running from The Hub

    How to Find Enabled PHP Functions On Your Server Using phpinfo()

    By following the steps outlined in this tutorial, you will learn how to easily retrieve a list of information showing all the enabled PHP functions and extensions on your server.

    For this tutorial, we’ll show you how to access the list of PHP functions for a WordPress site set up on WPMU DEV hosting. Note that different hosting environments may use different tools and methods to display this information. Reach out to your hosting support if you have any questions or need help.

    Step 1: Access your WordPress site’s files

    To begin, you need to be able to access the WordPress site’s files stored on your server. You can do this either via FTP or using our File Manager tool.

    Step 2: Create a PHP file

    Next, create a PHP file using a text editor and add the phpinfo() function shown below:

    <?php
phpinfo();

    You can name this PHP file anything you like. In the example below, we’ve named the file ‘info.php’ (note: avoid using an existing filename found on the root folder of your WordPress installation to prevent overwriting the original file).

    PHP file
    Create a PHP file to call the phpinfo() function.

    Save your PHP file and close your text editor.

    Step 3: Upload the file to your server

    Locate the root directory of your WordPress installation, where the main files like wp-config.php and index.php are located, and upload your file to this folder.

    As mentioned earlier, you can do this easily using our File Manager tool.

    File Manager
    Upload the file to the WordPress install root directory.

    Step 4: Access the phpinfo() output

    Open your WordPress site in a web browser and enter the URL of the uploaded PHP file to generate a PHP function report.

    You should see the PHP information displayed. The output will contain detailed information about the PHP configuration, including all enabled functions on your server.

    PHP function report.
    PHP function report.

    Step 5: Locate the enabled PHP functions

    Scroll down the phpinfo() output to find a specific function. Typically, you will find a list of all enabled PHP functions along with their respective settings and configurations in the section labeled “Core.”

    That’s all there is to it!

    Refer to the Glossary section below if you need to look up any of the functions listed in your generated PHP function report .

    Glossary of PHP Functions

    This glossary provides a list of various PHP functions and their applications. Feel free to bookmark this page and use it as a quick reference guide to better understand the backend of your WordPress sites.

    Configuration

    This function deals with setting up PHP to work with the Internet server and to define settings within your PHP scripts.

    • bcmath – This module enables arbitrary precision mathematics in PHP.
    • calendar – This function of PHP allows conversions between various calendar formats.
    • cgi-fcgi – Command for PHP when run in CGI or FastCGI mode.

    Core

    These are basic PHP functions and classes that form the core of the PHP language.

    • ctype – A library of PHP that checks if the data type of a variable is a valid character type.
    • curl – Used for transferring data with URLs and is the backbone of multiple functions in PHP.
    • date – A group of functions that let you retrieve or format the local or GMT date and time in PHP.
    • dom – A PHP extension that provides a robust, powerful DOM (Document Object Model) XML API.
    • exif – PHP function used to work with image metadata.
    • FFI – Foreign Function Interface is an extension that provides a simple way to call native functions, access native variables, and create/access data structures defined in C libraries.
    • fileinfo – A PHP extension that helps you to identify a file’s mime type.
    • filter – This function filters data by either validating or sanitizing it which aids in securing a PHP application.
    • ftp – FTP PHP functions help establish a connection to a remote FTP server, a crucial part of file sharing.
    • gd – A library used for dynamic image creation.
    • gettext – An extension aimed at the internationalization of PHP scripts by providing translation support.
    • gmp – This is a PHP extension for arbitrary precision mathematics.
    • hash – This function is used to generate a hash value from a string.
    • iconv – Provides an interface to the GNU iconv library, which provides conversion of character sets.
    • igbinary – An alternative to PHP serializer with better performance and smaller size.
    • imagick – A PHP extension that allows working with ImageMagick, a robust software suite to create, edit, and compose images.
    • imap – This function provides an API for talking to the internet mail servers using PHP.
    • intl – This extension helps to perform UCA-conformant collation and date/time/number/currency formatting in PHP.
    • json – JSON functions in PHP allows for encoding and decoding JSON data.
    • ldap – LDAP functions connect, bind and disconnect from an LDAP directory.
    • libxml – A foundation library that offers a set of APIs for manipulating XML, including parsing XML documents and support for other document types like HTML.
    • mbstring – A non-binary string handling extension that provides multibyte specific string functions.
    • mcrypt – Provides a variety of encryption functions.
    • memcache – Memcache module provides handy procedural and object-oriented interface to memcached, high-performance, distributed memory object caching system, generic in nature but intended for use in speeding up dynamic web applications by alleviating database load.
    • memcached – An extension for interfacing with memcached via libmemcached library.
    • msgpack – Provides an interface to msgpack.org, which is a binary-based efficient object serialization library.
    • mysqli – A database driver used to interact with MySQL databases.
    • mysqlnd – It’s the MySQL native driver for PHP.
    • openssl – A robust PHP function used for generating and verifying digital signatures.
    • pcre – Provides functions for ‘perl-compatible regular expressions’.
    • PDO – PHP Data Objects is a database access layer providing a uniform method of access to multiple databases.
    • pdo_mysql – A driver that implements the PHP Data Object (PDO) interface to enable access to MySQL databases.
    • Phar – An archive format combined with a runtime library to help build and load PHP applications bundled into a single file.
    • posix – Accessors to the POSIX (Unix) system calls.
    • readline – Provides an interactive line editing capabilities and history functions.
    • redis – A PHP extension for interfacing with Redis, a high performance key-value storage service.
    • Reflection – A PHP extension, allows inspection and reverse-engineering of PHP programs using a process called “reflection”.
    • session – This function enables user session management.
    • shmop – A simple interface for accessing shared memory segments in PHP.
    • SimpleXML – An extension that simplifies the work of reading XML files.
    • soap – SoapClient is a PHP built-in class providing methods for sending SOAP requests and receiving SOAP responses from a URL.
    • sockets – PHP socket functions let you create and manage network sockets, low-level network communications between servers.
    • sodium – Sodium is a modern, easy-to-use software library for encryption, decryption, signatures, password hashing and more.
    • SPL – The Standard PHP Library (SPL) is a collection of interfaces and classes that are part of PHP core.
    • standard – These are built-in functions and classes provided by PHP which do not rely on external dependencies or PHP extensions.
    • sysvmsg – It provides an interface to System V message queues.
    • sysvsem – Offers access to POSIX-style semaphores.
    • sysvshm – Provides shared memory functions.
    • tokenizer – The tokenizer functions provide an API that allows converting PHP source code into an array of tokens.
    • xml – XML (eXtensible Markup Language) Parser functions let you parse XML documents.
    • xmlreader – An extension that pulls data in and pushes it back out again.
    • xmlrpc – PHP implementation of XML-RPC protocol used in exchanging data across a network.
    • xmlwriter – An extension to create XML documents using a simple ‘constructor-like’ style.
    • xsl – XSL is a language for expressing style sheets to transform XML documents into other XML documents.
    • Zend OPcache – An open-source component that improves PHP performance by storing pre-compiled script bytecode in shared memory, thereby removing the need for PHP to load and parse scripts on each request.
    • zip – PHP zip extension is used to read, write, and manipulate zip archives.
    • zlib – Provides access to zlib compression library.

    Additional Modules

    These are the underlying software components or libraries that add various functionalities to the PHP scripting language.

    Environment

    Involved in setting up, configuring, and managing the PHP runtime environment.

    PHP Variables

    These are used to store data which can be modified during the execution of your script.

    DIY or Use Our Support Team

    Learning PHP will enhance your ability to troubleshoot, modify and optimize your WordPress site.

    Hopefully, this tutorial will come in handy if you need to do a quick look up of your server’s enabled PHP functions. Of course, if your WordPress sites are hosted with WPMU DEV, you can always reach out to our 24/7 support team for expert assistance on anything WordPress and hosting related, or get instant answers with our AI-powered assistant.

    And rest assured, our hosting is configured to work with just about all WordPress plugins, applications, and configurations.

  • How to Optimize WordPress Site Performance Using Delay JavaScript Execution

    Looking for ways to further optimize your WordPress site’s performance? Easy…switch on Hummingbird‘s new Delay JavaScript Execution feature!

    Most sites nowadays are laden with JavaScript files and inline scripts, which can be resource intensive and affect site performance and PageSpeed scores in areas like site rendering and load time.

    As you will learn in this article, delaying the execution of JavaScript files to prioritise the load of more critical elements first can keep the overall load time of your site in check and improve your PageSpeed scores.

    Even better, we’ll show you how to automate the whole process with just one click using our WordPress optimization plugin, Hummingbird.

    In this article, we’ll look at:

    Let’s jump right in…

    Why Delaying JavaScript Execution Helps To Optimize Site Performance

    As mentioned earlier, sites nowadays are loaded with 3rd-party scripts for serving advertisements, tracking engagement, security verification, etc., which can block pages from rendering quickly on users’ browsers and affect your site’s user experience and search engine rankings.

    Holding these scripts off from loading on your site until there’s actual user interaction with the page can significantly improve areas of your site’s performance like:

    1. Faster Page Loading Times

    By delaying the execution of JavaScript files until users interact with the page, web pages will load faster, allowing users to access and interact with the site more quickly. This helps improve user experience and increase user engagement.

    2. Improved Rendering Performance

    Browser rendering engines need to process JavaScript before they can display the page content. Delaying JavaScript execution until after users interact the page content has been loaded helps the browser render the page more quickly and efficiently. This means users can see and interact with the web page sooner.

    3. Reduced HTTP Requests

    Combining JavaScript files and loading them asynchronously can reduce the number of HTTP requests made to the server, which also helps to speed up page loading times.

    4. Increased Google PageSpeed Insights Score

    Google considers page speed as a ranking factor for search results, and delaying JavaScript execution can improve your site’s PageSpeed Insights score, potentially leading to better search engine rankings.

    5. Lower Server Load

    By loading JavaScript asynchronously and combining files, fewer requests are made to the server, reducing its workload, and helping to prevent server crashes or slow responses during high-traffic situations.

    Improving PageSpeed Score Recommendations

    PageSpeed Insights score
    Want to improve your PageSpeed Insights score? Try delaying JavaScript file execution.

    Delaying JavaScript execution on your site can improve your Google PageSpeed score by addressing the following recommendations:

    Remove unused JavaScript

    This recommendation suggests eliminating unused or unnecessary JavaScript code from your web pages. Unused JavaScript can increase your page’s load time, as the browser has to download, parse, and execute the code even if it’s not being used.

    By removing any unused JavaScript code, you can decrease the file size and improve your website’s overall performance.

    Total blocking time

    Total blocking time is a metric that measures the amount of time between the First Contentful Paint (FCP) and the Time to Interactive (TTI) during which the main thread was blocked for long enough to prevent input responsiveness.

    In simple terms, it quantifies the duration when the page becomes unresponsive due to processing heavy JavaScript tasks. Lowering the total blocking time makes your website more responsive and improves user experience.

    Minimize main thread work

    The main thread is responsible for executing JavaScript, style calculations, layout, and other tasks required to display a web page. Minimizing main thread work refers to the process of optimizing the code and reducing the time the main thread spends on heavy tasks. This can be done by removing unnecessary JavaScript, splitting long tasks into smaller chunks, and optimizing the code’s execution.

    A lighter workload on the main thread results in faster page loading, improved rendering, and enhanced user experience.

    Time to interactive (TTI)

    This performance metric measures the time it takes for a web page to become fully interactive and responsive to user input. A page is considered interactive when the main thread is free from heavy tasks, and users can interact with the elements on the screen, such as clicking buttons or scrolling.

    Improving the TTI by optimizing JavaScript, splitting large tasks, and reducing render-blocking resources ensures a better user experience by allowing users to interact with the page more quickly.

    Reduce JS execution time

    Reducing JavaScript execution time involves optimizing the code to execute faster and use fewer resources. This can be achieved through techniques such as code minification, removing unused JavaScript, and optimizing algorithms.

    Reducing the execution time leads to faster rendering, decreased total blocking time, and better responsiveness, providing a better user experience.

    First Contentful Paint (FCP)

    This is a performance metric that measures the time it takes for the browser to render the first visible element (text, image, or other content) of a web page. A faster FCP equates to a quicker initial page load, providing users with a visual feedback that the page is loading. Improving FCP requires optimizing critical rendering paths, delaying non-critical JavaScript execution, and prioritizing the loading of visible content.

    A faster FCP significantly contributes to a better user experience and improved web page performance.

    Delaying JavaScript Execution Methods

    While faster page load times, reduced render-blocking, and prioritized content loading provide many benefits to users and can deliver higher PageSpeed scores, the actual methods available for delaying JavaScript execution on WordPress sites can be challenging for users without technical knowledge or web optimization skills.

    For example, these methods can include:

    • Implement async or defer attributes: This requires you to manually add async or defer attributes to your JavaScript files in the HTML header, which tells the browser not to block the page rendering while processing the JavaScript files.
    • Combine JavaScript files: Use online tools or WordPress plugins to combine multiple JavaScript files into a single file, helping to reduce the number of HTTP requests and speed up page loading times.
    • Minify JavaScript files: Use online tools or WordPress plugins to reduce JavaScript file size, which helps to improve page loading times.
    • Prioritize critical JavaScript: Identify the critical JavaScript that needs to be loaded immediately to ensure proper functionality, and then load the remaining JavaScript files after the page content has been rendered.

    While there are a few WordPress plugins available that can handle some of these tasks for you and help you to delay or defer JavaScript execution, our Hummingbird plugin does all of the above and more with the click of a button.

    How to Use Hummingbird’s Delay JavaScript Execution Feature

    The new optimization feature of Hummingbird delays the loading of all JavaScript files and inline scripts until there is user interaction on the page (e.g. mouse movement, keyboard action or screen tap) and improves all of the PageSpeed recommendations described earlier.

    To enable this feature, make sure that Hummingbird is installed and activated on your site, then navigate to Hummingbird > Asset Optimization > Extra Optimization in your WordPress admin and switch on the Enable Delay Javascript toggle button in the Tools > Delay Javascript section, then click Save Changes.

    Hummingbird's Delay JavaScript feature.
    Enable Hummingbird’s Delay JavaScript feature to improve your site’s performance.

    Alternatively, you can enable the feature from the plugin’s main dashboard.

    Hummingbird dashboard: Asset Optimization - Delay JavaScript Execution
    Enable Delay JavaScript Execution from Hummingbird’s dashboard.

    Once the Delay JavaScript Execution feature has been enabled, it automatically goes to work, delaying the loading of any non-critical JavaScript files on your page that are not required above-the-fold.

    The feature’s settings give you access to options like being able to specify a timeout for the scripts to load if no user interaction is detected, and the option to exclude critical JavaScript files from from being delayed on load by specifying their URLs or keywords.

    Hummingbird's Delay JavaScript settings
    Hummingbird delays the loading of JavaScript files until a set timeout limit is reached or a user interacts with the page.

    If enabling this feature breaks something on your site and you identify additional critical Javascript resources which are essential to render the page, simply add them to the Excluded JavaScript Files area to exclude them from being delayed.

    If there is no user interaction on the page beyond a set threshold, the JavaScript assets are forced to load. The default timeout is set to 20 seconds, but you can select a different value from the Timeout dropdown menu (currently ranging between 5-30 seconds).

    Hummingbird's Delay JavaScript Timeout options
    Select a timeout option from the dropdown menu.

    Notes

    • Enabling JavaScript Execution will automatically disable the Combine Compression option to ensure that your site’s scripts are loaded in their correct order.
    • The feature will only work when you’re connected to The Hub, as it pulls the list of continuously updated predefined exclusions from the API.
    • You can easily reverse any changes made by this feature by simply disabling the toggle and clicking save.

    Delay JavaScript and Speed Up WordPress

    Hummingbird’s Delay JavaScript feature is available in both the Pro and free versions of the plugin. We recommend enabling this feature and testing your site using the PageSpeed Insights tool.

    If you experience any issues using Hummingbird, check out the plugin’s documentation or contact our 24/7 support team for immediate expert support.