Elementor: Change Form File Upload Directory

Last Updated April 8, 2021 / Wil / 8 Comments /

Elementor Pro makes it super easy to let your website visitors upload a file, using their native form widget.

By default, Elementor stores the file uploads in a folder on your server at /uploads/elementor/forms/

There are no options on the widget UI to change this location.

It can easily be changed with a few lines of code.

Here’s an example.

/**
 * Change default location of Elementor's form file uploads
 *
 * @param $path
 * @return string
 */
function zpd_change_elementor_form_upload_path( $path ){

    //The folder name
    $folder = 'elementor-file-uploads';

    // Get the WordPress uploads folder
    $wp_upload_dir = wp_upload_dir();

    // This is the new path where we want to store the Form file uploads
    $path = $wp_upload_dir['basedir'] . '/' . $folder;

    /**
     * Check to see if the folder already exists, create if not.
     */
    if ( !file_exists( $path ) ) {
        mkdir( $path, 0755, true);
    }

    return $path;
}
add_filter( 'elementor_pro/forms/upload_path', 'zpd_change_elementor_form_upload_path', 10, 1 );

You can add this code to your theme’s functions.php file and the change will take place when you refresh a website page.

In this example, I am storing the files in a /uploads/elementor-file-uploads/ folder.

If you are storing sensitive data, perhaps add a .htaccess file into the folder to restrict access.

Was this article helpful?
YesNo

Keep In Touch

Wil

Wil is a dad, WordPress consultant, WordPress developer, business coach and mentor. He co-organizes the WordPress Sydney meetup group and has been on the organising committee for WordCamp Sydney since 2014. He speaks at many special events and contributes to the WordPress open source project. His likes are chillies, craft beer and electrogravitics.

8 thoughts on “Elementor: Change Form File Upload Directory”

  1. Florian

    Hi Wil!
    Thanks for sharing this. Was looking all over the place to get this information.
    Would you be so kind to share how this code would look like if you would just “normally” upload the files to the wp Media Library?
    Thanks and all the best!
    Florian

    1. Wil

      Hi Florian

      You’re welcome.

      Without the code and by default, Elementor stores all uploaded form files to the “/wp-content/uploads/elementor/forms” folder.

        1. Wil

          Hey Florian

          If you want the form uploads to go to the current media folder you would replace line 16
          $path = $wp_upload_dir[‘basedir’] . ‘/’ . $folder;

          with
          $path = $wp_upload_dir[‘path’] ;

          This will save to the current media folder which is usually /wp-content/uploads/YEAR/MONTH

          Hope that helps you!

          Wil.

  2. Mario Gomez Luelmo

    Thanks for the info! This is very helpful but I have a question: my site has 3 different forms. Is it possible to change where the files are uploaded by each form? Each form has its own FormID. Thanks for everything!

    1. Wil

      Hi Mario

      The code above sets the upload path for all forms.

      In order to change this on a per-form basis, you would need to wrap the code in another hook during the form processing.

      /**
      * Change default location of Elementor’s form file uploads
      *
      * @param $path
      * @return string
      */
      function zpd_change_elementor_form_upload_path( $path, $folder ){

      //Set default folder name if empty
      if( empty( $folder ) ) $folder = ‘elementor-file-uploads’;

      // Get the WordPress uploads folder
      $wp_upload_dir = wp_upload_dir();

      // This is the new path where we want to store the Form file uploads
      $path = $wp_upload_dir[‘basedir’] . ‘/’ . $folder;

      /**
      * Check to see if the folder already exists, create if not.
      */
      if ( !file_exists( $path ) ) {
      mkdir( $path, 0755, true);
      }

      return $path;
      }
      add_filter( ‘elementor_pro/forms/upload_path’, ‘zpd_change_elementor_form_upload_path’, 10, 2 );

      function zpd_change_elementor_form_upload_path_per_form( $record, $ajax_handler ){
      $form_id = $record->get_field( ‘form_id );
      switch( $form_id ){
      case ‘blahblah1’:
      appy_filter( ‘zpd_change_elementor_form_upload_path’, null, ‘elementor-form-uploads-‘ . $form_id );
      break;
      }
      }
      add_action( ‘elementor_pro/forms/process’, ‘zpd_change_elementor_form_upload_path_per_form’ );

  3. Tal Yehoshua

    Hi Wil,
    Thanks for this interesting information,
    I am looking for a way that will cause the files that the user uploads, not to be saved on the server and not to go through it at all (for not to overload the server), but in an external way like Google Drive or that the files will be sent directly to email.

    Is there such a way?
    Thanks,
    Tal

Comments are closed.