In this guide, we will look at the steps for integrating ImageKit for images stored on any HTTP or HTTPS accessible web server. If you are looking to integrate ImageKit on a specific platform or with AWS S3 storage, we have specific guides for the following platforms and storages.

  1. AWS S3 Integration Guide
  2. Magento Integration Guide
  3. Shopify Integration Guide
  4. Wordpress Integration Guide

Steps for integrating ImageKit with any web server

1. When you register for ImageKit, you are asked to select an ImageKit ID for yourself. The ImageKit ID is the unique identifier in your URLs for your images. Normally, your URLs would begin like this{imagekitId}/

2. Log in to your ImageKit dashboard and go to the Integration section.

3. Add a new image origin by clicking on the "Add Origin" button.

4. To integrate ImageKit with the images on your server, you need to add your server as an origin for ImageKit. For this purpose, we need to set the origin type as "Web Server - HTTP(S) server and Magento, Shopify, Wordpress etc."

5. The value of base URL should be your web server's address with the protocol (http or https) in the beginning. It could be a domain name or an IP address with the protocol. If the image URLs begin with then the base URL in the origin should also be the same.

6. Click on Submit.

7. In the “Image URL Patterns” section, you will find this new added origin in “Image Origin preference” list. In the screenshot below, the origin "My HTTP Server" now appears in the origin preference list.

8. You can either continue to use the “Default URL pattern” or create a new URL pattern if you want to manage multiple image origins with ImageKit.

9. Now, let's quickly verify if the images from your web server are accessible via ImageKit.

For example, if the image URL on your web server is:

and you added as the base URL while adding the origin, then for this the URL via ImageKit will be{imagekitId}/photo/image.jpg

Here, we have replaced the value of the base URL, with<{imagekitId}>.

You will need to replace {imagekitid} with your own ImageKit ID.

If the above change does not work for your images, then you can get in touch with our team to help you with the integration by creating a support ticket from your ImageKit dashboard. 


After performing the above steps, ImageKit does not start downloading objects from the web server to optimize images. Whenever you request an image on you webserver, using an ImageKit URL and when the image is not available in ImageKit’s storage, only then will it get the image from your web server. Image optimization and transformation is done in real time. 

Example URL Construction for Web Server Images

Original Image URL

Base URL

With default URL pattern{imagekitId}/path/to/my/image.jpg

With custom URL pattern{imagekitId}/{pattern}/path/to/my/image.jpg

With a custom domain name (default pattern or mapped to a particular pattern)

We are always there to help you in case of any doubt. You can create a support ticket from your ImageKit dashboard and our team will help you with the integration.

What next?

Now that you have successfully configured ImageKit to fetch images from your server, it's time to start delivering resized and optimized images.

Did this answer your question?