Upload image to Cloudinary from within Glide

Showcase
#14

Yes, exactly, how do you get the upload button? I guess the button on the webpage is just an iframe or something like that, but where do you get the button from? Sorry, just signed up to Cloudinary yesterday :slight_smile: Mange tak!

#15

@Alexdz

It is a very simple webpage

<html>

<button id="upload_widget" class="cloudinary-button">Select file to upload</button>

<script src="https://widget.cloudinary.com/v2.0/global/all.js" type="text/javascript"></script>  

<script type="text/javascript">  

function GetURLParameter(sParam)
{
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');
    for (var i = 0; i < sURLVariables.length; i++) 
    {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam) 
        {
            return sParameterName[1];
        }
    }
}

var imageid = GetURLParameter('imageid');

//var myFileName = "myName";
var myUploadWidget = cloudinary.createUploadWidget({

    prepareUploadParams: function(cb, params)
    {
        cb({public_id: imageid})
    },

    cloudName: "-------your-cloudname-----",
    uploadPreset: "----your-upload-preset",
//    public_id: myFileName
  },
  (error, result) => {
     if (!error && result && result.event === "success") { 
      console.log('Done! Here is the image info: ', result.info); 
    }
  });

document.getElementById("upload_widget").addEventListener("click", 
    function(){
        myUploadWidget.open();
    }, false);
    
</script>

</html>
1 Like
#16

@Alexdz

If you succeed doing a signed upload - then please share it with us :slight_smile:

As I stated in the initial post - possible improvements:

#17

thank you very much! i will give it a try!

#18

The Cloudinaray preset - mode “unsigned”

image
image734×1192 99.3 KB

#19
#20

Thank you. Those were helpful, but not exactly what I am looking for. I can get the URL from cloudinary manually and add it to the sheet manually, but I am looking for how to do this automatically. What I can’t figure out is how to change the ID on the upload so that I can pull that. I followed the link that was posted above

https://support.cloudinary.com/hc/en-us/articles/360011205719-Upload-Widget-Can-I-update-the-file-name-after-choosing-the-file-to-upload-

and am able to change the code, but it only changes it for the first image. Then when I go to upload another image, it pulls the image that already has that name into it.

#21

@Ed_Pietrzak

am able to change the code, but it only changes it for the first image. Then when I go to upload another image, it pulls the image that already has that name into it.

I guess the problem is that you are using an unsigned preset i cloudinary. Using unsigned preset means that images will not be overwritten.

But if you want the best help I think you should describe step by step what you want to achieve. Not how to do it - but what you actually want to achieve.

Do you want to upload to cloudinary independently of glide - or should glide be involved in the upload process. How do you want the images to be used in cloudinary - is it a simple list a image - or should individual images be mapped to something special etc.

#22

Thank you for the response. I am not looking to do anything to complicated, I am really just trying to use Cloudinary instead of Glide’s images. I am worried I will run out of space with the free plan. This is going to be for a fish tracking app for our annual fishing trip and we plan on catching a lot of fish!

So ultimately what I am looking for is a user submitted form. In that form, they upload an image, then have that image displayed in the details of the catch, which is what was entered in the form.

Any help is very much appreciated.
Ed

#23

@Ed_Pietrzak The Upload to Cloudinary app lets you create a company (~a fish catch) and upload a number of images related to the company.

You might want to have a form where you inside the form upload an image. But that isn’t possible as the fish catch hasn’t got an id yet until the form is submittet. And you want to link the catch and the image.

Take a look on the app again if you feel. And again, try to describe in more detail step by step what you want to achieve. Not how to do it - but what you actually want to achieve.

#24

Got it. Thank you for the explanation, that makes more sense now. I will rethink my form.

Ed

#25

This is soo cool.

1 Like
#26

did you use the web view component with this

#27

@Glider yes I did. As described the in my first post

#28

i have a question how did you get the link you used with the webview component

#29

I created the link myself in the glide editor based on the company Id and a rollup column

#30

in the link there is a part labekked website
in your app you replaced it with something else
are we meant to change it based on our cloudinary account

#31

You have to create your own webpage and place on your own website

1 Like
#32

so we add the script to the head of our website

#33

what of subdomains