Image does not show on label
Fix blank or missing label images by checking image data, browser and network access, and CORS permissions on the image source.
On this page
If an image is blank or missing in your label preview or printout, check the element’s image source, then whether your browser can load it.
Common causes
1. The wrong image source is selected
Select the image on the canvas and check Link To. Both editors use the following labels:
| Image source | Link To label |
|---|---|
| Main product image | PRODUCT_IMAGE |
| Variant image | PRODUCT_VARIANT_IMAGE |
| Uploaded custom image | IMAGE |
| Product metafield | METAFIELD_PRODUCT |
| Variant metafield | METAFIELD_VARIANT |
2. Product has no image in your store
The image element stays blank if the product or variant has no image. Upload one in your store admin.
3. Using “Variant Image” but variant has no image
Variant images are optional. If only the main product has an image, use Product Image instead of Variant Image.
4. Using a metafield image
If you linked to a Product Metafield or Variant Metafield, follow the image URL workflow in Link To:
- New editor: choose the definition from Available metafields… under Metafield → Enter namespace.key.
- Legacy editor: type the full
namespace.keyin Metafield → Enter namespace and key. There is no definition dropdown. - Check that the metafield has a value on the product or variant you are printing.
- Make sure the value is a direct image URL, rather than a file reference or a page containing the image.
- Open the URL in a new tab to check that the image is available and the link has not expired. The image may still have a CORS error even if it opens here; see below.
5. Custom Image not uploaded
For a static logo, set Link To → IMAGE and use Click to upload in either editor. Confirm the upload completed and the image appears before generating labels.
Check your browser and network
- Update your browser, reopen BarcodeMan, and try the same product and template again.
- Check your connection and open the image URL in a new tab. If it does not load, the image may be unavailable or blocked before BarcodeMan can use it.
- If possible, try the same image in another up-to-date browser or on another trusted network. A different result helps identify a browser or network restriction.
- Check whether a browser extension, antivirus web protection, or firewall blocked a request to the image host. Ask your IT administrator or security software provider to review the blocked request and allow it if appropriate.
Keep browser security and general network protection enabled. Use a specific site exception when a filter is confirmed to be the cause.
Getting a CORS error when loading an image
CORS (Cross-Origin Resource Sharing) controls whether a website can read an image hosted on another site. An image can open in a browser tab and still be blocked when BarcodeMan tries to use it on a label. The image source must permit that cross-origin access.
If the browser reports a CORS error:
- Note the image host and requesting origin shown in the error. The origin is the app address making the request, including its protocol and any port. It may differ from the store admin address in your address bar.
- Contact the image hosting provider or administrator. Ask them to update the source’s CORS settings to allow image requests from the app origin shown in the error.
- After they update the source, reload BarcodeMan and retry the image.
Recreating the image element will not change permissions on the image source. If you need help identifying the origin, contact us with the error details. Your provider can also refer to MDN’s explanation of CORS.
Still not working?
If the image source loads correctly and no access error is reported, try a new image element linked to the same data.
If the image is still blank, email hi@gookit.co with:
- Your template name and the affected product or variant
- The selected Link To field
- Your browser and version
- Whether the image is missing from the preview, PDF, or both
- The image host and a screenshot of any error
Remove private information and access tokens from the screenshot before sending it.
Questions about this article? Email our team.
Send feedback