---
title: "Troubleshooting Guide for Blurry Images"
type: "wiki"
space: "Axero Documentation"
author: "Vladana Garic"
created: 2024-11-28T15:35:51Z
updated: 2026-09-07T00:39:26Z
url: "https://my.axerosolutions.com/spaces/5/axero-documentation/wiki/view/106387/troubleshooting-guide-for-blurry-images"
---

# Troubleshooting Guide for Blurry Images

A photo carousel shows blurry pictures when its template uses the wrong image URL. This page says which one to use.

### Understanding Image URL Variables in Page Builder Widgets

- `{{ContentImageURL}}`: This variable displays the featured image for various content types, such as articles, blogs, and wikis. For photo content types, it displays a thumbnail image.
- `{{ContentDetailImageURL}}`: This variable provides the path to the full-resolution version of a photo. This URL should be used when displaying images in a carousel template to ensure they appear sharp and clear.

### Common Issues: Blurry Photos in Carousel

If photos appear blurry in your carousel, it may be due to the use of `{{ContentImageURL}}` instead of `{{ContentDetailImageURL}}`. The `{{ContentImageURL}}` displays a smaller, lower-resolution image, which is unsuitable for larger carousel displays. To resolve this issue:

1. **Check the Template**: Review the carousel template to ensure it is designed to distinguish between photo content types and other types of content.
2. **Modify the Template**: If the carousel template does not differentiate between content types, modify it to:
    - Use `{{ContentDetailImageURL}}` for photo content types to display the full-resolution image.
    - Use `{{ContentImageURL}}` for other content types where a featured image or thumbnail is appropriate.

### Correcting Thumbnail Image Dimensions

If thumbnail images appear stretched or have the wrong aspect ratio, it's likely due to incorrect dimension settings.

For example, the below settings create portrait-oriented thumbnails that don't fit into landscape display boxes, causing distortion:

- - Thumbnail height \(px\): 225
    - Thumbnail width \(px\): 300

#### Steps to Resolve

1. **Update Thumbnail Settings:**

    - Navigate to the Photo Management Settings page: **https://your-site-url.com/admin/photos/manage-photo-settings**
    - Modify the thumbnail dimensions to:
        - Content width \(px\): 900
        - Thumbnail height \(px\): 500
        - Thumbnail width \(px\): 800
2. **Verify the Change**:

    - After updating the settings, upload new images to verify that the thumbnails render correctly.
3. **Check the Thumbnails**:

    - Review the images in albums and photo lists to confirm that the thumbnails display with the correct aspect ratio and fit within the viewport as intended.

Refer to [Featured Image Best Practices](https://my.axerosolutions.com/spaces/5/axero-documentation/wiki/view/79243/featured-image-best-practices "Featured Image Best Practices") to learn more about image settings.

#### Related pages

- [Content List Widget](https://my.axerosolutions.com/spaces/5/axero-documentation/wiki/view/22587/content-list-widget "Content List Widget") \(the widget whose template chooses the image variable\)
- [Page Builder Widget Templates](https://my.axerosolutions.com/spaces/5/axero-documentation/wiki/view/22684/page-builder-widget-templates "Page Builder Widget Templates") \(to edit the template itself\)
- [Carousel Photo Template](https://my.axerosolutions.com/spaces/5/axero-documentation/wiki/view/22687/carousel-photo-template "Carousel Photo Template") \(the template most affected by blurry photos\)