Hey guys.

I change LaKompra.com to Veronika Theme, so far very good, I modify some option in the look in mobile and desktop.

My question is how can I remove the multiple image options, for example, I allow 12 images, and the item post shows 12 boxes.

I just want to show one box or just the message that said "upload 12 images". Please check the attachment.



I can change the look, but is there a way to expand the .add_item fieldset or any related box to show the preview, all the preview are over the submit button.

Any idea will be great.

@Carlos
Do not have access to files now, but somewhere in item-post.php and item-edit.php is loop (while or foreach) to generate boxes until reached osclass max images allowed. It might be part of jquery.

Yep,

I see

// ADD CAMERA ICON TO PICTURE BOX
    $(document).ready(function(){
      setInterval(function(){
        $('input[name="qqfile"]').prop('accept', 'image/*');
        $("img[src$='uploads/temp/']").closest('.qq-upload-success').remove();
       
        if( !$('#photos > .qq-upload-list > li').length ) {
          $('#photos > .qq-upload-list').remove();
          $('#photos > h3').remove();
        }
      }, 250);
     
      $('#photos .qq-upload-button > div').remove();
      $('#photos .qq-upload-button').append('<div class="sample-box-wrap"></div>');

      [b][i]for(i = 0; i < <?php echo osc_max_images_per_item(); ?>; i++) { 
        $('#photos .qq-upload-button .sample-box-wrap').append('<div class="sample-box tr1"><div class="ins tr1"><i class="fa fa-camera tr1"></i></i></div></div>');
      }[/i][/b]

      $('#photos .qq-upload-button .sample-box-wrap').live('click', function(){
        $('#photos .qq-upload-button input').click();
      });
I think i need to modify this

for(i = 0; i < <?php echo osc_max_images_per_item(); ?>; i++) { 
        $('#photos .qq-upload-button .sample-box-wrap').append('<div class="sample-box tr1"><div class="ins tr1"><i class="fa fa-camera tr1"></i></i></div></div>');
      }
Because now shows the box per image limit

@Carlos
Yes, replace:
<?php echo osc_max_images_per_item(); ?>
with i.e. 1

Yep is working, but the preview is out of the box.

Maybe i need modify the css a litle

@Carlos
In style.css change position property for row #photos .qq-upload-list, from absolute to relative.

@Carlos
In style.css change position property for row #photos .qq-upload-list, from absolute to relative.

I forgot to reply, your answer was right I resolve the request, now I can show 12 boxes to upload images to desktop and just 1 box for mobile device less than 767 px screen size.

In the item-post.php header i put.

<style>
         @media only screen and (max-width: 767px) {
    #photos .qq-upload-list {position:relative;left:0;top:0;width:102%;margin-right:-2%;padding:150px 25px 15px 25px;}
}
    </style>

The JS code in item-post.php recognize the screen size and just run javascript when the screen size meet the request


  // ADD CAMERA ICON TO PICTURE BOX
    $(document).ready(function(){
      setInterval(function(){
        $('input[name="qqfile"]').prop('accept', 'image/*');
        $("img[src$='uploads/temp/']").closest('.qq-upload-success').remove();
       
        if( !$('#photos > .qq-upload-list > li').length ) {
          $('#photos > .qq-upload-list').remove();
          $('#photos > h3').remove();
        }
      }, 250);
     
      $('#photos .qq-upload-button > div').remove();
      $('#photos .qq-upload-button').append('<div class="sample-box-wrap"></div>');
if ($(window).width() <= 800) {
      for(i = 0; i < 0; i++) { 
        $('#photos .qq-upload-button .sample-box-wrap').append('<div class="sample-box tr1"><div class="ins tr1"><i class="fa fa-camera tr1"></i></i></div></div>');
      }
  } else {
       for(i = 0; i < <?php echo osc_max_images_per_item(); ?>; i++) { 
        $('#photos .qq-upload-button .sample-box-wrap').append('<div class="sample-box tr1"><div class="ins tr1"><i class="fa fa-camera tr1"></i></i></div></div>');
      }
  }

      $('#photos .qq-upload-button .sample-box-wrap').live('click', function(){
        $('#photos .qq-upload-button input').click();
      });


Thank you so much for your help