Add images using the image widget

Add images using the Image widget to help encourage day-to-day engagement with your dashboard and to enrich your display.Image widget Dashboard

Using our Image widget as part of your free Geckoboard account? Unlock all our data sources when you try Pro for free.

To display an image, you need to specify its URL within the widget configuration. You can use a service such as Dropbox to host your image file, or another service.

If your image is already hosted online, learn how to copy the image URL in this guide.

Other important considerations:

  • Accepted image formats include: JPG, PNG, SVG and GIF.
  • Images displayed via the image widget are full bleed, which means the image has no padding and runs edge to edge.
  • The image widget doesn't have a background color which means transparent images such as logos can be placed directly on the dashboard background.

Below are examples of how various images appear: a logo with a transparent background, full width image with a title, and a full width image with no title.Image_widget_examples

Image sizes

Use this guide to create the optimal image size for your image widget.Image_widget_grid

  • 1×1 – image width 230px, height 230px
  • 1×2 – image width 230px, height 470px
  • 1×3 – image width 230px, height 710px
  • 2×1 – image width 470px, height 230px
  • 2×2 – image width 470px, height 470px
  • 2×3 – image width 470px, height 710px
  • 3×1 – image width 710px, height 230px
  • 3×2 – image width 710px, height 470px
  • 3×3 – image width 710px, height 710px
  • 4×1 – image width 950px, height 230px
  • 4×2 – image width 950px, height 470px
  • 4×3 – image width 950px, height 710px


If you've clicked the Try new layout button to convert your dashboard to the new layout the guide above isn't applicable.

Hosting images in Dropbox

Follow the steps below to create a sharing URL for your image.

  1. To begin, upload your image to Dropbox.
  2. Locate the file and click Share.
  3. Next, click Create a link.
  4. Select Copy link.
  5. Return to your dashboard and select Add widget.
  6. Search for Image and select it.
  7. Add the newly created URL to the URL field.
  8. Click Save.

Important note

A known issue with WebKit may prevent your images from loading as expected if you use Safari, or other unofficial browsers to view Geckoboard. To resolve this, you can modify the URL for your Dropbox file.

The original URL will appear as:

Reformat the www to dl and the end parameter dl=0 to dl=1.

The new URL should appear like so:

Hosting images in Google Drive

Hosting images in Google Drive is a great option, but we'll need to modify the sharing URL that Google provides and turn it into a download URL.

Follow the steps below to create a properly formatted URL. We recommend you have a text editor open during this process.

  1. First, upload the image to Google Drive.
  2. Then right-click on the file that was uploaded, and click Share.
  3. Next to "Anyone..." click the down arrow and select Anyone on the internet can find and view.
  4. Then click Copy link.
  5. Paste this link into your text editor for later.

Next, we'll modify the URL you just copied. Here is the an example of the sharing URL you just copied:

And here is the format for the download URL we will create:

  1. In your text editor, copy and paste the characters from the IMAGE-ID section of your sharing URL.
  2. Copy the following download URL example and paste it into your text editor:
  3. Then, paste the IMAGE-ID from your original sharing URL onto the end of the download URL. You now have a functioning download URL!
  4. Return to your dashboard and select Add widget.
  5. Search for Image and select it.
  6. Add the newly created URL to the URL field.
  7. Click Save.

Additional resources

Was this article helpful?

Awesome! 👍 Thanks so much for your feedback!

Sorry about that! Start a conversation now.

Ready to create your own dashboard?

Get started for free

Still have questions? Get in touch.