[Resolved] Confusing options while uploading the images through media library in forms

[Author]

Posts

[pramodk-2]

Hi Team,

It is been few months I am using Toolset and very happy with the way it is going.

However, my customers are facing problems while uploading the images.

In my form, I am using "WordPress Media Library manager" to upload the images but are facing below issues.

It is confusing,
1. For the customers to see options like "Alt Text, Title, Description and File URL" while uploading the images. Is there no option to hide this?
2. To show the option called search while uploading the images. Is there no option to hide this?
3. To show the option called "Images for this field" and "Multiple Images for this field", when we can provide the best option to the customer which is "Multiple Images for this field". Can we hide one of these?

4. Loading time to upload the images through WordPress media library is more, it is taking nearly a minute to upload the image which is nearly 2MB?

I have choosen option to upload the images through media library since there is preview for the images.

Please suggest me.

Thanks,
Pramod.

[Minesh]

Hello. Thank you for contacting the Toolset support.

There is no native options available to hide those fields or links you mentioned with media uploader but the workaround would be to add the custom CSS to your form's CSS box:

// To hide alt, caption, description etc..etc 
body.page-id-999  .attachment-details > * {
  display: none !important;
}
body.page-id-999  .attachment-details > *:nth-child(-n + 2) {
  display: block !important;
}

//To hide search box
body.page-id-999 .media-toolbar-primary { 
display:none; 
}

Where you should target it by specific page ID where you added your form. The same way you can target the unwanted link you and add the related CSS code.

[pramodk-2]

Hi Minesh,

Thanks for your quick response.

I have my requirement very clear now.

Please provide me the CSS for the below options to hide.

1. Filter Media.
2. Search
3. Alt Text, Title, Description and File URL

Kindly refer to the attached image for more details.

I am not very good in doing CSS, let me know whether I can provide the access details to you to do the same.

Also, is there anyway to improve the load time while uploading the image through media uploader.

Thanks,
Pramod.

[Minesh]

You should try to add the following CSS code to your form's CSS editor:

body.page-id-999 .attachment-details > * {
  display: none !important;
}

body.page-id-999 .attachment-details > *:nth-child(-n + 2) {
  display: block !important;
}
body.page-id-999 .media-toolbar {display: none; }
body.page-id-999 .media-toolbar-primary { display:none; }

Where you should target it by specific page ID. Please replace 999 with your original page ID where you added the form.

[pramodk-2]

Hi Minesh,

Tried doing but seems to be not working.

Please let me know whether I can provide the access details to you to sort it.

Thanks,
Pramod.

[Minesh]

Yes - Please share access details and problem URL where you added the form.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.

[pramodk-2]

Hi Minesh,

I have tried it again and is working.

However, the button to submit the images is missing.

Please find attached the image for the same with the arrow symbol.

Thanks,
Pramod.

[Minesh]

Please try the following code, It should work now and you will be able to see the button.

body.page-id-999  .media-toolbar-primary  .media-search-input-label { display:none; }
body.page-id-999  .media-toolbar-primary  #media-search-input { display:none; }

body.page-id-999  .media-toolbar-secondary { display:none; }

body.page-id-999  .attachment-details > * {
  display: none !important;
}
 
body.page-id-999  .attachment-details > *:nth-child(-n + 2) {
  display: block !important;
}

Where you should target it by specific page ID. Please replace 999 with your original page ID where you added the form.

[pramodk-2]

Hi Minesh,

Thanks, It is working fine for list a room.

Please suggest me on how to find out the page ID for edit a room form as this uses content template.

Also, please suggest on how to improve the load time while uploading the images through WordPress media library.

Thanks,
Pramod

[Minesh]

Please suggest me on how to find out the page ID for edit a room form as this uses content template.
=>
Please check the page source and you will see the ID with the body tag.

Also, please suggest on how to improve the load time while uploading the images through WordPress media library.
==>
I do not have any thing to offer as this is a clone of core media library and I'm afraid I do not have any solution to offer.

[pramodk-2]

My issue is resolved now. Thank you!