#REACT can i change cloudinary image uploadar social media icons

112 views Asked by At

In React, I want to change the social media icons of the Cloudinary upload widget. Currently, it has one color icon but I want to use the same icon just like the real icon of (Facebook, google drive.. etc ) Check Image

1

There are 1 answers

0
Shirly Manor On BEST ANSWER

Currently, there is no option to set a different color to each icon. However, you can change the color of the icon by setting the inactiveTabIcon. For example:

<script src="https://widget.cloudinary.com/v2.0/global/all.js" type="text/javascript"></script>
<button id="upload_widget" class="cloudinary-button">Upload files</button>
<script type="text/javascript">

    var myWidget = cloudinary.createUploadWidget({
        cloudName: '<cloud name>',
        upload_preset: '<upload preset>',
        styles: {
        palette: {
            window: "#CC7E7E",
            windowBorder: "#90A0B3",
            tabIcon: "#2C609A",
            menuIcons: "#5A616A",
            textDark: "#000000",
            textLight: "#FFFFFF",
            link: "#2C609A",
            action: "#FF620C",
            inactiveTabIcon: "#BF6958",
            error: "#E83019",
            inProgress: "#0078FF",
            complete: "#299436",
            sourceBg: "#BCC1C5"
        }}
        }, (error, result) => { if (result.event == "success") {
            console.log(result.info) // result.info contains data from upload
        } })

        document.getElementById("upload_widget").addEventListener("click", function(){
            myWidget.open();
        }, false);

</script>