Jump to content
  • Checkout
  • Login
  • Get in touch


The e-commerce.

Multiple Large Images upload from Adminpanel at once


Recommended Posts

Hi @ll !


Yesterday I decided to hack the OSC build-in upload routine, cause its a mess if you have to upload about 8-10 images with it.

You have to click four times to select only one image. Since HTML5 there is an "multiple" attribute in the <input> markup which

takes my interest. 

Ive done to place an Multi-Upload-Button between the main-(small-) image-Button and the Add-Large-Images-Button. It only appears 

if there are no large images uploaded for this product. If you use it, you cant add a description for the image while upload. You have to

edit the product after saving it again to add the description. The images are sorted by filename after the upload, which causes me to

add numbers to the Large-Images-Upload-Popups.

If you still want to use it, here is the code:


catalog / admin / categories.php


find the Large-Images-Upload-Routine and add the following code so it looks like this:

// Insert new large product images
            $sql_data_array = array('products_id' => (int)$products_id);

            $t = new upload($key);
            if ($t->parse() && $t->save()) {

              $sql_data_array['image'] = tep_db_prepare_input($t->filename);
              $sql_data_array['sort_order'] = $pi_sort_order;

              tep_db_perform(TABLE_PRODUCTS_IMAGES, $sql_data_array);

              $piArray[] = tep_db_insert_id();
          } elseif ($key == 'products_multiple_images_new') {
// Insert multiple large product images

    $sql_data_array = array('products_id' => (int)$products_id);

    if(isset($_FILES['products_multiple_images_new']['tmp_name'])) {
        // Number of uploaded files
        $num_files = count($_FILES['products_multiple_images_new']['tmp_name']);
        /** loop through the array of files ***/
        for($i=0; $i < $num_files;$i++) {
            // check if there is a file in the array
            if(!is_uploaded_file($_FILES['products_multiple_images_new']['tmp_name'][$i])) {
					          $messageStack->add_session(WARNING_NO_FILE_UPLOADED, 'warning');
            } else {
                // copy the file to the specified dir 
				        if (move_uploaded_file($_FILES['products_multiple_images_new']['tmp_name'][$i], DIR_FS_CATALOG_IMAGES . '/' . $_FILES['products_multiple_images_new']['name'][$i])) {

              $sql_data_array['image'] = $_FILES['products_multiple_images_new']['name'][$i];
              $sql_data_array['sort_order'] = $i;
              tep_db_perform(TABLE_PRODUCTS_IMAGES, $sql_data_array);
              $piArray[] = tep_db_insert_id();

                    /*** give praise and thanks to the php gods ***/
          					$messageStack->add_session($_FILES['products_multiple_images_new']['name'][$i].' '.SUCCESS_FILE_SAVED_SUCCESSFULLY, 'success');
                } else {
                    /*** an error message ***/
					          $messageStack->add_session($_FILES['products_multiple_images_new']['name'][$i].' '.WARNING_NO_FILE_UPLOADED, 'warning');

        $product_images_query = tep_db_query("select image from " . TABLE_PRODUCTS_IMAGES . " where products_id = '" . (int)$products_id . "' and id not in (" . implode(',', $piArray) . ")");

The codechanges starts with the elseif statment above the "Insert multiple large product images" remark and stops above the $product_images_query.


Now we have to place the Upload-Button in the form. Find the Edit-/Add-Product form and add the Buttoncode so it looks like this:

            <td class="main" style="padding-left: 30px;">
              <div><?php echo '<strong>' . TEXT_PRODUCTS_MAIN_IMAGE . ' <small>(' . SMALL_IMAGE_WIDTH . ' x ' . SMALL_IMAGE_HEIGHT . 'px)</small></strong><br />' . (tep_not_null($pInfo->products_image) ? '<a href="' . HTTP_CATALOG_SERVER . DIR_WS_CATALOG_IMAGES . $pInfo->products_image . '" target="_blank">' . $pInfo->products_image . '</a> | ' : '') . tep_draw_file_field('products_image'); ?></div>
		if (empty($pInfo->products_larger_images)){
						<br /><input type="file" name="products_multiple_images_new[]" multiple/><br /><br />
              <ul id="piList">

Thats it. I had to add a new upload routine, cause the osc upload-class cant handle multiple files. The upload-array looks a little bit different. Maybe here is one php-crack who can add the multi-file-routine in the stock upload class.


Oh, if you like to have numbers at your Large-Images-Popup just edit the echo statement just below your new Button so it looks like this:

    foreach ($pInfo->products_larger_images as $pi) {

      echo '                <li id="piId' . $pi_counter . '" class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s" style="float: right;"></span><a href="#" onclick="showPiDelConfirm(' . $pi_counter . ');return false;" class="ui-icon ui-icon-trash" style="float: right;"></a><strong>' . $pi_counter . '. ' . TEXT_PRODUCTS_LARGE_IMAGE . '</strong><br />' . tep_draw_file_field('products_image_large_' . $pi['id']) . '<br /><a href="' . HTTP_CATALOG_SERVER . DIR_WS_CATALOG_IMAGES . $pi['image'] . '" target="_blank">' . $pi['image'] . '</a><br /><br />' . TEXT_PRODUCTS_LARGE_IMAGE_HTML_CONTENT . '<br />' . tep_draw_textarea_field('products_image_htmlcontent_' . $pi['id'], 'soft', '70', '3', $pi['htmlcontent']) . '</li>';

Dear Mod: If this is a real security risk, or harms anybody, so please delete it quickly o:)

Good luck !


Link to comment
Share on other sites

  • 1 year later...

Hola Denzel,



i built a new osc 2.3.4bs shop and installed "Select Product Image Directory" that you can find here ; http://addons.oscommerce.com/info/8150

Very easy to integrate, just 2 files to edit /admin/categories & /admin/languages/english/categories.

With this addon you select or create directories in the image folder when creating a new product.


Later I reed your post & decide to try it. It works, only it dont follow the selected directory.

It keep uploading the pics to /images/

While the standard button uploads the pics to the folder i selected.


I'm newbie, have just enough knowlegde to setup & integrate code in code, not to develop new codes.


Could you help me with this?



kind regards


Link to comment
Share on other sites

  • 9 months later...

Hola @@SpicyGirl,


if you are still reading... Sorry it takes a while... But I figured out the problem and have added the new-image-directory-string in the snipplet:

                // copy the file to the specified dir 
				        if (move_uploaded_file($_FILES['products_multiple_images_new']['tmp_name'][$i], DIR_FS_CATALOG_IMAGES . '/' . $dir . $_FILES['products_multiple_images_new']['name'][$i])) {

              $sql_data_array['image'] = $dir . $_FILES['products_multiple_images_new']['name'][$i];

Thats what the subdir adds to the multi-images-upload :thumbsup: 




Link to comment
Share on other sites

  • 3 weeks later...


This topic is now archived and is closed to further replies.

  • Create New...