{"id":23662,"date":"2022-04-27T07:30:00","date_gmt":"2022-04-27T14:30:00","guid":{"rendered":"https:\/\/cloudinary.com\/blog\/?p=23662"},"modified":"2024-06-06T12:55:11","modified_gmt":"2024-06-06T19:55:11","slug":"product-customization-with-cloudinary","status":"publish","type":"post","link":"https:\/\/cloudinary.com\/blog\/product-customization-with-cloudinary","title":{"rendered":"Product Customization With Cloudinary"},"content":{"rendered":"\n

In today\u2019s highly visual world, a key task of building websites is the addition of media, such as images and videos. You can do that in several effective ways, one of which is with Cloudinary\u2019s capabilities for product customization<\/a>.\u00a0<\/p>\n\n\n\n

By way of background, Cloudinary<\/a> is a software-as-a-service (SaaS) platform through which you can efficiently and easily deliver media\u2014images, text, audio, video\u2014across devices and browsers. Additionally, by using Cloudinary\u2019s API, you can customize, manage, and organize content\u2014a task made flexible by the API\u2019s many options. Also, a big help to developers are server- and client-side Cloudinary SDKs<\/a> for Ruby on Rails, Python, Go, Node.js, JQuery, Vue.js, Android, Kotlin, and such.

This tutorial steps you through the procedure for integrating several product-customization<\/a> features from Cloudinary into an e-commerce store<\/a>.<\/p>\n\n\n\n

Installation and Setup<\/h2>\n\n\n\n
    \n
  1. Sign up<\/a> for free at Cloudinary.

    Afterwards, take a few moments to familiarize yourself with Cloudinary\u2019s intuitive dashboard. Copy and save the cloud_name<\/code>, api_key<\/code>, and api_secret<\/code> variables for use in a later step.<\/li>\n\n\n\n
  2. Install and configure an SDK, say, the one for Python:\n
      \n
    1. Type this terminal command
      pip install cloudinary<\/code><\/li>\n\n\n\n
    2. Set the global configurations:<\/li>\n<\/ol>\n<\/li>\n<\/ol>\n\n\n
      cloudinary.config( \n  cloud_name = \"sample\"<\/span>, \n  api_key = \"874837483274837\"<\/span>, \n  api_secret = \"a676b67565c6767a6767d6767f676fe1\"<\/span>,\n  secure = true<\/span>\n)<\/code><\/span>Code language:<\/span> JavaScript<\/span> (<\/span>javascript<\/span>)<\/span><\/small><\/pre>\n\n\n
      Asset Upload<\/h2>\n\n\n\n
      Next, upload an image to the cloud. Say, you want to customize a T-shirt. You can do that with your own image of the T-shirt or with this one from Cloudinary’s sample app for product customization<\/a>. Do the following:<\/p>\n\n\n\n
       1. Name the picture of the T-shirt shirt.png<\/code>, upload it to Cloudinary, and save it in your home directory with the code below.<\/p>\n\n\n
      cloudinary.uploader.upload(\"\/home\/shirt.png\"<\/span>, \n  folder = \"myfolder\/mysubfolder\/\"<\/span>, \n  public_id = \"my_name\"<\/span>,\n  tags = [\"shirt\"<\/span>]) <\/code><\/span>Code language:<\/span> JavaScript<\/span> (<\/span>javascript<\/span>)<\/span><\/small><\/pre>\n\n\n
      Your asset shirt.png<\/code> is now automatically available. Note the two parameters:<\/p>\n\n\n\n