mirror of
https://github.com/BookStackApp/BookStack.git
synced 2026-02-09 11:19:38 +03:00
Update cover image wording to make sizing in usage clearer #4382
Reference in New Issue
Block a user
Delete Branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Originally created by @steven-loscheider on GitHub (Dec 29, 2023).
Describe the Bug
The cover images for shelves and books are not consistent. The Edit menu suggests : "This image should be approx 440x250px."
Images are cut off or have the wrong aspect ratio when uploaded. The corporate branded images I have used with exactly 440x250 px are cut off or have different aspect ratio than the original file. So it is difficult to create a coherent look.
Steps to Reproduce
Edit a shelf or book and add a cover image with the recommended size of 440x250px. If you refresh the shelf or book page, the image will not be displayed correctly as you created it.
Expected Behaviour
Image will be used 1:1 as uploaded.
Required aspect ratio and image resolution are defined in the edit menu before uploading
The original image will be used on all subsequent pages
Example to illustrate (with a realistic 250x150px image size):
Screenshots or Additional Context
No response
Browser Details
Firefox 120.0.1
Exact BookStack Version
23.10.4
@ssddanbrown commented on GitHub (Dec 29, 2023):
Hi @steven-loscheider,
The mentioned size is really just a rough guide for something of sensible size.
At no point do we promise or indicate the image will be used as per its exact original size, nor would I want to indicate/promise/support that really, since the size and aspect ratio of the area the image is used for will change in a flexible manner depending on a number of factors so suit the design.
@szabeszg commented on GitHub (Dec 29, 2023):
I recommend changing the wording so that it more accurately aligns with the intended concept. Something like:
"The recommended image size is approximately 440x250 pixels. It is advisable to test beforehand to determine what suits you best."
@steven-loscheider commented on GitHub (Jan 4, 2024):
Hi @ssddanbrown
I see. Maybe change the wording on the edit page as @szabeszg suggested to avoid any confusion. In the meantime I will rework the graphics and add some margin to make them appear properly even if they get cut off here or there.
@ssddanbrown commented on GitHub (Feb 19, 2024):
Thanks for the input.
I've now updated the wording in
16327cf40c, to better hint about the flexibility of the dimensions in use. This will be part of the next feature release.@Saturo78 commented on GitHub (Oct 7, 2025):
Hi, sorry if this is a silly question, but I just can’t figure it out.
No matter how I resize my book cover image, parts of it (like the heads of people) keep getting cropped.
Could someone please tell me what exact size or aspect ratio the cover image should have so that it’s displayed fully in BookStack?
Thank you very much for your help!
@ssddanbrown commented on GitHub (Oct 11, 2025):
@Saturo78 There is no fixed size, it's dynamic based on display options and screen dimensions.
You'd need to add custom CSS to fix sizes where desired to specific sizes/ratios.
@Saturo78 commented on GitHub (Oct 11, 2025):
I want to use this picture as a book cover: Size 440 x 250
No matter what size I set, I always get this result: