Banner homepage image in classic theme

I’d like to use a banner-style homepage image with the classic theme, the banner to resize and fill the screen width. At present if I upload a background image it is fixed size, anchored top left and repeats, so the bottom and right hand size are either cut off or show a tiled effect.

The .homepage_image style has background-size: cover but this seems to be overridden by the inline background style:

In Firefox the image inspector shows the following:

element {
background: url(‘’);
background-color: rgba(0, 0, 0, 0);
background-position-x: 0%;
background-position-y: 0%;
background-repeat: repeat;
background-attachment: scroll;
background-image: url(“”);
background-size: auto;
background-origin: padding-box;
background-clip: border-box;
.homepage_image {
min-height: 35vh;
background-size: cover;
background-position: center;
display: flex;
align-items: center;
justify-content: center;

(background-size and background-position are struck out in the css panel_)

If I upload my own css I can modify min-height but I can’t get the image to resize as I want. Can anyone help?

Hi @Andrew_Johnson,

Can you indicate which version of OJS and which version of the classic theme you’re using, please?

PKP Team

Thanks for the reply.

Current OJS version:

Classic v1.0.4.0

Hi @Andrew_Johnson, thanks for reporting this. I’ve fixed this in the main branch of the theme and it should go out with the next update. However, that will likely be a version of the theme that is only compatible with OJS 3.3.

You can see how this is fixed and manually apply the fix here: Don't overwrite background-cover CSS properties for homepage image · pkp/classic@c52d63e · GitHub

1 Like

Thank you so much! This is really helpful.


1 Like

Just to be clear about this: can I apply the fix in OJS 3.2, or do I need to upgrade to 3.3 first?

OK, forget my last post. Your fix works for me. Thanks again for taking the trouble to look into this.


1 Like

This topic was automatically closed after 6 days. New replies are no longer allowed.