Hi,

Thank you for the update.

There are thumbnails in the Preview Image Size selection that crop the source image based on the specified dimensions, but they retain the original aspect ratio. For example, if the specified thumbnail size is 400x200px, which has an aspect ratio of 2:1, and an image with a 16:9 aspect ratio is uploaded, the image will be resized to a maximum width of 400px but it will retain its original aspect ratio. This means the height will be adjusted proportionally. This is why it’s recommended to upload images with a similar size and aspect ratio.

Best regards,
Ismael

Hey Maxime,

Thank you for the inquiry.

“Did you install any image lazy-loading plugin? Please try to deactivate it temporarily. You can also disable the Single Post Navigation in the Enfold > Blog Layout > Single Post Options panel. The navigation seems to contribute to the CLS issue.

Best regards,
Ismael

Hey edithfrei,
When I check your footer I’m not seeing any issues:

Please include a screenshot of what you see and paste the image URL in your post.

Best regards,
Mike

Hi,
When I check your two sites I don’t see a difference:

Best regards,
Mike

Hey schweg33,
I’m not sure that I see extra white space on mobile:

Please include a screenshot of what you see and paste the image URL in your post.

Best regards,
Mike

Hi,
To add a screenshot please try using an Screenshot service and pasting the image URL in your post.

Best regards,
Mike

Hi,
When I check you have a 1px padding in between the images, you could use this css to remove it:

#top .avia-logo-element-container .slide-entry {
    padding: 0px;
}

change the zero if you want it larger.

Try this css to remove the top and bottom padding:

.flex_column.av-l3t08rf8-8f5e455205a44c3e3d9068782c55a0f9 {
    padding: 0px 50px 0px 50px;
}

Best regards,
Mike

Hi,
Thank you for your patience, the test page that you created didin’t look the same so I created a new on linked below, to create a table use this code in the “text” tab of the text element:

<table>
<tbody>
<tr>
<td>image</td>
<td>text and button</td>
</tr>
</tbody>
</table>

then add your image and text and button

To create the button code, cue the shortcode wand in a new post with the Classic Editor

Then it will look like this:

Then you can use css to remove the borders and change the background color if you wish.

Best regards,
Mike

Hey Richard,

Thank you for the inquiry.

To avoid distorting the images, you can use the following css code instead:

.slide-image {
  min-height: 223px;
}

.slide-image img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-height: 223px;
}

Aside from using the css above, other solutions include uploading images with the same height and aspect ratio, or selecting a specific thumbnail in the Styling > Appearance > Preview Image Size settings if you’re using the Blog Posts element.

Best regards,
Ismael

Hey navindesigns,

Thank you for the inquiry.

The error is due to the slider element below the headline:

<a href="https://bowl360astoria.nyc/" data-rel="slide-1" class="slide-image" title=""><span class="av-partner-fake-img" style="padding-bottom:76.666666666667%; background-image:url(https://xxxxxx.nyc/wp-content/uploads/2023/05/02-2.png);"></span></a>

To fix it, make sure to apply Link Title > Link Title to each slide, then add this script in the functions.php file.

function ava_custom_script_add_hidden_text()
{
    ?>
    <script type="text/javascript">
        (function ($)
        {
            $(document).ready(function () 
            {
                $('.slide-image').each(function () 
                {
                    var $this = $(this);
                    var titleText = $this.attr('title');
                    if (titleText) 
                    {
                        var hiddenSpan = $('<span>', {
                            'class': 'visually-hidden',
                            'text': titleText
                        });
                        $this.append(hiddenSpan);
                    }
                });
            });
        })(jQuery);
    </script>
    <?php
}

add_action('wp_footer', 'ava_custom_script_add_hidden_text', 9999);

This will create a hidden span element inside the slide-image container.

<a href="https://bowl360astoria.nyc/" data-rel="slide-1" class="slide-image" title="Visit Bowl 360 Astoria">
  <span class="av-partner-fake-img" 
        style="padding-bottom:76.666666666667%; 
               background-image:url(https://xxxxx.nyc/wp-content/uploads/2023/05/02-2.png);" 
        aria-hidden="true"></span>
  <span class="visually-hidden">Visit Bowl 360 Astoria</span>
</a>

Best regards,
Ismael

Hi,

Thanks for the update. I see that the styling is different between your two sites, I’m not sure where the X text is located though?

1. File compression, not image compression. It might not be present in your production site since the theme version is very old.
2. If you have caching plugins or other cache applied to the site, then please clear that. Try clearing you local browser cache as well.
3. You could check the element options, to see if padding has been applied to it.

If you should need further help, then please include admin WordPress login details in private. Screenshots highlighting the problems that you are having would be helpful too.

Best regards,
Rikard

Hi,

That is not possible, unfortunately. You can try this modification but we can’t guarantee that it will work:

add_action('template_redirect', function() {
    if (is_single(123)) {
        remove_filter('the_content', 'featureimage_for_feeds');
    }
});

Make sure the is_single argument (123) is set to the actual ID or slug of the post.

Best regards,
Ismael

Hi,

Thank you for the update.

Looks like you have selected a smaller version (300x199px) of the image. Please re-select the background image and make sure that the full size version is selected. (see private field)

Best regards,
Ismael

Hey Augeundso,

I’m not sure I fully understand your intentions, could post a screenshot highlighting them please? If it’s possible, then you could change the original image to better fit your needs, then upload and use that instead.

Best regards,
Rikard

Hey H.O. GmbH,

Thank you for the inquiry.

1.) Unfortunately, it’s not possible to display the slider video on mobile devices using the Fullscreen Slider, which is why a fallback image option is added. If you really need this, you can try using the Layer Slider element.

2.) We can’t reproduce the issue on our end. Would you mind providing a screenshot?

Best regards,
Ismael

Hey Matthias,
On your /kompetenzen/ page images like this:

are background images that are shown with css and don’t have a “title” attribute so there is not a way to do this.
Perhaps try a plugin like this one: Image Source Control Lite – Show Image Credits and Captions

Best regards,
Mike