[Resolved] Custom form field “attach image” on the checkout page

[Kshanit]

Hello,
I want to add a custom form field “Attach image” on the checkout page at the top or bottom of the page which will be sent to the vendor with the order details.

[Attach Image] button to open Finder on desktop and file manager or camera on mobile.

[Ying]

Hi there,

Do you have GenerateBlocks plugin installed? If so, you can use a buttonsblock with dynamic data enabled to achieve this.
https://www.screencast.com/t/XCJ0DoBdU

You can use a block element - hook to insert the button to the check out page.
https://docs.generatepress.com/article/block-element-hook/

Here’s the hook guide for Woocommerce checkout page:
https://www.businessbloomer.com/woocommerce-visual-hook-guide-checkout-page/

[Kshanit]

Yes, I am a fan of GenerateBlocks. This looks logical. I will try this solution tomorrow and let you know.

Thank you 😊

[Ying]

Keep us updated 🙂

[Kshanit]

Hello, I am trying the above but I guess I am making some mistake that this is not working, please help me get it.

Hook element screenshot: https://snipboard.io/rKlLER.jpg

Checkout page: https://snipboard.io/RaZXsS.jpg

Additionally, I am a little confused about how dynamic data settings work.

Dynamic data settings: https://snipboard.io/hozUKV.jpg

Thank you,
Kshanit Shankardas

[David]

Hi there,

what is the function of the dynamic data you require ?

[Kshanit]

I want [Button] to upload the image from the finder or file manager or camera and save it/send it with the customer details.

[David]

Ok, so thats not something the theme or our dynamic data can do.
The Dynamic Data in GP is for displaying data, its not for uploading it.

You would need a dedicated Woocommerce plugin to do that. Do a google search for Customer Upload Files for WooCommerce

[Kshanit]

Okay, Got it.

I will follow your instruction 🙂

Thank you

[David]

You’re welcome

[Kshanit]

I followed your instructions and got a plugin.

Thank you

[David]

Glad to hear that

[Author]

Posts