Why is image being cropped? (Hugo-Academic hero widget)

Using Themes
1

I’ve set a background image in the hero widget using the Hugo-Academic theme. The image is being cropped both horizontally and vertically when it is rendered on the page, though I want it to display full-width. How can I display it full width?

Here’s everything I think might be relevant from hero.md.

+++
widget = "hero"  # See https://sourcethemes.com/academic/docs/page-builder/
headless = false  # This file represents a page section.
active = true  # Activate this widget? true/false
weight = 10  # Order that this section will appear.
title = "Credible Corvid"

[design.background]

  image = "headers/shaddow_portrait_80.jpg"

[design.spacing]
  # Customize the section spacing. Order is top, right, bottom, left.
  padding = ["25px", "0", "200px", "0"]

Changing the design spacing doesn’t have any effect, but I left that code in, in case it’s still relevant somehow.

The live page is at https://www.crediblecorvid.com

The image file is at https://www.crediblecorvid.com/img/headers/shaddow_portrait_80.jpg

2

Have you still got this problem? When I view your site in Safari, the hero image (black and white mountain scene) is being displayed full width, and only cropped vertically.

3

@funkydan2 That’s frustrating that you can’t reproduce the problem. I’m also viewing the site with Safari (version 12.1.2). Here’s a screenshot of what I’m seeing:

The site:

CredibleCorvid_screenshot
CredibleCorvid_screenshot.jpeg2880×1754 888 KB

For comparison, I tried to add a screenshot of the un-cropped image on the web server in the same browser, but the forum is only letting me post a single image because I’m a new user. You can see the full image file in the second link of my original post, anyway. I’d guess that about a third of the width has been cropped from the ends.

4

Hiya! The Academic theme was created by @neutreno. It has a dedicated issue queue and community chat.

5

Aah - are you wanting the image to be shrunk to fit within the width displayed? I assumed what you meant was having the image fill the width, which it does.

I think you’ll need to change the CSS if you want the image to be resized. You can include custom CSS in the Academic theme, and you’ll need to do some research on how images are resized in CSS (probably outside the scope of this forum, though there may be someone who can help, and you might get some help in the Academic theme support chat linked above).