How to Make the Image Stretch to Fit the Body of discourse?

How can this image be Stretched to Full Body of the Post

How to Stretch the image and Make use of the Full Body ?

Have you tried to search? I guess you would have found similar topics.

There is a max image width and a max image height site setting. Depending on the format, the image size is limited by one of the two first. For example, this prevents images in portrait format from being too high for the screen and having to scroll excessively. So the consequences for users with different screen sizes, e.g. tablets, should be taken into account when increasing these.

4 Likes

I do not agree with you because what i ask is definitely Possible as adding ,500% at the End of Resolution as shown in the image fixes the issue on Preview But discourse does not respect the Manual Settings and keeps Capping at 100%.

on the Preview with 500% value, the resize issue seems like fixed on Preview but while i click Save Edit, The changes are not applied, the 100% settings continues to exist/prevails.

I will be very happy if someone from discourse allow us to manually enlarge the image using the above trick, Currently there seems to be a potential to get this issue fixed but needs backend work from discourse team. Hopefully a senior developer of discourse will provide the needed update for me, Thanks.

dfd231d2ee70ca5a12312fe9310cbd7aeac16f44

please copy the following and Paste it in your editor

![dfd231d2ee70ca5a12312fe9310cbd7aeac16f44|417x285, 500%](upload://gGJ8I8Q8RjuMkk9EGg1lFH11dai.gif)

You will see the GIF being immersive in the Preview Box but if i Reply/Save Edit, the changes are not being seen, Hopefully this adds more clarity on why discourse needs to offer immersion.

Edit:

Seems like issue was fixed for a while but the issue came back again.

Is this too complex to implement ?

![Screenshot Capture - 2024-08-12 - 14-31-36|4331x5001](upload://iABFNNLWZhIGR6KnQkzbEeLrKFG.jpeg)

I just noticed manually increasing the Resolution also resizes the image to fit the body of discourse in Preview

Test Text output

Edit: Doesnt Seem to work

This is Honesty bad design and Kills the Fun and Motivation to create.

Why the developers are unable to Provide a reason on why this issue is not resolved ? I expected atleast 1 team member to give a positive or negative response on this issue but so far no progress added/made.

Before i had to Make changes to document, At first, i would like to know

is this a Global Settings for all sites where discourse team set the value or individual site based setting where Admin of brave community Making Some Changes by increasing the Limit will fix the issue ?

  1. Does Waiting will Result in a fix being added or is it like discourse hasn’t reached the robust stage yet to fulfill this technical request and its time to move on where we need to accept like we need to live with this flaw ? Having Default and allowing custom rules is good But having only default and forcing the default values on everyone kills the fun/Enjoyment, its like community expecting you to do nothing but being generic.

This is a community support area so a response from a member of the team is not the norm. If you’ve identified a bug please make a bug report (Writing an effective bug report) or if you’re suggesting a new feature or improvement to ux please create a (fully-fleshed out) feature or ux topic.

Also, please be patient. Posting a feature request or bug report will be prioritised and may not pick up a response as quick as you would hope. Not all reports or requests will be responded to.

6 Likes

No my problem is not about waiting as i can wait , My Problem is not knowing whether waiting will provide a fix as someone from discourse saying, this issue will be fixed in Next week’s update,etc will help the current scenario for me… i dont want to wait for 3+ weeks and still not have this issue fixed because if this issue is categorized as impossible to fix,i can move on with other options to make changes to the document/adjusting Zoom before Screenshots to fit the body of discourse.

If i were to use the Same technique as Image 1 which is added at the beginning of this Post,i can upload the whole document within 150 images as more contents can be seen all at once, if i were to change the document width/height/font sizes, then it will take more than 400+ images to fully capture the document as the document is long.

I am unable to add the document contents directly on discourse(instead of posting screenshots of the document) is because of the following flaws

1.Lack of Custom Fonts - Currently the sites follows only the Global font which results in inability to add custom fonts
2. Font Sizing → Cannot change Font Size in brave community
3. Font Colors → Cannot Change Font Colors
4. Page background → i Cannot Set the Page background to be black as the site follows the theme settings and doesnt allow users to set Page background colors like Google Docs. For Example, Brave Community has white theme by default and Reading walls of text/long documents will cause eye strain if the background color is white.
5. Image resizing → Cannot Adjust/Resize/Crop the images easily as i can do on Google Docs.
6. Increase width → More texts can be added in a line on Google Docs whereas in discourse line breaks take place quickly due to content body being short.

Expecting all of these flaws to be fixed would be too much to ask and unrealistic expectations so i can just screenshot my document and upload it on community.

But to Reduce the number of images being added to my project, im expecting this issue to be resolved.

Currently Im using 55 inch screen and Pageless format on Google docs for my document, But Since not everyone will be using Smart TVs to use community as more users are Laptop users with 15 to 17 inch screens and Monitors with 21 to 27 inch for Desktop PCs, i have Resized the window accordingly for this use case and take screenshots,

See the Original image before Cropping

I use Desktop PC and resized browser window accordingly to what i personally feel as best Limiting factor for 15 to 17 inch Laptop Screens where there will be more number of texts/characters gets placed in a single line before line breaks takes place, For me this is satisfied state as the image does not Lose Clarity.

I could fix this issue by myself by increasing the Resizing size of the browser window and taking Screenshots to bring all of the contents into 1 single image But doing so Results in More texts/characters taking placing in a single line which Exceeds the Limit of what i would like to Set for texts/characters taking place on a single line

For Example

Cropping the Exact Text Test Improves the Immersion

While the above image seems like the issue is fixed, its more difficult to read which is the reason why i am asking this request

of course i know there are ways how to resolve the image by customizing zoom values But the Point here is while that method will work, it will end up taking 3 different images to cover up the Entire content which is Posted on the Image 1 at Start of my Post.

For Example,

Strategy works But it takes 3 images to be added to cover all of the text contents added in image 1

If discourse Gets Smart to Expand/Enlarge the images like the image 1 accordingly to fit the body of discourse, then it would make the Community and Creative Experience Great.

If this is a Fixable issue for discourse standards, i can wait, If waiting is not going to help, I Can Move to the Backup plan even after knowing its going to be a Pain and Time Consuming Process.

The other user moin complained about offering this kind of change will result in users having to Scroll Excessively, but honestly why does it have to Matter? Not interested in reading or scrolling excessively, users have the option to Exit and Leave the page, Not every user wants to do this but the users who wants to do this should be able to do it, only then its advanced community, If not and Everyone needs to follow the old ways of doing things, We are Not Evolving.

Hey there.

Are you familiar with CSS?

I think something like this might solve your issue and it’s something you can add to the customisations of the site via a Theme Component and doesn’t have to involve the developers of Discourse at all:

.cooked img:not(.thumbnail):not(.ytp-thumbnail-image):not(.emoji), .d-editor-preview img:not(.thumbnail):not(.ytp-thumbnail-image):not(.emoji) {
  width: 1000px;
}

Feel free to experiment yourself.

You can now enjoy vertical scroll to your hearts content :wink:

And keep calm :hugs:

Before:

After:

NB You will still need to click it to get the full quality image

4 Likes

Try going to “All Site Settings” filter “Max Image” @Moin tried to explain to you the site settings

@merefield has demonstrated that discourse is not as you have said stagnant. With theme-component & plugin it is very highly customizable.

Read up on CSS customizations. You can add custom fonts. With things like Google drive you can also share a doc file.

As for Documents you can adjust the site settings to allow other files to be approved for uploading. There is also a theme-component & Plugin that can load pdfs in browser pdf reader.

There are also quite a number of theme-component that change or gives options to modify how images are displayed. There is even one that gives you an option to make some edits to an image.

3 Likes

Therefore you need admin permissions and I don’t think @ArunROG87Razer has those

2 Likes

Thanks for the clarification. I missed that park skimming their walls of text posts. :wink:

I read the “my project” part and missed that it was not their forum. :facepalm: :laughing:

I have a similar issue on Air Theme but more opposite with global banner. When a global banner is set. An image causes the banner to have a side scroll bar overflow

2 Likes

Currently the document is 243 Pages with Pageless format and Lots of images being added inside Google Docs, The document is Not Finished as it is work in progress

it could be very awesome if discourse was able to Mirror Google Docs in discourse while Google docs Link are being added where discourse will be able to Make the People see the document in a way as if in the same way Google Document is being seen on the Google docs without oneboxing or altering width,height, etc… The End result should feel like in a way discourse doesnt allow users to change fonts, font colors, Page background colors, custom resizing of images but how did this user manage to Present the topic in custom fonts, different page background, custom resized images, storyboards…etc ?

Even if discourse were to offer mirror Google docs support, Google Docs currently does not have support for playing videos in docs and to keep my document fast paced and Entertaining, I have referenced lot of videos for which video embedded player needs to show up, Google docs currently cannot achieve this task…

So if there was something like Discourse Videos hub where users can upload videos and share the discourse video link in Google docs AND WHILE the Google docs document gets mirrored on a discourse community with all of the Discourse video share links seem to be added randomly in different parts of the document,-> if discourse was able to keep the original docs formatting as it is and also convert the discourse video links into video player to play the video of the link, that would be Futuristic Experience.

Initially I Planned to upload the Project on 17/8/2024 But Since the issue seems to not get easily fixed, i have to take the Hard way of capturing more images which is Going to take more time for testing, So the Next Schedule date is 24/8/2024, Really wish there was a way to actually Preview Posts before the Post is created as the current previews which is being shown on the Right Side of Preview is fake, the Preview box shows like most of the images will fit the body of discourse but once the post is created, you will find that most of the images are resized and having to open the image in Lightbox 1st for Reading is not convincing especially if the user has to do it for all of the images… So this Needs some Extensive testing, Currently i have planned to target one of my old post which is closed on brave community and use the edit feature to create temp drafts to see how the document will look, for example, if i added a simple reply like

XXX XXXXX XXX XXX

i will edit the reply of the post with new doc contents, once in a while, i will save edit and will see how the new document preview which has covered 10% of the document seems to be displayed on discourse after the reply is added, once i am satisfied with the way how it looks or found any images for the parts of google docs screenshots which needs optimization, i will notice the areas and upload newer image to get the fixes applied, once fully satisfied with 10%, i will edit the reply back again with the original initial reply which seem to be added for the post XXX XXXXX XXX XXX, Save that old reply as edit and Move on to the Next 10%(after copying the 1st 10% to New topic draft found on home page), Repeat the Process for upto/Until 100%.

This is unnecessary extra work But what do you expect me to do if discourse preview feature is lie and discourse does not have the motivation to fix the issue, I will Make a Loom video of the Entire Project after the document is fully uploaded to discourse, the way how it gets showed in Preview and how i managed to get the Exact Look after the topic has been Published, The Goal is to Preserve Immersion and i take discourse resize feature inability as a test to See how i End up overcoming this issue.

Is this what you’re looking for?

1 Like

I’ve already provided a simple CSS solution.

And was ignored.

5 Likes

If you don’t have admin access and you really want to display things in a certain way for your own browsing experience on the Brave forum, then use the CSS that Robert posted in a stylesheet browser extension like Stylus. Brave can likely use the Chrome version. For example, I have some CSS hackery running on Meta to revert the avatars in user menu and change the sidebar formatting for my own liking, as well as some other fun customizations.

5 Likes

Sorry i did not ignore you

Losing quality is not what i wanted, i wanted discourse to force an update on all communities using a software update where this feature will become available for everyone in the Topic Creator without the interference of admin having to activate it in admin settings or making a decision.

If you have Access to Win 8.1 or Win 7, You can check these settings

I Still use Windows 8.1, Im expecting a Similar “Fill” Setting.

Whether discourse is willing to work on offering this solution or not, i will Get the Project uploaded on 24/8/2024, What could Possibly be 1 day of work(if discourse had been robust and offered flexibility), its going to take 5 to 7 days of Extra work for getting the task done without the help of discourse. Im Still working on updating Google Docs as it will take Extra 2 or 3 days to finish up, If by chance discourse was able to create Magic within the next 3 days and offered a solution, its going to help the scenario for me, if not, i will still mange to Get the Project done using alternative backup plan of Extra images.

(Quick note, this post is purely my own opinions)

IMO that’s pretty against how Discourse works, the point is that admins can customize their community as they need to.

Changing something for new installs is fair game, but IMO bigger changes should be heavily considered before being changed for existing installs, if done at all.

6 Likes

Why not see if your admin maybe install Inline pdf previews plugin or theme component?

And see if you can convert your document to pdf format?

https://helpx.adobe.com/ca/acrobat/using/rich-media.html

1 Like

I use 175% zoom as default for Most Websites and I have Just Reduced my zoom to 100% and the one thing which i find unusual in Empty Spaces in the Right area…

I never used these features and 90% of the topics on brave community has only 5 to 8 replies in a topic, so giving importance to this right slider and ultimately breaking the immersion is not a good idea

I suggest to redesign the feature and use the bottom right area to place these buttons, Aug 12 in the 1st box and Aug 18 in the 2nd box, clicking either of these 2 buttons will Pop up the slider to allow users to fine tune the reply position on which date/user they want to reach.

If this is moved away, it delivers the opportunity to maximize width for as long as the user screen size allows instead of having a certain threshold and compressing images, quicker line breaks…etc.

Either way, I Can understand Environments Quickly and it seems like the solution wont be offered that easily, Previously i was hesitant to choose with method to implement for Project upload, Whether should i wait or Do it yourself(Extra images)

Im proceeding with my own way to Get the work done

I have been testing with resizing and did some improvements, With the Final Result, I have been testing Ruler test to see how the image will Look on 15.6 inch Laptops to 17.3 inch Laptops as they have been used widely…
ezgif-4-ae04e9254b

i do not have Laptops to Perform the test now, So it will be helpful if someone who has Laptops can say which image looks easier to read and why the image which you select should be considered.

i have divided Image A and Image B texts into Paragraphs, Image A contains 4 Paragraphs, Image B is Just Image A(only contains 1st two Paragraphs)

Image A:

Image B:

I do not have interest in smartphones so i am not going to check nor i am going to care how the project will look on smartphones, At the Start of my document, the 1st line which i have added is

Recommendations: Use PC/Smart TV to View this Project, Not on a Smartphone.

@Firepup650 Most community admins wont have the time to check the updates done on discourse frequently, For Example, Brave Community, I have not seen much changes happening in the community just as in the same way as i am experiencing the changes here and thats because admins do not have the time to check everything daily so releasing a feature and making it only as news and only on update changelog will result in most of the time features going unnoticed so its best to offer features via software update, Activate it by default, Send Notifications to Admin about the Recent Features being Activated on the community and making it super easier to turn off the features just in case if they were not being happy about the feature being around or implemented in their community, In Most case, The Problem may not be with the features itself, but if the features were designed in a way to be installed on community and all communities have to settle with the changes where they are locked out from reverting the changes, so if the features can be turned off, There wont be much problems as you making it out to be.

For Example, Discourse Can Get a Little More Robust to activate Black theme Easily Like Bard and Force this update on all communities

Reddit uses Black theme by default, Bard uses Black theme by default, So there is Nothing wrong if all of a sudden discourse manages to find a way to implement this kind of easy activation of black theme and force the black theme to be updated on all websites so that in a way if discourse were to update their software with this easy theme change by clicking on Profile icon today and Some brave community users who opens the websites tomorrow will be surprised discourse finally started to Give some importance to black themes. In case someone doesnt like it and wants to revert the outdated Light themes, they could easily do it by clicking on the Profile Icon.

Not Exactly Accurate But You should Get the idea of What i am trying to illustrate here.

Excellent suggestion :+1:

Here’s the Theme Component.

2 Likes